2017-10-17 48 views
0

我創建了2個SVG,其中一個使用了vivius來勾畫輪廓,另一個使用vivius填充輪廓!但是我不能讓它在一個包裝div中居中!這裏是我的代碼....在Dynamic Div中創建動畫SVG中心

<div id="homeWrapper"> 
     <div id="big-logo"> 
     <div id="svg-wrapper"> 
      <div id="svg-layer"> 
      <svg id="CCMS-animated" width="671.712px" height="74.875px" viewBox="249.863 47.554 671.712 74.875"> 
      <g> 
       <g> 
       <path d="M278.583,53.794h-22.52v16.32h22.52v6.24h-22.8c-1.654,0-3.054-0.573-4.2-1.72 
        c-1.147-1.146-1.72-2.546-1.72-4.2v-16.96c0-1.653,0.573-3.053,1.72-4.2c1.146-1.146,2.546-1.72,4.2-1.72h22.8V53.794z"/> 
       <path d="M288.862,47.554v22.56h16.32v-22.56h6.28v22.88c0,1.627-0.58,3.02-1.74,4.18 
        c-1.16,1.16-2.554,1.74-4.18,1.74h-16.96c-1.654,0-3.054-0.573-4.2-1.72c-1.147-1.146-1.72-2.546-1.72-4.2v-22.88H288.862z"/> 
       <path d="M344.461,53.474v2.68h-6.28v-2.36h-16.32v5.04h16.68c1.626,0,3.02,0.58,4.18,1.74 
        c1.16,1.16,1.74,2.554,1.74,4.18v5.68c0,1.627-0.58,3.02-1.74,4.18c-1.16,1.16-2.554,1.74-4.18,1.74h-16.96 
        c-1.627,0-3.02-0.573-4.18-1.72c-1.16-1.146-1.74-2.546-1.74-4.2v-2.68h6.2v2.36h16.32v-5.04h-16.6c-1.627,0-3.02-0.573-4.18-1.72 
        c-1.16-1.146-1.74-2.546-1.74-4.2v-5.68c0-1.653,0.58-3.053,1.74-4.2c1.16-1.146,2.553-1.72,4.18-1.72h16.96 
        c1.626,0,3.02,0.58,4.18,1.74C343.881,50.454,344.461,51.848,344.461,53.474z"/> 
       <path d="M347.301,47.554h28.8v6.24h-11.28v22.56h-6.24v-22.56h-11.28V47.554z"/> 
       <path d="M384.941,47.554H401.9c1.627,0,3.021,0.58,4.181,1.74c1.159,1.16,1.739,2.554,1.739,4.18v16.96 
        c0,1.627-0.58,3.02-1.739,4.18c-1.16,1.16-2.554,1.74-4.181,1.74h-16.959c-1.654,0-3.055-0.573-4.201-1.72 
        c-1.146-1.146-1.719-2.546-1.719-4.2v-16.96c0-1.653,0.572-3.053,1.719-4.2C381.887,48.128,383.287,47.554,384.941,47.554z 
        M385.221,53.794v16.32h16.32v-16.32H385.221z"/> 
       <path d="M428.381,59.194l9.72-11.64h6.44v28.8h-6.24v-19.32l-9.92,11.84l-9.961-11.8v19.28h-6.199v-28.8h6.4 
        L428.381,59.194z"/> 
       <path d="M476.02,47.554v6.24H455.7v5.04h16.36v6.24H455.7v5.04h20.319v6.24h-26.6v-28.8H476.02z"/> 
       <path d="M508.74,53.514v7.44c0,1.627-0.588,3.02-1.76,4.18c-1.174,1.16-2.574,1.74-4.201,1.74H502.5l6.24,7.36 
        v2.12h-6.4l-7.96-9.48l-8.24,0.04c0.08,0,0.12,0.08,0.12,0.24c-0.054,0-0.094-0.013-0.12-0.04v9.24h-6.2v-28.76h22.84 
        c1.627,0,3.027,0.58,4.201,1.74C508.152,50.494,508.74,51.888,508.74,53.514z M486.14,53.794v6.84h16.32v-6.84H486.14z"/> 
       </g> 
      </g> 
      </svg> 
      </div> 
      <div id="svg-layer"> 
      <svg id="CCMS-white" width="671.712px" height="74.875px" viewBox="249.863 47.554 671.712 74.875"> 
      <g> 
       <g> 
       <path d="M278.583,53.794h-22.52v16.32h22.52v6.24h-22.8c-1.654,0-3.054-0.573-4.2-1.72 
        c-1.147-1.146-1.72-2.546-1.72-4.2v-16.96c0-1.653,0.573-3.053,1.72-4.2c1.146-1.146,2.546-1.72,4.2-1.72h22.8V53.794z"/> 
       <path d="M288.862,47.554v22.56h16.32v-22.56h6.28v22.88c0,1.627-0.58,3.02-1.74,4.18 
        c-1.16,1.16-2.554,1.74-4.18,1.74h-16.96c-1.654,0-3.054-0.573-4.2-1.72c-1.147-1.146-1.72-2.546-1.72-4.2v-22.88H288.862z"/> 
       <path d="M344.461,53.474v2.68h-6.28v-2.36h-16.32v5.04h16.68c1.626,0,3.02,0.58,4.18,1.74 
        c1.16,1.16,1.74,2.554,1.74,4.18v5.68c0,1.627-0.58,3.02-1.74,4.18c-1.16,1.16-2.554,1.74-4.18,1.74h-16.96 
        c-1.627,0-3.02-0.573-4.18-1.72c-1.16-1.146-1.74-2.546-1.74-4.2v-2.68h6.2v2.36h16.32v-5.04h-16.6c-1.627,0-3.02-0.573-4.18-1.72 
        c-1.16-1.146-1.74-2.546-1.74-4.2v-5.68c0-1.653,0.58-3.053,1.74-4.2c1.16-1.146,2.553-1.72,4.18-1.72h16.96 
        c1.626,0,3.02,0.58,4.18,1.74C343.881,50.454,344.461,51.848,344.461,53.474z"/> 
       <path d="M347.301,47.554h28.8v6.24h-11.28v22.56h-6.24v-22.56h-11.28V47.554z"/> 
       <path d="M384.941,47.554H401.9c1.627,0,3.021,0.58,4.181,1.74c1.159,1.16,1.739,2.554,1.739,4.18v16.96 
        c0,1.627-0.58,3.02-1.739,4.18c-1.16,1.16-2.554,1.74-4.181,1.74h-16.959c-1.654,0-3.055-0.573-4.201-1.72 
        c-1.146-1.146-1.719-2.546-1.719-4.2v-16.96c0-1.653,0.572-3.053,1.719-4.2C381.887,48.128,383.287,47.554,384.941,47.554z 
        M385.221,53.794v16.32h16.32v-16.32H385.221z"/> 
       <path d="M428.381,59.194l9.72-11.64h6.44v28.8h-6.24v-19.32l-9.92,11.84l-9.961-11.8v19.28h-6.199v-28.8h6.4 
        L428.381,59.194z"/> 
       <path d="M476.02,47.554v6.24H455.7v5.04h16.36v6.24H455.7v5.04h20.319v6.24h-26.6v-28.8H476.02z"/> 
       <path d="M508.74,53.514v7.44c0,1.627-0.588,3.02-1.76,4.18c-1.174,1.16-2.574,1.74-4.201,1.74H502.5l6.24,7.36 
        v2.12h-6.4l-7.96-9.48l-8.24,0.04c0.08,0,0.12,0.08,0.12,0.24c-0.054,0-0.094-0.013-0.12-0.04v9.24h-6.2v-28.76h22.84 
        c1.627,0,3.027,0.58,4.201,1.74C508.152,50.494,508.74,51.888,508.74,53.514z M486.14,53.794v6.84h16.32v-6.84H486.14z"/> 
       </g> 
      </g> 
      </svg> 
     </div> 
     </div> 
     </div> 
    </div> 

這裏是CSS樣式吧...

#homeWrapper {float:left;width:90%;height:80%;margin:8% 5% auto 5%;display:block} 
#homeWrapper #big-logo {float: left; 
height: 224px; 
width: 60%; 
margin: 4% 20% 0 20%; 
display: block;} 
#homeWrapper #big-logo #svg-wrapper {height: 80px; 
width: 100%; 
float: left; 
margin-bottom: 20px;} 
#homeWrapper #big-logo #svg-wrapper:after {content:"";display:table;clear:both} 
#homeWrapper #big-logo #svg-wrapper #svg-layer {position:absolute} 
#homeWrapper #big-logo #svg-wrapper #svg-layer:after {content:"";display:table;clear:both} 
#homeWrapper #big-logo #svg-wrapper #svg-layer #CCMS-animated { 
    fill:none; 
    stroke:rgba(255,255,255,.5); 
    stroke-width:1.25px; 
    -webkit-animation:fadeOut 1s 2.75s ease; 
    -moz-animation:fadeOut 1s 2.75s ease; 
    animation:fadeOut 1s 2.75s ease; 
    -webkit-animation-fill-mode:forwards; 
    -moz-animation-fill-mode:forwards; 
    animation-fill-mode:forwards 
} 
#homeWrapper #big-logo #svg-wrapper #svg-layer #CCMS-white { 
    fill:#fff; 
    opacity:0; 
    -webkit-animation:fadeIn 2s ease; 
    -moz-animation:fadeIn 2s ease; 
    animation:fadeIn 2s ease; 
    -webkit-animation-delay: 2s; 
    -moz-animation-delay: 2s; 
    animation-delay: 2s; 
    -webkit-animation-fill-mode:forwards; 
    -moz-animation-fill-mode:forwards; 
    animation-fill-mode:forwards 
} 
@-webkit-keyframes fadeIn {from {opacity:0} to {opacity:1}} 
@-moz-keyframes fadeIn {from {opacity:0} to {opacity:1}} 
@keyframes fadeIn {from {opacity:0} to {opacity:1}} 
@-webkit-keyframes fadeOut {from {opacity:1} to {opacity:0}} 
@-moz-keyframes fadeOut {from {opacity:1} to {opacity:0}} 
@keyframes fadeOut {from {opacity:1} to {opacity:0}} 

我使用JavaScript來描繪它,不過我只是想中心的圖片我將離開它!我還創建了一個小提琴顯示它應該如何工作HERE

回答

0

這裏的小提琴代碼來解決這個問題:

$.stellar(),$(document).ready(function(){new Vivus("CCMS-animated",{type:"delayed",duration:600,animTimingFunction:Vivus.EASE_OUT})}),function(){var t,n,e,a,r,i,l;(r=[]).push({delay:2e3,text:"OpenText Exstream Specalists"}),n=$("#typed-wrapper"),e=$("#message"),t=$("#animate"),a=null,l=function(t,n,e){var a,r,i,l,u,o,s,h,f,p,c,d,g,m,v,y,x,b,M,T,k,E,O,S,w,C,V;for(i={probability:.2,glitches:"-|/\\",blank:"",duration:120*n.length,ease:"easeInOutQuad",delay:4e3},a=$(t),O=$.extend(i,e),function(){if(Math.random()<.5)return 1;retun},V=function(t,n){return'<span class="'+n+'">'+t+"</span>"},d=O.glitches,p=(f=d.split("")).length,c=O.probability,g=function(){var t,n,e;for(e=[],t=0,n=f.length;t<n;t++)y=f[t],e.push(V(y,"glitch"));return e}(),o=a.text(),(u=o.split("")).length,s=function(){var t,n,e;for(e=[],t=0,n=u.length;t<n;t++)y=u[t],e.push(V(y,"ghost"));return e}(),w=n.split(""),C=w.length,b=function(){E=[];for(var t=0;0<=C?t<C:t>C;0<=C?t++:t--)E.push(t);return E}.apply(this).sort(this.shuffle),M=[],m=v=0,k=C;0<=k?v<k:v>k;m=0<=k?++v:--v)h=g[Math.floor(Math.random()*(p-1))],l=s[m]||O.blank,r=Math.random()<c?h:l,M.push(r);return x={value:0},S={value:1},T={duration:O.duration,ease:O.ease,step:function(){var t,n,e,r;for(e=Math.floor(x.value*(C-1)),m=n=0,r=e;0<=r?n<=r:n;m=0<=r?++n:--n)t=b[m],M[t]=w[t];return a.html(M.join(""))},complete:function(){return a.html(n)}},$(x).delay(O.delay).animate(S,T)},i=function(){var t,n,e,i,u,o;for(e=i=0,u=r.length;i<u;e=++i)t=r[e],(n=a.get(e)).innerText="",o={delay:t.delay},l(n,t.text,o)},function(){var l,u,o;for(t.click(i),l=u=0,o=r.length;u<o;l=++u)r[l],e.append("<h2>");a=n.find("h2"),i()}()}.call(this);
body {background:#ccc} 
 
#homeWrapper {width:90%;height:100%;margin: 0 auto; text-align: center; display:block} 
 
#homeWrapper #big-logo { 
 

 
display: block;} 
 
#homeWrapper #big-logo #svg-wrapper:after {content:"";display:table;clear:both} 
 

 
#homeWrapper #big-logo #svg-wrapper #svg-layer:after {content:"";display:table;clear:both} 
 
#homeWrapper #big-logo #svg-wrapper #svg-layer #CCMS-animated { 
 
    fill:none; 
 
    stroke:rgba(255,255,255,.5); 
 
    stroke-width:1.25px; 
 
    -webkit-animation:fadeOut 1s 2.75s ease; 
 
    -moz-animation:fadeOut 1s 2.75s ease; 
 
    animation:fadeOut 1s 2.75s ease; 
 
    -webkit-animation-fill-mode:forwards; 
 
    -moz-animation-fill-mode:forwards; 
 
    animation-fill-mode:forwards 
 
} 
 
#homeWrapper #big-logo #svg-wrapper #svg-layer #CCMS-white { 
 
    fill:#fff; 
 
    opacity:0; 
 
    -webkit-animation:fadeIn 2s ease; 
 
    -moz-animation:fadeIn 2s ease; 
 
    animation:fadeIn 2s ease; 
 
    -webkit-animation-delay: 2s; 
 
    -moz-animation-delay: 2s; 
 
    animation-delay: 2s; 
 
    -webkit-animation-fill-mode:forwards; 
 
    -moz-animation-fill-mode:forwards; 
 
    animation-fill-mode:forwards 
 
} 
 
@-webkit-keyframes fadeIn {from {opacity:0} to {opacity:1}} 
 
@-moz-keyframes fadeIn {from {opacity:0} to {opacity:1}} 
 
@keyframes fadeIn {from {opacity:0} to {opacity:1}} 
 
@-webkit-keyframes fadeOut {from {opacity:1} to {opacity:0}} 
 
@-moz-keyframes fadeOut {from {opacity:1} to {opacity:0}} 
 
@keyframes fadeOut {from {opacity:1} to {opacity:0}}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="homeWrapper"> 
 
     <div id="big-logo"> 
 
     <div id="svg-wrapper"> 
 
      <div id="svg-layer"> 
 
      <svg id="CCMS-animated" width="671.712px" height="74.875px" viewBox="249.863 47.554 671.712 74.875"> 
 
      <g> 
 
       <g> 
 
       <path d="M278.583,53.794h-22.52v16.32h22.52v6.24h-22.8c-1.654,0-3.054-0.573-4.2-1.72 
 
        c-1.147-1.146-1.72-2.546-1.72-4.2v-16.96c0-1.653,0.573-3.053,1.72-4.2c1.146-1.146,2.546-1.72,4.2-1.72h22.8V53.794z"/> 
 
       <path d="M288.862,47.554v22.56h16.32v-22.56h6.28v22.88c0,1.627-0.58,3.02-1.74,4.18 
 
        c-1.16,1.16-2.554,1.74-4.18,1.74h-16.96c-1.654,0-3.054-0.573-4.2-1.72c-1.147-1.146-1.72-2.546-1.72-4.2v-22.88H288.862z"/> 
 
       <path d="M344.461,53.474v2.68h-6.28v-2.36h-16.32v5.04h16.68c1.626,0,3.02,0.58,4.18,1.74 
 
        c1.16,1.16,1.74,2.554,1.74,4.18v5.68c0,1.627-0.58,3.02-1.74,4.18c-1.16,1.16-2.554,1.74-4.18,1.74h-16.96 
 
        c-1.627,0-3.02-0.573-4.18-1.72c-1.16-1.146-1.74-2.546-1.74-4.2v-2.68h6.2v2.36h16.32v-5.04h-16.6c-1.627,0-3.02-0.573-4.18-1.72 
 
        c-1.16-1.146-1.74-2.546-1.74-4.2v-5.68c0-1.653,0.58-3.053,1.74-4.2c1.16-1.146,2.553-1.72,4.18-1.72h16.96 
 
        c1.626,0,3.02,0.58,4.18,1.74C343.881,50.454,344.461,51.848,344.461,53.474z"/> 
 
       <path d="M347.301,47.554h28.8v6.24h-11.28v22.56h-6.24v-22.56h-11.28V47.554z"/> 
 
       <path d="M384.941,47.554H401.9c1.627,0,3.021,0.58,4.181,1.74c1.159,1.16,1.739,2.554,1.739,4.18v16.96 
 
        c0,1.627-0.58,3.02-1.739,4.18c-1.16,1.16-2.554,1.74-4.181,1.74h-16.959c-1.654,0-3.055-0.573-4.201-1.72 
 
        c-1.146-1.146-1.719-2.546-1.719-4.2v-16.96c0-1.653,0.572-3.053,1.719-4.2C381.887,48.128,383.287,47.554,384.941,47.554z 
 
        M385.221,53.794v16.32h16.32v-16.32H385.221z"/> 
 
       <path d="M428.381,59.194l9.72-11.64h6.44v28.8h-6.24v-19.32l-9.92,11.84l-9.961-11.8v19.28h-6.199v-28.8h6.4 
 
        L428.381,59.194z"/> 
 
       <path d="M476.02,47.554v6.24H455.7v5.04h16.36v6.24H455.7v5.04h20.319v6.24h-26.6v-28.8H476.02z"/> 
 
       <path d="M508.74,53.514v7.44c0,1.627-0.588,3.02-1.76,4.18c-1.174,1.16-2.574,1.74-4.201,1.74H502.5l6.24,7.36 
 
        v2.12h-6.4l-7.96-9.48l-8.24,0.04c0.08,0,0.12,0.08,0.12,0.24c-0.054,0-0.094-0.013-0.12-0.04v9.24h-6.2v-28.76h22.84 
 
        c1.627,0,3.027,0.58,4.201,1.74C508.152,50.494,508.74,51.888,508.74,53.514z M486.14,53.794v6.84h16.32v-6.84H486.14z"/> 
 
       </g> 
 
       <g> 
 
       <path d="M567.46,53.794h-22.52v16.32h22.52v6.24h-22.8c-1.654,0-3.054-0.573-4.2-1.72 
 
        c-1.146-1.146-1.72-2.546-1.72-4.2v-16.96c0-1.653,0.573-3.053,1.72-4.2c1.146-1.146,2.546-1.72,4.2-1.72h22.8V53.794z"/> 
 
       <path d="M577.46,47.554h16.96c1.626,0,3.02,0.58,4.18,1.74s1.74,2.554,1.74,4.18v16.96 
 
        c0,1.627-0.58,3.02-1.74,4.18c-1.16,1.16-2.554,1.74-4.18,1.74h-16.96c-1.654,0-3.054-0.573-4.2-1.72 
 
        c-1.146-1.146-1.72-2.546-1.72-4.2v-16.96c0-1.653,0.573-3.053,1.72-4.2C574.406,48.128,575.806,47.554,577.46,47.554z 
 
        M577.74,53.794v16.32h16.319v-16.32H577.74z"/> 
 
       <path d="M620.899,59.194l9.72-11.64h6.439v28.8h-6.239v-19.32l-9.92,11.84l-9.96-11.8v19.28h-6.2v-28.8h6.399 
 
        L620.899,59.194z"/> 
 
       <path d="M658.02,59.194l9.72-11.64h6.439v28.8h-6.239v-19.32l-9.92,11.84l-9.96-11.8v19.28h-6.2v-28.8h6.399 
 
        L658.02,59.194z"/> 
 
       <path d="M685.099,47.554v22.56h16.319v-22.56h6.28v22.88c0,1.627-0.58,3.02-1.74,4.18 
 
        c-1.16,1.16-2.554,1.74-4.18,1.74h-16.96c-1.654,0-3.054-0.573-4.2-1.72c-1.146-1.146-1.72-2.546-1.72-4.2v-22.88H685.099z"/> 
 
       <path d="M734.618,66.754v-19.2h6.28v28.8h-6.4l-16.199-19.28v19.28h-6.2v-28.8h6.399L734.618,66.754z"/> 
 
       <path d="M745.418,76.354v-28.8h6.239v28.8H745.418z"/> 
 
       <path d="M782.897,53.794h-22.52v16.32h22.52v6.24h-22.8c-1.654,0-3.054-0.573-4.2-1.72 
 
        c-1.146-1.146-1.72-2.546-1.72-4.2v-16.96c0-1.653,0.573-3.053,1.72-4.2c1.146-1.146,2.546-1.72,4.2-1.72h22.8V53.794z"/> 
 
       <path d="M793.057,47.554h16.92c1.653,0,3.06,0.58,4.22,1.74s1.74,2.554,1.74,4.18v22.88h-6.28v-9.28h-16.32v9.28 
 
        h-6.199v-22.88c0-1.653,0.573-3.053,1.72-4.2C790.003,48.128,791.402,47.554,793.057,47.554z M793.336,60.834h16.32v-7.04h-16.32 
 
        V60.834z"/> 
 
       <path d="M819.057,47.554h28.8v6.24h-11.279v22.56h-6.24v-22.56h-11.28V47.554z"/> 
 
       <path d="M850.896,76.354v-28.8h6.239v28.8H850.896z"/> 
 
       <path d="M865.496,47.554h16.96c1.626,0,3.02,0.58,4.18,1.74s1.74,2.554,1.74,4.18v16.96 
 
        c0,1.627-0.58,3.02-1.74,4.18c-1.16,1.16-2.554,1.74-4.18,1.74h-16.96c-1.654,0-3.054-0.573-4.2-1.72 
 
        c-1.146-1.146-1.72-2.546-1.72-4.2v-16.96c0-1.653,0.573-3.053,1.72-4.2C862.442,48.128,863.842,47.554,865.496,47.554z 
 
        M865.776,53.794v16.32h16.319v-16.32H865.776z"/> 
 
       <path d="M915.295,66.754v-19.2h6.28v28.8h-6.4l-16.199-19.28v19.28h-6.2v-28.8h6.399L915.295,66.754z"/> 
 
       </g> 
 
      </g> 
 
      <g> 
 
       <g> 
 
       <path d="M304.481,105.269l9.72-11.64h6.44v28.8h-6.24v-19.32l-9.92,11.84l-9.96-11.8v19.28h-6.2v-28.8h6.4 
 
        L304.481,105.269z"/> 
 
       <path d="M331.441,93.629h16.919c1.654,0,3.061,0.58,4.221,1.74c1.16,1.159,1.74,2.554,1.74,4.18v22.88h-6.281 
 
        v-9.28h-16.319v9.28h-6.2v-22.88c0-1.653,0.573-3.054,1.72-4.2C328.387,94.202,329.787,93.629,331.441,93.629z M331.721,106.909 
 
        h16.319v-7.04h-16.319V106.909z"/> 
 
       <path d="M381.4,112.829v-19.2h6.28v28.8h-6.4l-16.199-19.28v19.28h-6.2v-28.8h6.399L381.4,112.829z"/> 
 
       <path d="M398.16,93.629h16.92c1.653,0,3.06,0.58,4.22,1.74c1.16,1.159,1.74,2.554,1.74,4.18v22.88h-6.28v-9.28 
 
        h-16.32v9.28h-6.199v-22.88c0-1.653,0.573-3.054,1.72-4.2S396.506,93.629,398.16,93.629z M398.439,106.909h16.32v-7.04h-16.32 
 
        V106.909z"/> 
 
       <path d="M454.4,99.549v2.72h-6.28v-2.399h-16.319v16.319h16.319v-4.319h-6.24v-6.24H454.4v10.88 
 
        c0,1.627-0.58,3.02-1.74,4.18s-2.566,1.74-4.22,1.74h-16.92c-1.654,0-3.054-0.573-4.2-1.72s-1.72-2.547-1.72-4.2v-16.96 
 
        c0-1.653,0.573-3.054,1.72-4.2s2.546-1.72,4.2-1.72h16.92c1.653,0,3.06,0.58,4.22,1.74C453.82,96.529,454.4,97.923,454.4,99.549z" 
 
        /> 
 
       <path d="M485.479,93.629v6.24h-20.32v5.04h16.36v6.239h-16.36v5.04h20.32v6.24h-26.6v-28.8H485.479z"/> 
 
       <path d="M504.84,105.269l9.72-11.64h6.439v28.8h-6.239v-19.32l-9.92,11.84l-9.96-11.8v19.28h-6.2v-28.8h6.399 
 
        L504.84,105.269z"/> 
 
       <path d="M552.479,93.629v6.24h-20.32v5.04h16.36v6.239h-16.36v5.04h20.32v6.24h-26.6v-28.8H552.479z"/> 
 
       <path d="M578.958,112.829v-19.2h6.28v28.8h-6.4l-16.199-19.28v19.28h-6.2v-28.8h6.399L578.958,112.829z"/> 
 
       <path d="M588.278,93.629h28.8v6.24h-11.279v22.56h-6.24v-22.56h-11.28V93.629z"/> 
 
       </g> 
 
       <g> 
 
       <path d="M675.921,99.549v2.68h-6.28v-2.359h-16.319v5.04h16.68c1.626,0,3.021,0.579,4.18,1.739 
 
        c1.16,1.16,1.74,2.554,1.74,4.181v5.68c0,1.627-0.58,3.02-1.74,4.18c-1.159,1.16-2.554,1.74-4.18,1.74h-16.96 
 
        c-1.627,0-3.02-0.573-4.18-1.72s-1.74-2.547-1.74-4.2v-2.68h6.2v2.359h16.319v-5.04h-16.6c-1.627,0-3.02-0.573-4.18-1.72 
 
        s-1.74-2.546-1.74-4.2v-5.68c0-1.653,0.58-3.054,1.74-4.2s2.553-1.72,4.18-1.72h16.96c1.626,0,3.021,0.58,4.18,1.74 
 
        C675.341,96.529,675.921,97.923,675.921,99.549z"/> 
 
       <path d="M706.881,93.629v6.24h-20.32v5.04h16.36v6.239h-16.36v5.04h20.32v6.24h-26.6v-28.8H706.881z"/> 
 
       <path d="M739.601,99.589v7.439c0,1.627-0.587,3.021-1.76,4.181c-1.174,1.16-2.574,1.739-4.2,1.739h-0.28l6.24,7.36 
 
        v2.12h-6.4l-7.96-9.48l-8.239,0.04c0.08,0,0.119,0.08,0.119,0.24c-0.054,0-0.094-0.013-0.119-0.04v9.24h-6.2v-28.76h22.84 
 
        c1.626,0,3.026,0.58,4.2,1.74C739.014,96.569,739.601,97.963,739.601,99.589z M717.001,99.869v6.84h16.319v-6.84H717.001z"/> 
 
       <path d="M760.96,114.549l12.08-20.92h7.16l-16.68,28.8h-5.16l-16.68-28.8h7.199L760.96,114.549z"/> 
 
       <path d="M782.681,122.429v-28.8h6.239v28.8H782.681z"/> 
 
       <path d="M820.16,99.869h-22.52v16.319h22.52v6.24h-22.8c-1.654,0-3.054-0.573-4.2-1.72s-1.72-2.547-1.72-4.2 
 
        v-16.96c0-1.653,0.573-3.054,1.72-4.2s2.546-1.72,4.2-1.72h22.8V99.869z"/> 
 
       <path d="M850.999,93.629v6.24h-20.32v5.04h16.36v6.239h-16.36v5.04h20.32v6.24h-26.6v-28.8H850.999z"/> 
 
       <path d="M883.559,99.549v2.68h-6.28v-2.359h-16.319v5.04h16.68c1.626,0,3.021,0.579,4.18,1.739 
 
        c1.16,1.16,1.74,2.554,1.74,4.181v5.68c0,1.627-0.58,3.02-1.74,4.18c-1.159,1.16-2.554,1.74-4.18,1.74h-16.96 
 
        c-1.627,0-3.02-0.573-4.18-1.72s-1.74-2.547-1.74-4.2v-2.68h6.2v2.359h16.319v-5.04h-16.6c-1.627,0-3.02-0.573-4.18-1.72 
 
        s-1.74-2.546-1.74-4.2v-5.68c0-1.653,0.58-3.054,1.74-4.2s2.553-1.72,4.18-1.72h16.96c1.626,0,3.021,0.58,4.18,1.74 
 
        C882.979,96.529,883.559,97.923,883.559,99.549z"/> 
 
       </g> 
 
      </g> 
 
      </svg> 
 
      </div> 
 
      <div id="svg-layer"> 
 
      <svg id="CCMS-white" width="671.712px" height="74.875px" viewBox="249.863 47.554 671.712 74.875"> 
 
      <g> 
 
       <g> 
 
       <path d="M278.583,53.794h-22.52v16.32h22.52v6.24h-22.8c-1.654,0-3.054-0.573-4.2-1.72 
 
        c-1.147-1.146-1.72-2.546-1.72-4.2v-16.96c0-1.653,0.573-3.053,1.72-4.2c1.146-1.146,2.546-1.72,4.2-1.72h22.8V53.794z"/> 
 
       <path d="M288.862,47.554v22.56h16.32v-22.56h6.28v22.88c0,1.627-0.58,3.02-1.74,4.18 
 
        c-1.16,1.16-2.554,1.74-4.18,1.74h-16.96c-1.654,0-3.054-0.573-4.2-1.72c-1.147-1.146-1.72-2.546-1.72-4.2v-22.88H288.862z"/> 
 
       <path d="M344.461,53.474v2.68h-6.28v-2.36h-16.32v5.04h16.68c1.626,0,3.02,0.58,4.18,1.74 
 
        c1.16,1.16,1.74,2.554,1.74,4.18v5.68c0,1.627-0.58,3.02-1.74,4.18c-1.16,1.16-2.554,1.74-4.18,1.74h-16.96 
 
        c-1.627,0-3.02-0.573-4.18-1.72c-1.16-1.146-1.74-2.546-1.74-4.2v-2.68h6.2v2.36h16.32v-5.04h-16.6c-1.627,0-3.02-0.573-4.18-1.72 
 
        c-1.16-1.146-1.74-2.546-1.74-4.2v-5.68c0-1.653,0.58-3.053,1.74-4.2c1.16-1.146,2.553-1.72,4.18-1.72h16.96 
 
        c1.626,0,3.02,0.58,4.18,1.74C343.881,50.454,344.461,51.848,344.461,53.474z"/> 
 
       <path d="M347.301,47.554h28.8v6.24h-11.28v22.56h-6.24v-22.56h-11.28V47.554z"/> 
 
       <path d="M384.941,47.554H401.9c1.627,0,3.021,0.58,4.181,1.74c1.159,1.16,1.739,2.554,1.739,4.18v16.96 
 
        c0,1.627-0.58,3.02-1.739,4.18c-1.16,1.16-2.554,1.74-4.181,1.74h-16.959c-1.654,0-3.055-0.573-4.201-1.72 
 
        c-1.146-1.146-1.719-2.546-1.719-4.2v-16.96c0-1.653,0.572-3.053,1.719-4.2C381.887,48.128,383.287,47.554,384.941,47.554z 
 
        M385.221,53.794v16.32h16.32v-16.32H385.221z"/> 
 
       <path d="M428.381,59.194l9.72-11.64h6.44v28.8h-6.24v-19.32l-9.92,11.84l-9.961-11.8v19.28h-6.199v-28.8h6.4 
 
        L428.381,59.194z"/> 
 
       <path d="M476.02,47.554v6.24H455.7v5.04h16.36v6.24H455.7v5.04h20.319v6.24h-26.6v-28.8H476.02z"/> 
 
       <path d="M508.74,53.514v7.44c0,1.627-0.588,3.02-1.76,4.18c-1.174,1.16-2.574,1.74-4.201,1.74H502.5l6.24,7.36 
 
        v2.12h-6.4l-7.96-9.48l-8.24,0.04c0.08,0,0.12,0.08,0.12,0.24c-0.054,0-0.094-0.013-0.12-0.04v9.24h-6.2v-28.76h22.84 
 
        c1.627,0,3.027,0.58,4.201,1.74C508.152,50.494,508.74,51.888,508.74,53.514z M486.14,53.794v6.84h16.32v-6.84H486.14z"/> 
 
       </g> 
 
       <g> 
 
       <path d="M567.46,53.794h-22.52v16.32h22.52v6.24h-22.8c-1.654,0-3.054-0.573-4.2-1.72 
 
        c-1.146-1.146-1.72-2.546-1.72-4.2v-16.96c0-1.653,0.573-3.053,1.72-4.2c1.146-1.146,2.546-1.72,4.2-1.72h22.8V53.794z"/> 
 
       <path d="M577.46,47.554h16.96c1.626,0,3.02,0.58,4.18,1.74s1.74,2.554,1.74,4.18v16.96 
 
        c0,1.627-0.58,3.02-1.74,4.18c-1.16,1.16-2.554,1.74-4.18,1.74h-16.96c-1.654,0-3.054-0.573-4.2-1.72 
 
        c-1.146-1.146-1.72-2.546-1.72-4.2v-16.96c0-1.653,0.573-3.053,1.72-4.2C574.406,48.128,575.806,47.554,577.46,47.554z 
 
        M577.74,53.794v16.32h16.319v-16.32H577.74z"/> 
 
       <path d="M620.899,59.194l9.72-11.64h6.439v28.8h-6.239v-19.32l-9.92,11.84l-9.96-11.8v19.28h-6.2v-28.8h6.399 
 
        L620.899,59.194z"/> 
 
       <path d="M658.02,59.194l9.72-11.64h6.439v28.8h-6.239v-19.32l-9.92,11.84l-9.96-11.8v19.28h-6.2v-28.8h6.399 
 
        L658.02,59.194z"/> 
 
       <path d="M685.099,47.554v22.56h16.319v-22.56h6.28v22.88c0,1.627-0.58,3.02-1.74,4.18 
 
        c-1.16,1.16-2.554,1.74-4.18,1.74h-16.96c-1.654,0-3.054-0.573-4.2-1.72c-1.146-1.146-1.72-2.546-1.72-4.2v-22.88H685.099z"/> 
 
       <path d="M734.618,66.754v-19.2h6.28v28.8h-6.4l-16.199-19.28v19.28h-6.2v-28.8h6.399L734.618,66.754z"/> 
 
       <path d="M745.418,76.354v-28.8h6.239v28.8H745.418z"/> 
 
       <path d="M782.897,53.794h-22.52v16.32h22.52v6.24h-22.8c-1.654,0-3.054-0.573-4.2-1.72 
 
        c-1.146-1.146-1.72-2.546-1.72-4.2v-16.96c0-1.653,0.573-3.053,1.72-4.2c1.146-1.146,2.546-1.72,4.2-1.72h22.8V53.794z"/> 
 
       <path d="M793.057,47.554h16.92c1.653,0,3.06,0.58,4.22,1.74s1.74,2.554,1.74,4.18v22.88h-6.28v-9.28h-16.32v9.28 
 
        h-6.199v-22.88c0-1.653,0.573-3.053,1.72-4.2C790.003,48.128,791.402,47.554,793.057,47.554z M793.336,60.834h16.32v-7.04h-16.32 
 
        V60.834z"/> 
 
       <path d="M819.057,47.554h28.8v6.24h-11.279v22.56h-6.24v-22.56h-11.28V47.554z"/> 
 
       <path d="M850.896,76.354v-28.8h6.239v28.8H850.896z"/> 
 
       <path d="M865.496,47.554h16.96c1.626,0,3.02,0.58,4.18,1.74s1.74,2.554,1.74,4.18v16.96 
 
        c0,1.627-0.58,3.02-1.74,4.18c-1.16,1.16-2.554,1.74-4.18,1.74h-16.96c-1.654,0-3.054-0.573-4.2-1.72 
 
        c-1.146-1.146-1.72-2.546-1.72-4.2v-16.96c0-1.653,0.573-3.053,1.72-4.2C862.442,48.128,863.842,47.554,865.496,47.554z 
 
        M865.776,53.794v16.32h16.319v-16.32H865.776z"/> 
 
       <path d="M915.295,66.754v-19.2h6.28v28.8h-6.4l-16.199-19.28v19.28h-6.2v-28.8h6.399L915.295,66.754z"/> 
 
       </g> 
 
      </g> 
 
      <g> 
 
       <g> 
 
       <path d="M304.481,105.269l9.72-11.64h6.44v28.8h-6.24v-19.32l-9.92,11.84l-9.96-11.8v19.28h-6.2v-28.8h6.4 
 
        L304.481,105.269z"/> 
 
       <path d="M331.441,93.629h16.919c1.654,0,3.061,0.58,4.221,1.74c1.16,1.159,1.74,2.554,1.74,4.18v22.88h-6.281 
 
        v-9.28h-16.319v9.28h-6.2v-22.88c0-1.653,0.573-3.054,1.72-4.2C328.387,94.202,329.787,93.629,331.441,93.629z M331.721,106.909 
 
        h16.319v-7.04h-16.319V106.909z"/> 
 
       <path d="M381.4,112.829v-19.2h6.28v28.8h-6.4l-16.199-19.28v19.28h-6.2v-28.8h6.399L381.4,112.829z"/> 
 
       <path d="M398.16,93.629h16.92c1.653,0,3.06,0.58,4.22,1.74c1.16,1.159,1.74,2.554,1.74,4.18v22.88h-6.28v-9.28 
 
        h-16.32v9.28h-6.199v-22.88c0-1.653,0.573-3.054,1.72-4.2S396.506,93.629,398.16,93.629z M398.439,106.909h16.32v-7.04h-16.32 
 
        V106.909z"/> 
 
       <path d="M454.4,99.549v2.72h-6.28v-2.399h-16.319v16.319h16.319v-4.319h-6.24v-6.24H454.4v10.88 
 
        c0,1.627-0.58,3.02-1.74,4.18s-2.566,1.74-4.22,1.74h-16.92c-1.654,0-3.054-0.573-4.2-1.72s-1.72-2.547-1.72-4.2v-16.96 
 
        c0-1.653,0.573-3.054,1.72-4.2s2.546-1.72,4.2-1.72h16.92c1.653,0,3.06,0.58,4.22,1.74C453.82,96.529,454.4,97.923,454.4,99.549z" 
 
        /> 
 
       <path d="M485.479,93.629v6.24h-20.32v5.04h16.36v6.239h-16.36v5.04h20.32v6.24h-26.6v-28.8H485.479z"/> 
 
       <path d="M504.84,105.269l9.72-11.64h6.439v28.8h-6.239v-19.32l-9.92,11.84l-9.96-11.8v19.28h-6.2v-28.8h6.399 
 
        L504.84,105.269z"/> 
 
       <path d="M552.479,93.629v6.24h-20.32v5.04h16.36v6.239h-16.36v5.04h20.32v6.24h-26.6v-28.8H552.479z"/> 
 
       <path d="M578.958,112.829v-19.2h6.28v28.8h-6.4l-16.199-19.28v19.28h-6.2v-28.8h6.399L578.958,112.829z"/> 
 
       <path d="M588.278,93.629h28.8v6.24h-11.279v22.56h-6.24v-22.56h-11.28V93.629z"/> 
 
       </g> 
 
       <g> 
 
       <path d="M675.921,99.549v2.68h-6.28v-2.359h-16.319v5.04h16.68c1.626,0,3.021,0.579,4.18,1.739 
 
        c1.16,1.16,1.74,2.554,1.74,4.181v5.68c0,1.627-0.58,3.02-1.74,4.18c-1.159,1.16-2.554,1.74-4.18,1.74h-16.96 
 
        c-1.627,0-3.02-0.573-4.18-1.72s-1.74-2.547-1.74-4.2v-2.68h6.2v2.359h16.319v-5.04h-16.6c-1.627,0-3.02-0.573-4.18-1.72 
 
        s-1.74-2.546-1.74-4.2v-5.68c0-1.653,0.58-3.054,1.74-4.2s2.553-1.72,4.18-1.72h16.96c1.626,0,3.021,0.58,4.18,1.74 
 
        C675.341,96.529,675.921,97.923,675.921,99.549z"/> 
 
       <path d="M706.881,93.629v6.24h-20.32v5.04h16.36v6.239h-16.36v5.04h20.32v6.24h-26.6v-28.8H706.881z"/> 
 
       <path d="M739.601,99.589v7.439c0,1.627-0.587,3.021-1.76,4.181c-1.174,1.16-2.574,1.739-4.2,1.739h-0.28l6.24,7.36 
 
        v2.12h-6.4l-7.96-9.48l-8.239,0.04c0.08,0,0.119,0.08,0.119,0.24c-0.054,0-0.094-0.013-0.119-0.04v9.24h-6.2v-28.76h22.84 
 
        c1.626,0,3.026,0.58,4.2,1.74C739.014,96.569,739.601,97.963,739.601,99.589z M717.001,99.869v6.84h16.319v-6.84H717.001z"/> 
 
       <path d="M760.96,114.549l12.08-20.92h7.16l-16.68,28.8h-5.16l-16.68-28.8h7.199L760.96,114.549z"/> 
 
       <path d="M782.681,122.429v-28.8h6.239v28.8H782.681z"/> 
 
       <path d="M820.16,99.869h-22.52v16.319h22.52v6.24h-22.8c-1.654,0-3.054-0.573-4.2-1.72s-1.72-2.547-1.72-4.2 
 
        v-16.96c0-1.653,0.573-3.054,1.72-4.2s2.546-1.72,4.2-1.72h22.8V99.869z"/> 
 
       <path d="M850.999,93.629v6.24h-20.32v5.04h16.36v6.239h-16.36v5.04h20.32v6.24h-26.6v-28.8H850.999z"/> 
 
       <path d="M883.559,99.549v2.68h-6.28v-2.359h-16.319v5.04h16.68c1.626,0,3.021,0.579,4.18,1.739 
 
        c1.16,1.16,1.74,2.554,1.74,4.181v5.68c0,1.627-0.58,3.02-1.74,4.18c-1.159,1.16-2.554,1.74-4.18,1.74h-16.96 
 
        c-1.627,0-3.02-0.573-4.18-1.72s-1.74-2.547-1.74-4.2v-2.68h6.2v2.359h16.319v-5.04h-16.6c-1.627,0-3.02-0.573-4.18-1.72 
 
        s-1.74-2.546-1.74-4.2v-5.68c0-1.653,0.58-3.054,1.74-4.2s2.553-1.72,4.18-1.72h16.96c1.626,0,3.021,0.58,4.18,1.74 
 
        C882.979,96.529,883.559,97.923,883.559,99.549z"/> 
 
       </g> 
 
      </g> 
 
      </svg> 
 
     </div> 
 
     </div> 
 
     </div> 
 
    </div>