.cn-wrapper,
.cn-button {
	
	
-webkit-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; }

/*.vertical-nav-holder { position: fixed; top: 60%; left: -200px; margin-top: -241px; z-index: 999;}*/

* {
	box-sizing: border-box;
margin: 0;
padding: 0;
list-style: none;
/*position: relative;*/
}

.cn-wrapper {
position: fixed; top: 50%; left: -200px; z-index: 998;margin-top:-205px;
font-size: 16px; overflow: hidden; border-radius: 50%; width: 410px; height: 410px; -webkit-box-shadow: 0 0 20px 0 rgba(0,0,0,0.4);box-shadow: 0 0 20px 0 rgba(0,0,0,0.4); transform: scale(0);background:#59c5f3;
}


.open {
	transform: scale(1);
}

.cn-wrapper li {
font-size: 1.5em; height: 10em; left: 50%; margin-left: -10em; overflow: hidden; position: absolute; top: -34px; transform-origin: 100% 100% 0; transition: border 0.3s ease 0s; width: 10em; 
}

.cn-button {
 width: 104px; height: 104px;cursor:pointer; background: #da2128; border-radius: 50%; z-index:999; font-size: 30px; line-height: 30px; display: block; position: fixed; top: 50%; left: 7px; margin-left: -42px; margin-top: -52px; color: #fff; text-align: center; padding: 26px 0 0 20px; -webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,0.4); box-shadow: 0 0 10px 0 rgba(0,0,0,0.4);
}

.cn-button.active:hover,
.cn-button.active {  background: #fff; color: #484b4c;  -webkit-box-shadow: 0 0 0px 0 rgba(0,0,0,0); box-shadow: 0 0 0px 0 rgba(0,0,0,0); }

.cn-wrapper li a {
border-radius: 50%; bottom: -7.25em; color: #fff; display: block; font-size: 1.18em; height: 14.5em; padding-top: 0.8em; position: absolute; right: -7.25em; text-align: center; text-decoration: none; transform: skew(-50deg) rotate(-70deg) scale(1); transition: opacity 0.3s ease 0s, color 0.3s ease 0s; width: 14.5em;
}


.cn-wrapper li:first-child { transform: rotate(80deg) skew(50deg); }
.cn-wrapper li:nth-child(2) { transform: rotate(120deg) skew(50deg); }
.cn-wrapper li:nth-child(3) { transform: rotate(160deg) skew(50deg); }
.cn-wrapper li:nth-child(4) { transform: rotate(200deg) skew(50deg); }
.cn-wrapper li:nth-child(5) { transform: rotate(240deg) skew(50deg); }

.cn-wrapper li:nth-child(even) a {
background-color: #0087cb;
}
.cn-wrapper li:nth-child(odd) a {
background-color: #59c5f3;
}
.cn-wrapper li a:hover {
background-color: #0e6a9c;
}

.cn-wrapper-overlay { background-color: rgba(0, 0, 0, 0.6); bottom: 0; height: 100%; left: 0; opacity: 0; position: fixed; right: 0; top: 0; transition: all 0.3s ease 0s; visibility: hidden; width: 100%; z-index: 981; }
.cn-wrapper-overlay.active { opacity: 1; visibility: visible; }