
/*  Navigation container  */
nav {
    background: #efede9;
    position: relative;
    /* border: 1px solid #bfbeba;
    width: 14em;
    height: 14em; */
}

/* Common styles for rounded elements with borders */
input[type="checkbox"], input.checkbox { 
    height: 1px;
    width: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    background:url(../images/shareMe.png) no-repeat;
    border:0 none;
    opacity:0;
    z-index:99999;
}

input[type="checkbox"].share_animation,
.menu a {
    display: block;
    -webkit-background-clip: padding-box;
    -ms-background-clip: padding-box;
    -moz-background-clip: padding-box;
    -o-background-clip: padding-box;
    background-clip: padding-box;
}

input[type="checkbox"].share_animation, .menu {
    position: absolute;
    left: 5%;
    padding: 0;
    margin: 0;     
    z-index: 99999;        
}

@-moz-document url-prefix(){ 
    input[type="checkbox"].share_animation {
     z-index:1!important;
    width:40px!important;
    height:40px!important;
    line-height: 1!important;
    -moz-appearance: none!important;
    cursor: pointer!important;
    position: absolute!important;
    top: 1px!important;
    display:block!important;
}
}

input[type="checkbox"].share_animation{
    width:1px;
    height:1px;
/*    padding:18px;
    padding:20px\0/;*/
    line-height: 1;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    cursor: pointer;
    position: absolute;
    top: 1px;
    z-index:0;
}
.bg-img{background:transparent\0/; background-color:transparent;  background-repeat: no-repeat; background-position: 0px 0px; z-index:99999\0/!important; (;z-index:-99999;); z-index:99999;} /*width: 32px; height: 32px;*/
input[type="checkbox"].share_animation:checked:after {
    top: -0.04em;
    left: 0.19em;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
}
/* Navigation elements  */
.menu {
    z-index: 1;
    width:3.4em;
    height:3.4em;
    zoom:1;/*IE*//*zoom is written to avoid the default zooming effect in the mobile web browsers*/
    -webkit-transform: scale(1); /* Safari And Chrome */
    -webkit-transform-origin: 0 0;
    -o-transform: scale(1); /* Opera */
    -o-transform-origin: 0 0;
    -moz-transform: scale(1); /* Firefox */
    -moz-transform-origin: 0 0;
}
.menu li {
    list-style: none;
}
.menu a {
    position: absolute;            
    width: 1.5em;
    height: 1.5em;
    text-decoration: none;
    text-align: center;
    line-height: 1;            
    background: transparent;
    color: #fff; 
    -webkit-transition-timing-function: ease-out, cubic-bezier(.59,-0.99,.5,.96), cubic-bezier(.59,-0.99,.5,.96);
    -ms-transition-timing-function: ease-out, cubic-bezier(.59,-0.99,.5,.96), cubic-bezier(.59,-0.99,.5,.96);
    -o-transition-timing-function: ease-out, cubic-bezier(.59,-0.99,.5,.96), cubic-bezier(.59,-0.99,.5,.96);
    -moz-transition-timing-function: ease-out, cubic-bezier(.59,-0.99,.5,.96), cubic-bezier(.59,-0.99,.5,.96);
}
input[type="checkbox"].share_animation:checked + .menu a {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -webkit-transition-property: left, top, -webkit-transform;
    -moz-transition-property: left, top, -moz-transform;
    -ms-transition-property: left, top, -ms-transform;
    -o-transition-property: left, top, -o-transform;
    -webkit-transition-timing-function: cubic-bezier(.56,.18,.75,1.5), cubic-bezier(.56,.18,.75,1.5), ease-out;
    -ms-transition-timing-function: cubic-bezier(.56,.18,.75,1.5), cubic-bezier(.56,.18,.75,1.5), ease-out;
    -o-transition-timing-function: cubic-bezier(.56,.18,.75,1.5), cubic-bezier(.56,.18,.75,1.5), ease-out;
    -moz-transition-timing-function: cubic-bezier(.56,.18,.75,1.5), cubic-bezier(.56,.18,.75,1.5), ease-out;
}
/*.menu{visibility: hidden; position: absolute;top: 20px; z-index: -99999}*/
.menu{visibility: hidden; position: absolute; top: -3px; left: -2px;z-index:-99999; (;z-index:-99999;)}
input[type="checkbox"].share_animation:checked + .menu li:nth-child(n) a {visibility: visible;}

@-moz-document url-prefix(){ 
.menu{z-index: 99999!important}
.menu li,.menu li a{  z-index:1!important;}
input[type="checkbox"].share_animation{width: 100px; height: 100px; padding: 100px!important; margin-left: 5px}

}

.menu li,.menu li a{  z-index:1}


.menu li:nth-child(4) a {/*tumblr*/
    -webkit-transition-duration: .5s, .3s, .3s;
    -webkit-transition-delay: 0, .25s, .25s;
    -moz-transition-duration: .5s, .3s, .3s;
    -moz-transition-delay: 0, .25s, .25s;
    -ms-transition-duration: .5s, .3s, .3s;
    -ms-transition-delay: 0, .25s, .25s;
    -o-transition-duration: .5s, .3s, .3s;
    -o-transition-delay: 0, .25s, .25s;
}                
input[type="checkbox"].share_animation:checked + .menu li:nth-child(4) a {/*tumblr*/
	left: 75px;
	top: 104px;
    -webkit-transition-duration: .2s, .2s, .3s;
    -webkit-transition-delay: .1s, .1s, .1s;
    -moz-transition-duration:.2s, .2s, .3s;
    -moz-transition-delay: .15s, .15s, .1s;
    -ms-transition-duration: .2s, .2s, .3s;
    -ms-transition-delay: .15s, .15s, .1s;
    -o-transition-duration: .2s, .2s, .3s;
    -o-transition-delay:.15s, .15s, .1s;
}
.menu li:nth-child(5) a {
   -webkit-transition-duration: .5s, .3s, .3s;
    -webkit-transition-delay: 0, .2s, .2s;
    -moz-transition-duration:.5s, .3s, .3s;
    -moz-transition-delay:0, .2s, .2s;
    -ms-transition-duration: .5s, .3s, .3s;
    -ms-transition-delay: 0, .2s, .2s;
    -o-transition-duration:.5s, .3s, .3s;
    -o-transition-delay: 0, .2s, .2s;
}                
input[type="checkbox"].share_animation:checked + .menu li:nth-child(5) a {
	left: 35px;
	top: 125px;
    -webkit-transition-duration: .2s, .2s, .3s;
    -webkit-transition-delay: .2s, .2s, .1s;
    -moz-transition-duration: .2s, .2s, .3s;
    -moz-transition-delay:.2s, .2s, .1s;
    -ms-transition-duration: .2s, .2s, .3s;
    -ms-transition-delay: .2s, .2s, .1s;
    -o-transition-duration: .2s, .2s, .3s;
    -o-transition-delay: .2s, .2s, .1s;
}



.menu li:nth-child(1) a {/*tweet*/
    -webkit-transition-duration: .5s, .3s, .3s;
    -webkit-transition-delay:0, .3s, .3s;
    -ms-transition-duration: .5s, .3s, .3s;
    -ms-transition-delay: 0, .3s, .3s;
    -o-transition-duration: .5s, .3s, .3s;
    -o-transition-delay:0, .3s, .3s;
    -moz-transition-duration: .5s, .3s, .3s;
    -moz-transition-delay: 0, .3s, .3s;
}
input[type="checkbox"].share_animation:checked + .menu li:nth-child(1) a {/*tweet*/
	left: 105px;
	top: 70px;
    transition-duration: .2s, .2s, .3s;
    transition-delay:.1s, .1s, .1s;
    -webkit-transition-duration: .2s, .2s, .3s;
    -webkit-transition-delay: .1s, .1s, .1s;
    -ms-transition-duration: .2s, .2s, .3s;
    -ms-transition-delay: .1s, .1s, .1s;
    -o-transition-duration: .2s, .2s, .3s;
    -o-transition-delay:.1s, .1s, .1s;
    -moz-transition-duration: .2s, .2s, .3s;
    -moz-transition-delay: .1s, .1s, .1s;
}
.menu li:nth-child(2) a {
    -webkit-transition-duration: .5s, .3s, .3s;
    -webkit-transition-delay: 0, .35s, .35s;
    -ms-transition-duration: .5s, .3s, .3s;
    -ms-transition-delay: 0, .35s, .35s;
    -o-transition-duration: .5s, .3s, .3s;
    -o-transition-delay: 0, .35s, .35s;
    -moz-transition-duration: .5s, .3s, .3s;
    -moz-transition-delay: 0, .35s, .35s;
}        
input[type="checkbox"].share_animation:checked + .menu li:nth-child(2) a {
	left: 122px;
	top: 30px;
    -webkit-transition-duration: .2s, .2s, .3s;
    -webkit-transition-delay: 0.05s, 0.05s, .1s;
    -moz-transition-duration:.2s, .2s, .3s;
    -moz-transition-delay: 0.05s, 0.05s, .1s;
    -ms-transition-duration: .2s, .2s, .3s;
    -ms-transition-delay: 0.05s, 0.05s, .1s;
    -o-transition-duration: .2s, .2s, .3s;
    -o-transition-delay: 0.05s, 0.05s, .1s;
}
.menu li:nth-child(3) a {
    -webkit-transition-duration: .5s, .3s, .3s;
    -webkit-transition-delay: 0, .4s, .4s;
    -moz-transition-duration: .5s, .3s, .3s;
    -moz-transition-delay: 0, .4s, .4s;
    -ms-transition-duration: .5s, .3s, .3s;
    -ms-transition-delay: 0, .4s, .4s;
    -o-transition-duration: .5s, .3s, .3s;
    -o-transition-delay:0, .4s, .4s;
}                
input[type="checkbox"].share_animation:checked + .menu li:nth-child(3) a {/*fb*/
	left: 112px;
	top: -12px;
    -webkit-transition-duration: .2s, .2s, .3s;
    -webkit-transition-delay: 0, 0, 0;
    -moz-transition-duration:.2s, .2s, .3s;
    -moz-transition-delay: .0, 0, 0;
    -ms-transition-duration: .2s, .2s, .3s;
    -ms-transition-delay: 0, 0, 0;
    -o-transition-duration: .2s, .2s, .3s;
    -o-transition-delay:0, 0, 0;
}
.menu li:nth-child(6) a {
    -webkit-transition-duration: .5s, .3s, .3s;
    -webkit-transition-delay: 0, .4s, .4s;
    -moz-transition-duration: .5s, .3s, .3s;
    -moz-transition-delay: 0, .4s, .4s;
    -ms-transition-duration: .5s, .3s, .3s;
    -ms-transition-delay: 0, .4s, .4s;
    -o-transition-duration: .5s, .3s, .3s;
    -o-transition-delay:0, .4s, .4s;
}                
input[type="checkbox"].share_animation:checked + .menu li:nth-child(6) a {/*fb*/
	left: -10px;
    top: 128px;
    -webkit-transition-duration: .2s, .2s, .3s;
    -webkit-transition-delay: 0, 0, 0;
    -moz-transition-duration:.2s, .2s, .3s;
    -moz-transition-delay: .0, 0, 0;
    -ms-transition-duration: .2s, .2s, .3s;
    -ms-transition-delay: 0, 0, 0;
    -o-transition-duration: .2s, .2s, .3s;
    -o-transition-delay:0, 0, 0;
}

#shareIconCheck{
    position: relative;
    z-index: 9999;
}