.cd-stretchy-nav {
  position: absolute;
  z-index: 2;

  pointer-events: none;
}
.cd-stretchy-nav{

z-index: 1;

/* padding-top: 12vh; */

-webkit-transition: height 0.2s;

-moz-transition: height 0.2s;

transition: height 0.2s;

top: 0px;

right: 0;

height: 93px;

width: 60px;
}
.cd-stretchy-nav.nav-is-visible {
  pointer-events: auto;
 
}
.cd-stretchy-nav.nav-is-visible .stretchy-nav-bg {
  height: 100%;
 
}

.cd-nav-trigger {
  position: relative;
  z-index: 3;
  top:16px;
  width:60px;
  padding-top: 25px;
  height:60px;
  /* replace text with image */
  overflow: hidden;
  white-space: nowrap;
  color: transparent;
  pointer-events: auto;
  -webkit-border-radius: 60px;
  -moz-border-radius: 60px;
  border-radius: 60px;
  /* right:0px; */
  display: inline-block;
  transform: translateY(50% - 30px);
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  /* margin-top: 0px; */
}
 
.cd-nav-trigger  span .top2{width: 100%;}
.cd-nav-trigger span:nth-of-type(1) {

top: 28px;
}
.cd-nav-trigger span:nth-of-type(2) {
    top: 35px;
}
.cd-nav-trigger span:nth-of-type(3) {
    top: 20px;
}
.cd-nav-trigger span:nth-of-type(4) {
     width:34px;
    top: 27px;
}

.cd-nav-trigger span {


    height: 2px;
    width: 45%;
    position: absolute;
    top: 0;
    -webkit-transition: all .35s ease;
    transition: all .35s ease;
    cursor: pointer;
    margin: auto !important;
    left: 0px;
    right: 0px;

}

.nav-is-visible .top {
    -webkit-transform: translateY(11px) translateX(20px) rotate(45deg);
    transform: translateY(13px) translateX(0px) rotate(45deg);
    background: #fff;
    height: 2px;
}

.nav-is-visible .middle {
    opacity: 0;
    background: #FFF;
}
.nav-is-visible .top2{
    display: none;
}
.nav-is-visible .bottom {
    -webkit-transform: translateY(-11px) translateX(20px) rotate(-45deg);
    transform: translateY(-4px) translateX(0px) rotate(-45deg);
    background: #fff;
    height: 2px;
}

.nav-is-visible .cd-nav-trigger span {

top: 16px;
}

.nav-is-visible  .bottom {
    -webkit-transform: translateY(-11px) translateX(20px) rotate(-45deg);
    transform: translateY(-4px) translateX(0px) rotate(-45deg);
    background: #fff;
    height: 2px;
    top: 33px !important;

}
.navVisble{display:none;}

.nav-is-visible .navVisble {
    display: block !important;
    background: #6e5187;
    /* width: 250px; */
    /* padding: 20px; */
    /* z-index: 10; */
    position: absolute;
    margin-top: 10px;
    width: 100%;
    top: -10px;
    padding-top: 20vh;
    height: 100vh;
    text-align: center;
}
.nav-is-visible .cd-nav-trigger{right:15px !important;position: absolute;}
/* -------------------------------- 

keyframes

-------------------------------- */
@-webkit-keyframes scaleIn {
  from {
    -webkit-transform: translateY(-50%) scale(0);
  }
  to {
    -webkit-transform: translateY(-50%) scale(1);
  }
}
@-moz-keyframes scaleIn {
  from {
    -moz-transform: translateY(-50%) scale(0);
  }
  to {
    -moz-transform: translateY(-50%) scale(1);
  }
}
@keyframes scaleIn {
  from {
    -webkit-transform: translateY(-50%) scale(0);
    -moz-transform: translateY(-50%) scale(0);
    -ms-transform: translateY(-50%) scale(0);
    -o-transform: translateY(-50%) scale(0);
    transform: translateY(-50%) scale(0);
  }
  to {
    -webkit-transform: translateY(-50%) scale(1);
    -moz-transform: translateY(-50%) scale(1);
    -ms-transform: translateY(-50%) scale(1);
    -o-transform: translateY(-50%) scale(1);
    transform: translateY(-50%) scale(1);
  }
}
@-webkit-keyframes slideIn {
  from {
    opacity: 0;
    -webkit-transform: translateX(-25px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateX(0);
  }
}
@-moz-keyframes slideIn {
  from {
    opacity: 0;
    -moz-transform: translateX(-25px);
  }
  to {
    opacity: 1;
    -moz-transform: translateX(0);
  }
}
@keyframes slideIn {
  from {
    opacity: 0;
    -webkit-transform: translateX(-25px);
    -moz-transform: translateX(-25px);
    -ms-transform: translateX(-25px);
    -o-transform: translateX(-25px);
    transform: translateX(-25px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
  }
}


@media screen and (max-width:1200px) {
.cd-stretchy-nav.nav-is-visible {
    pointer-events: auto;
    position: fixed;
    width: 100% !important;
    top: 00px;
    left:0px;
    z-index:9999;
}
}


@media screen and (max-width:480px) {
.cd-stretchy-nav.nav-is-visible {
    pointer-events: auto;
    position: fixed;
    width: 100% !important;
    z-index:9999;

}
.cd-nav-trigger {
    /* top: 0vh; */
}
}



.navVisble .RadMenu .rmItem {
    padding: 0;
    width: 100% !important;
    text-align: center;
}





@media screen and (max-width:767px) {
 header .cd-nav-trigger{right:15px;}
.darkHeader  .cd-nav-trigger{right:0px !important;}
.cd-nav-trigger span{     }
.cd-nav-trigger {
background: #503769;
}
.cd-nav-trigger span{    background: #fff;}

.nav-is-visible  .top{

}
.nav-is-visible  .bottom {

}

.cd-nav-trigger {
     /* top: 36px; */
}
.nav-is-visible .cd-nav-trigger {
    right: 15px !important;
     top: 50px;
}

}


@media screen and (min-width:767px) {
.cd-nav-trigger span{    background: #503769;}
.cd-nav-trigger {
background: #fff;
}
.cd-nav-trigger span{    background: #fff;}
.cd-nav-trigger {
color: #503769;
}

.cd-nav-trigger {
background: #503769;
}
.nav-is-visible  .top{
   background: #fff !important;
}
.nav-is-visible  .bottom {
   background:#fff !important;
}


}