/* circle menu Start */

.circular-menu.hide{
	opacity: 0;
	display:none;
}
.circular-menu.show{
	opacity: 1;
}
.circular-menu__button {
    display: none;
}
.circular-menu {
    position: fixed;
    top: 50%;
    right: 150px;
    padding-top: 20px;
    z-index: 8;
    transition: all 0.4s;
}
.circular-menu__icon {
    background: #fff;
    border-radius: 6px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
    color: #000;
    height: 56px;
    position: absolute;
    left: -30px;
    position: absolute;
    text-align: center;
    top: -30px;
    transform: translate3d(0, 0, 0);
    transition: transform ease-out 0.2s;
    width: 56px;
    cursor: pointer;
    transform: translate3d(0, 0, 0);
    transition-duration: 0.4s;
    transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
    z-index: 2;
    padding: 10px;
    font-size: 0px;
}
.circular-menu__button:checked + .circular-menu__icon {
    transform: scale(0.8, 0.8) translate3d(0, 0, 0);
    transition-duration: 0.2s;
    transition-timing-function: linear;
}



.circular-menu__button:checked + .circular-menu__icon:after{
	    background: #6d0b45;
}

.circular-menu__button:checked + .circular-menu__icon > .hamburger{
	background: var(--white);
}
.circular-menu__icon > .hamburger {
    background: #6d0b45;
    display: block;
    width: 20px;
    height: 3px;
    left: 50%;
    margin-left: -10px;
    margin-top: -1.5px;
    position: absolute;
    top: 50%;
    transition: transform 0.2s;
}
.circular-menu__icon:after {
    content: "";
    width: 100%;
    height: 100%;
    box-shadow: 0 0px 4px rgba(0, 0, 0, 0.25);
    display: block;
    border-radius: 4px;
}
.circular-menu__icon > .hamburger-bar:nth-child(1) {
    transform: translate3d(0, 0, 0) rotate(90deg);
}
.circular-menu__button:checked + .circular-menu__icon > .hamburger-bar:nth-child(1) {
    transform: translate3d(0, 0, 0) rotate(45deg);
}
.circular-menu__icon > .hamburger-bar:nth-child(2) {
    transform: translate3d(0, 0, 0);
    display: none;
}
.circular-menu__button:checked + .circular-menu__icon > .hamburger-bar:nth-child(2) {
    transform: translate3d(0, 0, 0) scale(0.1, 1);
}
.circular-menu__icon > .hamburger-bar:nth-child(3) {
    transform: translate3d(0, 0px, 0);
}
.circular-menu__button:checked + .circular-menu__icon > .hamburger-bar:nth-child(3) {
    transform: translate3d(0, 0, 0) rotate(-45deg);
}
.circular-menu__button:checked + .circular-menu__icon + .menu-items {
    transform: scale(1);
}
.menu-items {
    list-style: none;
    padding: 0;
    margin: 0;
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transform: scale(0);
    transform-origin: top;
    transition: transform 0.3s ease-in-out;
}
.menu-items li:nth-child(1) {
    transform: rotate(0deg) translateY(-140px);
}

.menu-items li {
    position: absolute;
    transform-origin: top;
    transition: transform 0.3s ease-in-out;
}

.menu-items li a i{
	   transition: transform 0.3s ease-in-out;
}
.menu-items li:hover a i{
	    transform: scale(1.2);
}

.menu-items li a {
    text-decoration: none;
    color: #fff;
/*     border: 1px solid #fff; */
    border-radius: 4px;
    padding: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    box-shadow: 0 0px 5px rgba(0, 0, 0, 0.25);
    font-size: 18px;
}
.menu-items li:nth-child(1) {
    transform: rotate(0deg) translateY(-140px);
}
.menu-items li:nth-child(1) a {
    transform: rotate(0deg);
}
.menu-items li a.link1 {
    background: linear-gradient(to bottom, #87e325 0%, #5fa118 100%);
/*     background:#895847; */
}

.menu-items li:nth-child(2) {
    transform: rotate(51.5deg) translateY(-140px);
}
.menu-items li:nth-child(2) a {
    transform: rotate(-51.5deg);
}
.menu-items li a.link2 {
    background: linear-gradient(180deg, #6D5CFA 0%, #574BDC 118.93%);
    /*     background:#de324c; */
}

.menu-items li:nth-child(3) {
    transform: rotate(103deg) translateY(-140px);
}
.menu-items li:nth-child(3) a {
    transform: rotate(-103deg);
}
.menu-items li a.link3 {
    background: linear-gradient(180deg, #49ACFF 0%, #1472C0 118.93%);
     /*     background:##895847; */
}

.menu-items li:nth-child(4) {
    transform: rotate(154.5deg) translateY(-140px);
}
.menu-items li:nth-child(4) a {
    transform: rotate(-154.5deg);
}
.menu-items li a.link4 {
    background: linear-gradient(180deg, #fa9b4d 0%, #ff516a 100%);
     /*     background:#46698a; */
}

.menu-items li:nth-child(5) {
    transform: rotate(206deg) translateY(-140px);
}
.menu-items li:nth-child(5) a {
    transform: rotate(-206deg);
}
.menu-items li a.link5 {
    background: linear-gradient(to bottom, #a0dc5f 0%, #75b82e 100%);
    /*     background:#8a508f; */
    
}

.menu-items li:nth-child(6) {
    transform: rotate(257.5deg) translateY(-140px);
}
.menu-items li:nth-child(6) a {
    transform: rotate(-257.5deg);
}
.menu-items li a.link6 {
    background: linear-gradient(180deg, #CF435D 0%, #C23550 100%);
/*         background: #003f5c; */
}

.menu-items li:nth-child(7) {
    transform: rotate(309deg) translateY(-140px);
}
.menu-items li:nth-child(7) a {
    transform: rotate(-309deg);
}
.menu-items li a.link7 {
    background: linear-gradient(180deg, #DB1F96 0%, #72094C 100%);
/*         background: #f46d43; */
}

/* .menu-items li:nth-child(8) { */
/*     transform: rotate(315deg) translateY(-140px); */
/* } */
/* .menu-items li:nth-child(8) a { */
/*     transform: rotate(-315deg); */
/* } */
.menu-items li a.link8 {
    padding: 8px;
    background: linear-gradient(180deg, #2AB696 0%, #16896F 100%);
}




/* circle menu Start */
.menu-items{ right:-25px; top:10px;   width: 130px;   flex-wrap: wrap;  justify-content: space-around; box-shadow: -4px 4px 4px rgba(0, 0, 0, 0.06); background: rgba(255,255,255,0.93); border-radius:24px 0 0 24px;  padding: 15px; display: grid; grid-template-columns: repeat(2, 1fr);  grid-gap: 10px;     transform: scale(1) translateX(200px);}
.menu-items li{ transform: rotate(0) translateY(0px) !important; position: static; margin:auto;}
.menu-items li a{transform: rotate(0) !important; width: 40px; height: 40px; padding: 8px;}
.circular-menu__icon{height: 40px; width: 40px; left: -20px; top:-36px; padding:5px;}
.circular-menu__icon > .hamburger{width:16px; margin-left:-8px;}
.circular-menu{    top: 120px;  right: 25px;}
.circular-menu__button:checked + .circular-menu__icon + .menu-items { transform: scale(1) translateX(0px);}
 /* circle menu End */ 
 
 
 .circular-menu__button + .circular-menu__icon + .menu-items {
    max-height: 448px;
    overflow: auto;
}

/* circle menu End */