/*-----in-context-menu stylingl---*/

h4.ns-icm-heading a {display:inline-block; font-size:1.3em; color:gray}

h4.ns-icm-heading a:hover { -webkit-animation:shrinkeffect 500ms linear 1 alternate; -moz-animation:shrinkeffect 500ms linear 1 alternate; -o-animation:shrinkeffect 500ms linear 1 alternate; animation:shrinkeffect 500ms linear 1 alternate;}

.ns-in-context-menu {overflow:hidden; margin:10px 0 32px 0; padding:16px 2% 10px 2%; border-top:dotted 3px #f79420}

.ns-in-context-menu ul {counter-reset:li;/*initiate a counter*/ margin-left:0; /*Remove any default left margin*/ padding-left:0; /*Remove and default left padding*/;}


.ns-in-context-menu ul > li {position:relative; z-index:1; display:inline-block; margin:0 2em 6px 2em; padding:4px 8px; list-style:none;/*Remove any list styling and set the padding on the list and margins leaving a 2em margin on the left for the counter content*/}

.ns-in-context-menu ul > li.ns-current a, .ns-in-context-menu ul > li.current-menu-item a {display:inline-block; color:gray!important; font-size:18px!important; font-weight:bold}

.ns-in-context-menu ul > li:before {content:counter(li);/*use the counter as the before content for the numbering */ counter-increment:li; /*increment the county by 1 */ position:absolute; padding-top:4px; top:0px; left:-2em; -mox-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; width:2em; height:2em;background-color:#f79420; font-weight:bold; text-align:center; -moz-border-radius:1em; -webkit-border-radius:1em; -khtml-border-radius:1em; border-radius:1em; -webkit-transition: background-color 1s ease, color 1s ease; -moz-transition: background-color 1s ease, color 1s ease; transition: background-color 1s ease, color 1s ease;}

.ns-in-context-menu ul > li.ns-current:before, .ns-in-context-menu ul > li.current-menu-item:before {background:gray!important; color:white!important;}

.ns-in-context-menu ul > li a {display:inline-block; position: relative; z-index:10; margin-left:-2.1em; padding-left:2.1em}

.ns-in-context-menu ul > li:hover:before {background:gray; color:white; }

.ns-in-context-menu ul > li:hover a {color:gray; animation:shrinkeffect .5s linear 0s 1 alternate; -webkit-animation:shrinkeffect .5s linear 0s 1 alternate; -moz-animation:shrinkeffect .5s linear 0s 1 alternate;}

.ns-in-context-menu ul > li:active:before {animation:shrinkeffect .5s linear 0s 1 alternate; -webkit-animation:shrinkeffect .5s linear 0s 1 alternate; -moz-animation:shrinkeffect .5s linear 0s 1 alternate;}

.ns-in-context-menu ul > li:active a{animation:shrinkeffect .5s linear 0s 1 alternate; -webkit-animation:shrinkeffect .5s linear 0s 1 alternate; -moz-animation:shrinkeffect .5s linear 0s 1 alternate;}

/*-----shrinkeffect animation keyframes called in above styles make the following keyframe active if it's not already in the main stylesheet-----*/

@-webkit-keyframes shrinkeffect {
	50%{-webkit-transform:scale(0.7,0.7);}
	100%{-webkit-transform:scale(1,1);}
	}
	
@keyframes shrinkeffect {
	50%{-moz-transform:scale(0.7,0.7); -o-transform:scale(0.7,0.7); transform:scale(0.7,0.7);}
	100%{-moz-transform:scale(1,1); -o-transform:scale(1,1); transform:scale(1,1);}
	}