#menu li { background:#e8eaf0; border-radius: 50px; float: none; height:8px; margin-bottom: 20px; text-align: center; width:8px; display: flex; /* Vertical align: */
align-items: center; /* Horizontal align: */
justify-content: center; /* Safari: */ /*-webkit-box-shadow: 0px 0px 4px 0px rgba(161,161,161,0.5);
-moz-box-shadow: 0px 0px 4px 0px rgba(161,161,161,0.5);
box-shadow: 0px 0px 4px 0px rgba(161,161,161,0.5);*/
display: -webkit-flex; -webkit-align-items: center; -webkit-justify-content: center; position: relative; }
#menu li a.home { background: rgba(0, 0, 0, 0) url("../images/menu-home.png") no-repeat scroll 0 0; display: inline-block; height: 16px; width: 19px; }
#menu li.active a.home, #menu li:hover a.home { background: rgba(0, 0, 0, 0) url("../images/menu-home-wt.png") no-repeat scroll 0 0; display: inline-block; height: 16px; width: 19px; }
#menu li a.abt-us { background: rgba(0, 0, 0, 0) url("../images/menu-abt.png") no-repeat scroll 0 0; display: inline-block; height: 26px; width: 12px; }
#menu li.active a.abt-us, #menu li:hover a.abt-us { background: rgba(0, 0, 0, 0) url("../images/menu-abt-wt.png") no-repeat scroll 0 0; display: inline-block; height: 26px; width: 12px; }
#menu li a.menu-qualit { background: rgba(0, 0, 0, 0) url("../images/menu-qualit.png") no-repeat scroll 0 0; display: inline-block; height: 20px; width: 20px; }
#menu li.active a.menu-qualit, #menu li:hover  a.menu-qualit { background: rgba(0, 0, 0, 0) url("../images/menu-qualit-wt.png") no-repeat scroll 0 0; display: inline-block; height: 20px; width: 20px; }
#menu li a.menu-spin { background: rgba(0, 0, 0, 0) url("../images/menu-spin.png") no-repeat scroll 0 0; display: inline-block; height: 20px; width: 20px; }
#menu li.active a.menu-spin, #menu li:hover  a.menu-spin{ background: rgba(0, 0, 0, 0) url("../images/menu-spin-wt.png") no-repeat scroll 0 0; display: inline-block; height: 20px; width: 20px; }
#menu li a.menu-weaving { background: rgba(0, 0, 0, 0) url("../images/menu-weaving.png") no-repeat scroll 0 0; display: inline-block; height: 23px; width: 23px; }
#menu li.active a.menu-weaving, #menu li:hover a.menu-weaving { background: rgba(0, 0, 0, 0) url("../images/menu-weaving-wt.png") no-repeat scroll 0 0; display: inline-block; height: 23px; width: 23px; }
#menu li a.menu-madeup { background: rgba(0, 0, 0, 0) url("../images/menu-madeup.png") no-repeat scroll 0 0; display: inline-block; height: 17px; width: 24px; }
#menu li.active a.menu-madeup, #menu li:hover a.menu-madeup { background: rgba(0, 0, 0, 0) url("../images/menu-madeup-wt.png") no-repeat scroll 0 0; display: inline-block; height: 17px; width: 24px; }
#menu li a.menu-reco { background: rgba(0, 0, 0, 0) url("../images/menu-reco.png") no-repeat scroll 0 0; display: inline-block; height: 18px; width: 20px; }
#menu li.active a.menu-reco, #menu li:hover a.menu-reco { background: rgba(0, 0, 0, 0) url("../images/menu-reco-wt.png") no-repeat scroll 0 0; display: inline-block; height: 18px; width: 20px; }
#menu li a.menu-csr { background: rgba(0, 0, 0, 0) url("../images/menu-csr.png") no-repeat scroll 0 0; display: inline-block; height: 22px; width: 22px; }
#menu li.active a.menu-csr, #menu li:hover a.menu-csr { background: rgba(0, 0, 0, 0) url("../images/menu-csr-wt.png") no-repeat scroll 0 0; display: inline-block; height: 22px; width: 22px; }
#menu li a.menu-cnt { background: rgba(0, 0, 0, 0) url("../images/menu-cnt.png") no-repeat scroll 0 0; display: inline-block; height: 20px; width: 20px; }
#menu li.active a.menu-cnt, #menu li:hover a.menu-cnt  { background: rgba(0, 0, 0, 0) url("../images/menu-cnt-wt.png") no-repeat scroll 0 0; display: inline-block; height: 20px; width: 20px; }

#menu li a.menu-video { background: rgba(0, 0, 0, 0) url("../images/menu-video.png") no-repeat scroll 0 0; display: inline-block; height: 24px; width: 24px; }
#menu li.active a.menu-video, #menu li:hover a.menu-video { background: rgba(0, 0, 0, 0) url("../images/menu-video-wt.png") no-repeat scroll 0 0; display: inline-block; height:24px; width: 24px; }


#menu li.active { background:#ffffff; position:relative; }
#menu li.active::after { left:-4px; position:absolute; content:""; right:0; top:-4px; border:1px solid #fff; width:16px; height:16px; border-radius:25px;}
#menu li a { text-decoration:none; color: #000; width:40px; height:40px; }
#menu li a span{display:none;font-size: 14px; padding:5px 15px; background:#fff; position:absolute; right:80px; top:-8px; color:#014220; transition:all .5s ease;
-moz-transition:all .5s ease;
-webkit-transition:all .5s ease;
-o-transition:all .5s ease;}
#menu li a span{width:115px;}
#menu li a span::after { content:""; right:-6px; top:8px; position:absolute;
  width: 0; 
  height: 0; 
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;  
  border-left: 6px solid #fff;
}

#menu li:hover a span{display:block; right:30px;  animation-name: fadeInLeft; animation-duration: 0.6s; animation-fill-mode: both;}

#menu li:hover { background:#ff4800; }
#menu li a, #menu li.active a { }
#menu li.active a { color: #fff; }
#menu { position:fixed; top:45%; right:35px; z-index: 9;}
.twitter-share-button { position: fixed; z-index: 99; right: 149px; top: 9px; }
#download { margin: 10px 0 0 0; padding: 15px 10px; color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); background-color: #49afcd; background-image: -moz-linear-gradient(top, #5bc0de, #2f96b4); background-image: -ms-linear-gradient(top, #5bc0de, #2f96b4); background-image: -webkit-gradient(linear, 0 0, 0 100%, from( #5bc0de), to( #2f96b4)); background-image: -webkit-linear-gradient(top, #5bc0de, #2f96b4); background-image: -o-linear-gradient(top, #5bc0de, #2f96b4); background-image: linear-gradient(top, #5bc0de, #2f96b4); background-repeat: repeat-x;  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5bc0de', endColorstr='#2f96b4', GradientType=0);
border-color: #2f96b4 #2f96b4 #1f6377; border-color: rgba(0, 0, 0, .1) rgba(0, 0, 0, .1) rgba(0, 0, 0, .25);  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
-webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; vertical-align: middle; cursor: pointer; display: inline-block; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); }
#download a { text-decoration:none; color:#fff; }
#download:hover { text-shadow: 0 -1px 0 rgba(0, 0, 0, .25); background-color: #2F96B4; background-position: 0 -15px;  -webkit-transition: background-position .1s linear;
 -moz-transition: background-position .1s linear;
 -ms-transition: background-position .1s linear;
 -o-transition: background-position .1s linear;
 transition: background-position .1s linear;
}
#infoMenu { height: 20px; color: #f2f2f2; position:fixed; z-index:70; bottom:0; width:100%; text-align:right; font-size:0.9em; padding:8px 0 8px 0; }
#infoMenu ul { padding: 0 40px; }
#infoMenu li a { display: block; margin: 0 22px 0 0; color: #333; }
#infoMenu li a:hover { text-decoration:underline; }
#infoMenu li { display:inline-block; position:relative; }
#examplesList { display:none; background: #282828; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; padding: 20px; float: left; position: absolute; bottom: 29px; right: 0; width:638px; text-align:left; }
#examplesList ul { padding:0; }
#examplesList ul li { display:block; margin: 5px 0; }
#examplesList ul li a { color: #BDBDBD; margin:0; }
#examplesList ul li a:hover { color: #f2f2f2; }
#examplesList .column { float: left; margin: 0 20px 0 0; }
#examplesList h3 { color: #f2f2f2; font-size: 1.2em; margin: 0 0 15px 0; border-bottom: 1px solid rgba(0, 0, 0, 0.4); -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1); -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1); padding: 0 0 5px 0; }
/* Demos Menu
 * --------------------------------------- */
 #demosMenu { position:fixed; bottom: 10px; right:10px; z-index: 999; }

.fadeInLeft { animation-name: fadeInLeft; }
 @keyframes fadeInUp { 0% {
 opacity: 0;
 transform: translate3d(0px, 100%, 0px);
}
100% {
 opacity: 1;
 transform: none;
}
}