html{
    display: block;
    background: #ffffff url(../images/bg.gif);
}
/*animate begin*/
@media screen and (min-width: 900px) { 
    .view-poll.first-child.in-view{
      position: relative;
      animation: feature_item 0.7s;
      }
    .zero-child.in-view,  
    .view-poll.zero-child.in-view{
      position: relative;
      animation: feature_item 0.5s linear; 
      }
      @keyframes feature_item{    
        0% { right:-40px;opacity: 0;} 
        40% { right:-40px;opacity: 0; }
        99% { right:-1px;opacity: 1; }
        100% { right:0px;opacity: 1; }
        } 
      @-webkit-keyframes feature_item{    
        0% { right:-40px;opacity: 0;} 
        40% { right:-40px;opacity: 0; }
        99% { right:-1px;opacity: 1; }
        100% { right:0px;opacity: 1; }
        }   
      @-moz-keyframes  feature_item{    
        0% { right:-40px;opacity: 0;} 
        40% { right:-40px;opacity: 0; }
        99% { right:-1px;opacity: 1; }
        100% { right:0px;opacity: 1; }
        } 
      @-o-keyframes feature_item{   
        0% { right:-40px;opacity: 0;} 
        40% { right:-40px;opacity: 0; }
        99% { right:-1px;opacity: 1; }
        100% { right:0px;opacity: 1; }
        }

      .view-poll.first-child.in-view{
        position: relative;
        animation: feature_item 0.7s;
        }
      .view-poll.zero-child.in-view{
        position: relative;
        animation: feature_item 0.5s linear; 
        }
      .title-child.in-view,  
      .view-poll.title-child.in-view{
        animation: title_item 0.5s linear; 
        }    
      @keyframes title_item{    
        0% { 
          -webkit-transform: translateY(100%);
          transform: translateY(100%);
        } 
        100% {        
          -webkit-transform: translateY(0);
          transform: translateY(0);
          }
        } 
      @-webkit-keyframes title_item{    
        0% { 
          -webkit-transform: translateY(100%);
          transform: translateY(100%);
        } 
        100% {        
          -webkit-transform: translateY(0);
          transform: translateY(0);
          }
        }   
      @-moz-keyframes  title_item{    
        0% { 
          -webkit-transform: translateY(100%);
          transform: translateY(100%);
        } 
        100% {        
          -webkit-transform: translateY(0);
          transform: translateY(0);
          }
        } 
      @-o-keyframes title_item{   
        0% { 
          -webkit-transform: translate(0);
          transform: translate(0);
        } 
        100% {        
          -webkit-transform: translateY(100%);
          transform: translateY(100%);
          }
        }
    .fade-child.in-view,
    .view-poll.fade-child.in-view{
      animation: fade_item 1.5s; 
      }
      @keyframes fade_item{   
        0% { opacity: 0;} 
        40% { opacity: 0; }
        99% { opacity: 1; }
        100% { opacity: 1; }
        } 
      @-webkit-keyframes fade_item{   
        0% { opacity: 0;} 
        40% { opacity: 0; }
        99% { opacity: 1; }
        100% { opacity: 1; }
        }   
      @-moz-keyframes  fade_item{   
        0% { opacity: 0;} 
        40% { opacity: 0; }
        99% { opacity: 1; }
        100% { opacity: 1; }
        } 
      @-o-keyframes fade_item{    
        0% { opacity: 0;} 
        40% { opacity: 0; }
        99% { opacity: 1; }
        100% { opacity: 1; }
        }
    @keyframes left-item{    
      0% {
        -webkit-transform: translateX(6vh);
        transform: translateX(6vh);
      }
      100% {
        -webkit-transform: translateX(-6vh);
        transform: translateX(-6vh);
      }
    } 
    @-webkit-keyframes left-item{    
      0% {
        -webkit-transform: translateX(6vh);
        transform: translateX(6vh);
      }
      100% {
        -webkit-transform: translateX(-6vh);
        transform: translateX(-6vh);
      }
    }   
    @-moz-keyframes  left-item{    
      0% {
        -webkit-transform: translateX(6vh);
        transform: translateX(6vh);
      }
      100% {
        -webkit-transform: translateX(-6vh);
        transform: translateX(-6vh);
      }
    } 
    @-o-keyframes left-item{   
      0% {
        -webkit-transform: translateX(6vh);
        transform: translateX(6vh);
      }
      100% {
        -webkit-transform: translateX(-6vh);
        transform: translateX(-6vh);
      }
    }
}
/*animate end*/
@media screen and (min-width: 900px) { 
  .view-poll.fade-area.in-view{
    position: relative;
    animation: fade_item 1s;
    z-index: 1; 
    }
  @keyframes fade_item{   
    0% { opacity: 0;}  
    40% { opacity: 0; }
    99% { opacity: 1; }
    100% { opacity: 1; }
    } 
  @-webkit-keyframes fade_item{   
    0% { opacity: 0;}  
    40% { opacity: 0; }
    99% { opacity: 1; }
    100% { opacity: 1; }
    } 
  @-moz-keyframes  fade_item{   
    0% { opacity: 0;}  
    40% { opacity: 0; }
    99% { opacity: 1; }
    100% { opacity: 1; }
    }   
  @-o-keyframes fade_item{    
    0% { opacity: 0;}  
    40% { opacity: 0; }
    99% { opacity: 1; }
    100% { opacity: 1; }
    }
} 
@media screen and (min-width: 900px) { 
  .view-poll.last-area.in-view{
    position: relative;
    animation: last_item 1s;
    z-index: 0; 
    }
  @keyframes last_item{   
    0% { bottom:-80px;opacity: 0;}  
    40% { bottom:-80px;opacity: 0; }
    99% { bottom:-1px;opacity: 1; }
    100% { bottom:0px;opacity: 1; }
    } 
  @-webkit-keyframes last_item{   
    0% { bottom:-80px;opacity: 0;}  
    40% { bottom:-80px;opacity: 0; }
    99% { bottom:-1px;opacity: 1; }
    100% { bottom:0px;opacity: 1; }
    } 
  @-moz-keyframes  last_item{   
    0% { bottom:-80px;opacity: 0;}  
    40% { bottom:-80px;opacity: 0; }
    99% { bottom:-1px;opacity: 1; }
    100% { bottom:0px;opacity: 1; }
    }   
  @-o-keyframes last_item{    
    0% { bottom:-80px;opacity: 0;}  
    40% { bottom:-80px;opacity: 0; }
    99% { bottom:-1px;opacity: 1; }
    100% { bottom:0px;opacity: 1; }
    }
  .view-poll.last-area-2.in-view{
    position: relative;
    animation: move_item 0.8s;
    z-index: 0; 
    }
  @keyframes move_item{   
    0% { bottom:-80px;opacity: 0;}  
    20% { opacity: 1; }
    100% { bottom:0;}
    } 
  @-webkit-keyframes move_item{   
    0% { bottom:-80px;opacity: 0;}  
    20% { opacity: 1; }
    100% { bottom:0; }
    } 
  @-moz-keyframes  move_item{   
    0% { bottom:-80px;opacity: 0;}  
    20% { opacity: 1; }
    100% { bottom:0;}
    }   
  @-o-keyframes move_item{    
    0% { bottom:-80px;opacity: 0;}  
    20% { opacity: 1; }
    100% { bottom:0; }
    }

} 
@media screen and (min-width: 900px) { 
    .view-poll.bottle-down.in-view{
      position: relative;
      animation: bottle_item_top 0.6s ease-out;
      }  
    @keyframes bottle_item_top{    
      0% { 
        -webkit-transform: translate(0, 60%) matrix(1, 0, 0, 1, 0, 0);
        transform: translate(0, 60%) matrix(1, 0, 0, 1, 0, 0);
      } 
      100% {        
        -webkit-transform: translate(0, 8%) matrix(1, 0, 0, 1, 0, 0);
        transform: translate(0, 8%) matrix(1, 0, 0, 1, 0, 0);
        }
    }
    @-webkit-keyframes bottle_item_top{    
      0% { 
        -webkit-transform: translate(0, 60%) matrix(1, 0, 0, 1, 0, 0);
        transform: translate(0, 60%) matrix(1, 0, 0, 1, 0, 0);
      } 
      100% {        
        -webkit-transform: translate(0, 8%) matrix(1, 0, 0, 1, 0, 0);
        transform: translate(0, 8%) matrix(1, 0, 0, 1, 0, 0);
        }
    }   
    @-moz-keyframes  bottle_item_top{    
      0% { 
        -webkit-transform: translate(0, 60%) matrix(1, 0, 0, 1, 0, 0);
        transform: translate(0, 60%) matrix(1, 0, 0, 1, 0, 0);
      } 
      100% {        
        -webkit-transform: translate(0, 8%) matrix(1, 0, 0, 1, 0, 0);
        transform: translate(0, 8%) matrix(1, 0, 0, 1, 0, 0);
        }
    } 
    @-o-keyframes bottle_item_top{   
      0% { 
        -webkit-transform: translate(0, 60%) matrix(1, 0, 0, 1, 0, 0);
        transform: translate(0, 60%) matrix(1, 0, 0, 1, 0, 0);
      } 
      100% {        
        -webkit-transform: translate(0, 8%) matrix(1, 0, 0, 1, 0, 0);
        transform: translate(0, 8%) matrix(1, 0, 0, 1, 0, 0);
        }
    }

    .view-poll.bottle-up.in-view{
      position: relative;
      animation: bottle_item_bottom 1s ease-in; 
      z-index: 1; 
      }  
    @keyframes bottle_item_bottom{    
      0% { 
        -webkit-transform: translate(0, 50%) matrix(1, 0, 0, 1, 0, 0);
        transform: translate(0, 50%) matrix(1, 0, 0, 1, 0, 0);
      } 
      100% {        
        -webkit-transform: translate(0, -17%) matrix(1, 0, 0, 1, 0, 0);
        transform: translate(0, -17%) matrix(1, 0, 0, 1, 0, 0);
        }
    }
    @-webkit-keyframes bottle_item_bottom{    
      0% { 
        -webkit-transform: translate(0, 50%) matrix(1, 0, 0, 1, 0, 0);
        transform: translate(0, 50%) matrix(1, 0, 0, 1, 0, 0);
      } 
      100% {        
        -webkit-transform: translate(0, -17%) matrix(1, 0, 0, 1, 0, 0);
        transform: translate(0, -17%) matrix(1, 0, 0, 1, 0, 0);
        }
    }   
    @-moz-keyframes  bottle_item_bottom{    
      0% { 
        -webkit-transform: translate(0, 50%) matrix(1, 0, 0, 1, 0, 0);
        transform: translate(0, 50%) matrix(1, 0, 0, 1, 0, 0);
      } 
      100% {        
        -webkit-transform: translate(0, -17%) matrix(1, 0, 0, 1, 0, 0);
        transform: translate(0, -17%) matrix(1, 0, 0, 1, 0, 0);
        }
    } 
    @-o-keyframes bottle_item_bottom{   
      0% { 
        -webkit-transform: translate(0, 50%) matrix(1, 0, 0, 1, 0, 0);
        transform: translate(0, 50%) matrix(1, 0, 0, 1, 0, 0);
      } 
      100% {        
        -webkit-transform: translate(0, -17%) matrix(1, 0, 0, 1, 0, 0);
        transform: translate(0, -17%) matrix(1, 0, 0, 1, 0, 0);
        }
    }

} 
/*animate end*/ 
@media screen and (min-width: 900px) { 
  .view-poll.awards-child.in-view{
    position: relative;
    animation: about_item 1.5s;
    }
  .view-poll.awards-pic-child.in-view{
    position: relative;
    animation: aboute_item 1s; 
    }
    @keyframes aboute_item{   
      0% { left:-40px;opacity: 0;}  
      40% { left:-40px;opacity: 0; }
      99% { left:-1px;opacity: 1; }
      100% { left:0px;opacity: 1; }
      } 
    @-webkit-keyframes aboute_item{   
      0% { left:-40px;opacity: 0;}  
      40% { left:-40px;opacity: 0; }
      99% { left:-1px;opacity: 1; }
      100% { left:0px;opacity: 1; }
      }   
    @-moz-keyframes  aboute_item{   
      0% { left:-40px;opacity: 0;}  
      40% { left:-40px;opacity: 0; }
      99% { left:-1px;opacity: 1; }
      100% { left:0px;opacity: 1; }
      } 
    @-o-keyframes aboute_item{    
      0% { left:-40px;opacity: 0;}  
      40% { left:-40px;opacity: 0; }
      99% { left:-1px;opacity: 1; }
      100% { left:0px;opacity: 1; }
      }
}    
/*animate end*/
@media screen and (min-width: 900px) { 
    .view-poll.mask-left.in-view{
      animation: mask_left 1s ease-out; 
      }  
    @keyframes mask_left{    
      0% { 
        width: 0;
        -webkit-transform: matrix(1, 0, 0, 1, 100, 0);
        transform: matrix(1, 0, 0, 1, 100, 0);
      } 
      100% {     
        width: 50%;   
        -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
        transform: matrix(1, 0, 0, 1, 0, 0);
        }
    }
    @-webkit-keyframes mask_left{    
      0% { 
        width: 0;
        -webkit-transform: matrix(1, 0, 0, 1, 100, 0);
        transform: matrix(1, 0, 0, 1, 100, 0);
      } 
      100% {     
        width: 50%;   
        -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
        transform: matrix(1, 0, 0, 1, 0, 0);
        }
    }   
    @-moz-keyframes  mask_left{    
      0% { 
        width: 0;
        -webkit-transform: matrix(1, 0, 0, 1, 100, 0);
        transform: matrix(1, 0, 0, 1, 100, 0);
      } 
      100% {     
        width: 50%;   
        -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
        transform: matrix(1, 0, 0, 1, 0, 0);
        }
    } 
    @-o-keyframes mask_left{   
      0% { 
        width: 0;
        -webkit-transform: matrix(1, 0, 0, 1, 100, 0);
        transform: matrix(1, 0, 0, 1, 100, 0);
      } 
      100% {     
        width: 50%;   
        -webkit-transform: matrix(1, 0, 0, 1, 0, 0);
        transform: matrix(1, 0, 0, 1, 0, 0);
        }
    }
}    
/*animate end*/

/*animate begin*/
@media screen and (min-width: 900px) { 
    .view-poll.first-child.in-view{
        position: relative;
        animation: moveleft_item 0.7s;
    }
    .zero-child.in-view,  
    .view-poll.moveleft-child.in-view{
        position: relative;
        animation: moveleft_item 0.5s linear; 
    }
    @keyframes moveleft_item{    
        0% { right:-40px;opacity: 0;} 
        40% { right:-40px;opacity: 0; }
        99% { right:-1px;opacity: 1; }
        100% { right:0px;opacity: 1; }
        } 
    @-webkit-keyframes moveleft_item{    
        0% { right:-40px;opacity: 0;} 
        40% { right:-40px;opacity: 0; }
        99% { right:-1px;opacity: 1; }
        100% { right:0px;opacity: 1; }
    }   
    @-moz-keyframes  moveleft_item{    
        0% { right:-40px;opacity: 0;} 
        40% { right:-40px;opacity: 0; }
        99% { right:-1px;opacity: 1; }
        100% { right:0px;opacity: 1; }
    } 
    @-o-keyframes moveleft_item{   
        0% { right:-40px;opacity: 0;} 
        40% { right:-40px;opacity: 0; }
        99% { right:-1px;opacity: 1; }
        100% { right:0px;opacity: 1; }
    }
}