.textBar{width:auto; height:50px;margin:10px auto; text-align: center;}

.t1_Motion line,.t1_Motion path,.t1_Motion polyline,.t2_Motion line,.t2_Motion path,.t2_Motion polyline,.t3_Motion line,.t3_Motion path,.t3_Motion polyline,.t3_Motion rect,.t4_Motion line,.t4_Motion path,.t4_Motion polyline,.t4_Motion rect,.t5_Motion line,.t5_Motion path,.t5_Motion polyline,.t5_Motion rect{
  stroke-dasharray: 400;
  stroke-dashoffset: 400;
  -webkit-animation: dash 5s linear;
  animation: dash 5s linear;
  animation-iteration-count:1;
  animation-fill-mode:forwards;
  -webkit-animation-iteration-count:1; 
  -webkit-animation-fill-mode:forwards;
}

/**标题1**/
#t1_fill1,#t1_fill2,#t1_fill3{
    animation-delay:0.1s;
    -webkit-animation-delay:0.1s;
}
#t2_line1, #t2_line2, #t2_line3, #t2_line4, #t2_line5, #t2_line6, #t2_line7, #t2_line8, #t2_line9{
    animation-delay:0.15s;
    -webkit-animation-delay:0.15s;
}
#t2_fill1,#t2_fill2,#t2_fill3,#t2_fill4,#t2_fill5,#t2_fill6,#t2_fill7,#t2_fill8,#t2_fill9,#t2_fill10,#t2_fill11,#t2_fill12{
    animation-delay:0.31s;
    -webkit-animation-delay:0.31s;
}

/**标题2**/
#t3_fill1,#t3_fill2,#t3_fill3{
    animation-delay:0.1s;
    -webkit-animation-delay:0.1s;
}
#t4_line1,#t4_line2,#t4_line3,#t4_line4,#t4_line5,#t4_line6,#t4_line7,#t4_line8,#t4_line9{
    animation-delay:0.15s;
    -webkit-animation-delay:0.15s;
}
#t4_fill1,#t4_fill2,#t4_fill3,#t4_fill4,#t4_fill5,#t4_fill6,#t4_fill7{
    animation-delay:0.31s;
    -webkit-animation-delay:0.31s;
}
#t5_line1,#t5_line2,#t5_line3{
    animation-delay:0.31s;
    -webkit-animation-delay:0.31s;
}  #t5_fill1,#t5_fill2,#t5_fill3,#t5_fill4,#t5_fill5,#t5_fill6,#t5_fill7,#t5_fill8,#t5_fill9,#t5_fill10,#t5_fill11,#t5_fill12{
        animation-delay:0.32s;
        -webkit-animation-delay:0.32s;
    }

/**标题3**/
#t6_fill1,#t6_fill2,#t6_fill3{
        animation-delay:0.1s;
        -webkit-animation-delay:0.1s;
    } 
#t7_line1,#t7_line2,#t7_line3,#t7_line4,#t7_line5,#t7_line6{
    animation-delay:0.15s;
    -webkit-animation-delay:0.15s;
}
#t7_fill1,#t7_fill2,#t7_fill3,#t7_fill4{
    animation-delay:0.31s;
    -webkit-animation-delay:0.31s;
}  #t8_line1,#t8_line2,#t8_line3,#t8_line4,#t8_line5,#t8_line6,#t8_line7,#t8_line8,#t8_line9,#t8_line10,#t8_line11,#t8_line12{
    animation-delay:0.31s;
    -webkit-animation-delay:0.31s;
}
 #t8_fill1,#t8_fill2,#t8_fill3,#t8_fill4,#t8_fill5,#t8_fill6,#t8_fill7,#t8_fill8,#t8_fill9,#t8_fill10,#t8_fill11,#t8_fill12{
    animation-delay:0.32s;
    -webkit-animation-delay:0.32s;
}


/**标题4**/
#t9_fill1,#t9_fill2,#t9_fill3{
    animation-delay:0.1s;
    -webkit-animation-delay:0.1s;
} 
 #t10_line1,#t10_line2,#t10_line3,#t10_line4,#t10_line5,#t10_line6,#t10_line7,#t10_line8,#t10_line9,#t10_line10,#t10_line11,#t10_line12,#t10_line13,#t10_line14,#t10_line15,#t10_line16,#t10_line17{
    animation-delay:0.15s;
    -webkit-animation-delay:0.15s;
}   #t10_fill1,#t10_fill2,#t10_fill3,#t10_fill4,#t10_fill5,#t10_fill6,#t10_fill7,#t10_fill8,#t10_fill9,#t10_fill10,#t10_fill11{
    animation-delay:0.31s;
    -webkit-animation-delay:0.31s;
}
 #t11_line1,#t11_line2,#t11_line3,#t11_line4,#t11_line5,#t11_line6,#t11_line7,#t11_line8,#t11_line9,#t11_line10,#t11_line11,#t11_line12,#t11_line13,#t11_line14{
    animation-delay:0.31s;
    -webkit-animation-delay:0.31s;
}
#t11_fill1,#t11_fill2,#t11_fill3,#t11_fill4,#t11_fill5,#t11_fill6,#t11_fill7,#t11_fill8,#t11_fill9,#t11_fill10{
    animation-delay:0.32s;
    -webkit-animation-delay:0.32s;
}

/**标题5**/
#t12_fill1,#t12_fill2,#t12_fill3,#t12_fill4,#t12_fill5,#t12_fill6,#t12_fill7,#t12_fill8,#t12_fill9,#t12_fill10,#t12_fill11,#t12_fill12{
        animation-delay:0.1s;
        -webkit-animation-delay:0.1s;
    }
 #t13_line1,#t13_line2,#t13_line3,#t13_line4,#t13_line5,#t13_line6,#t13_line7,#t13_line8,#t13_line9,#t13_line10,#t13_line11,#t13_line12{
    animation-delay:0.15s;
    -webkit-animation-delay:0.15s;
}

#t13_fill1,#t13_fill2,#t13_fill3,#t13_fill4,#t13_fill5,#t13_fill6,#t13_fill7,#t13_fill8,#t13_fill9{
    animation-delay:0.31s;
    -webkit-animation-delay:0.31s;
}

#t14_line1,#t14_line2,#t14_line3,#t14_line4,#t14_line5{
    animation-delay:0.31s;
    -webkit-animation-delay:0.31s;
}
#t14_fill1,#t14_fill2,#t14_fill3,#t14_fill4,#t14_fill5{
    animation-delay:0.32s;
    -webkit-animation-delay:0.32s;
}

#t15_line1,#t15_line2,#t15_line3,#t15_line4,#t15_line5,#t15_line6,#t15_line7,#t15_line8,#t15_line9{
    animation-delay:0.32s;
    -webkit-animation-delay:0.32s;
}

#t15_fill1,#t15_fill2,#t15_fill3,#t15_fill4,#t15_fill5,#t15_fill6{
    animation-delay:0.33s;
    -webkit-animation-delay:0.33s;
}

.iconAnimate .icon1 line
{
  stroke-dasharray: 500; stroke-dashoffset: 500;  
  -webkit-animation: dash 7s cubic-bezier(0, 0, 0.57, 1.12).8s;
    
    animation-iteration-count:1;
      animation-fill-mode:forwards;
      -webkit-animation-iteration-count:1; 
      -webkit-animation-fill-mode:forwards;
}
.iconAnimate .icon1 path
{ 
  stroke-dasharray: 300; stroke-dashoffset:300;  
  -webkit-animation:dash 2s cubic-bezier(0.38, 0.93, 0.56, 0.99).8s;
    
    animation-iteration-count:1;
      animation-fill-mode:forwards;
      -webkit-animation-iteration-count:1; 
      -webkit-animation-fill-mode:forwards;
}
.iconAnimate .icon1 span{-webkit-animation-delay:0.5s; }

.iconAnimate .icon2 path
{ 
  stroke-dasharray: 300; stroke-dashoffset:300;  
  -webkit-animation:dash 2s cubic-bezier(0.38, 0.93, 0.56, 0.99).8s;
  -webkit-animation-delay:1s;
    
    animation-iteration-count:1;
      animation-fill-mode:forwards;
      -webkit-animation-iteration-count:1; 
      -webkit-animation-fill-mode:forwards;
}
.iconAnimate .icon2 span{-webkit-animation-delay:1s; }

.iconAnimate .icon3 line
{
  stroke-dasharray: 500; stroke-dashoffset: 500;  
  -webkit-animation: dash 7s cubic-bezier(0, 0, 0.57, 1.12).8s;
  -webkit-animation-delay:1.5s;
    
    animation-iteration-count:1;
      animation-fill-mode:forwards;
      -webkit-animation-iteration-count:1; 
      -webkit-animation-fill-mode:forwards;
}
.iconAnimate .icon3 path
{ 
  stroke-dasharray: 300; stroke-dashoffset:300;  
  -webkit-animation:dash 2s cubic-bezier(0.38, 0.93, 0.56, 0.99).8s;
  -webkit-animation-delay:1.5s;
    
    animation-iteration-count:1;
      animation-fill-mode:forwards;
      -webkit-animation-iteration-count:1; 
      -webkit-animation-fill-mode:forwards;
}
.iconAnimate .icon3 span{-webkit-animation-delay:1.5s; }

.iconAnimate .icon4 path
{ 
  stroke-dasharray: 300; stroke-dashoffset:300;  
  -webkit-animation:dash 2s cubic-bezier(0.38, 0.93, 0.56, 0.99).8s;
  -webkit-animation-delay:2s;
    
    animation-iteration-count:1;
      animation-fill-mode:forwards;
      -webkit-animation-iteration-count:1; 
      -webkit-animation-fill-mode:forwards;
}
.iconAnimate .icon4 span{-webkit-animation-delay:2s; }

.iconAnimate .icon5 polyline
{ 
  stroke-dasharray: 300; stroke-dashoffset:300;  
  -webkit-animation:dash 2s cubic-bezier(0.38, 0.93, 0.56, 0.99).8s;
  -webkit-animation-delay:2.5s;
    
    animation-iteration-count:1;
      animation-fill-mode:forwards;
      -webkit-animation-iteration-count:1; 
      -webkit-animation-fill-mode:forwards;
}
.iconAnimate .icon5 span{-webkit-animation-delay:2.5s; }
#skill span{visibility: hidden; animation-duration: 0.5;}

@-webkit-keyframes dash {  
  to {
    stroke-dashoffset: 0;
  }
}
@keyframes dash {
  to {
    stroke-dashoffset: 0;
  }
}