/* -------------------------------- 

меню левое

-------------------------------- */



.cd-panel {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 1000;
}

.cd-main-content  {
  position: relative;
 
}

.cd-panel {
  
  visibility: hidden;
  -webkit-transition: visibility 0s 0.6s;
  -moz-transition: visibility 0s 0.6s;
  transition: visibility 0s 0.6s;
}

.cd-panel.is-visible {
  visibility: visible;
  -webkit-transition: visibility 0s 0s;
  -moz-transition: visibility 0s 0s;
  transition: visibility 0s 0s;
}





.cd-panel-container {
  position: fixed;
  width: 80%;
  height: 100%;
  top: 0;
  background: #202020;
  z-index: 1000;
  -webkit-transition-property: -webkit-transform;
  -moz-transition-property: -moz-transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-delay: 0.3s;
  -moz-transition-delay: 0.3s;
  transition-delay: 0.3s;
}
.from-right .cd-panel-container {
  left: 0;
  -webkit-transform: translate3d(-100%, 0, 0);
  -moz-transform: translate3d(-100%, 0, 0);
  -ms-transform: translate3d(-100%, 0, 0);
  -o-transform: translate3d(-100%, 0, 0);
  transform: translate3d(-100%, 0, 0);
}
.is-visible .cd-panel-container {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-transition-delay: 0s;
  -moz-transition-delay: 0s;
  transition-delay: 0s;
}

.cd-panel-content {
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
  overflow: auto;
  /* smooth scrolling on touch devices */
  -webkit-overflow-scrolling: touch;
}


.cd-panel:after {
				content: ''; 
				position: absolute; 
				left: 0;
				width: 100%;
				height: 100%; 
				background: rgba(0,0,0,.5); 
				border-radius: 5px;
				z-index: 2;
}



/* -------------------------------- 

меню правое

-------------------------------- */


.cd-panelR {
  position: fixed;
  top: 0;
  right: 0;
  height: 100%;
  width: 100%;
  z-index: 1000;
  visibility: hidden;
  transition: visibility 0s 0.6s;
}

.cd-panelR.is-visibleR {
  visibility: visible;
  transition: visibility 0s 0s;
}

.cd-main-contentR {
  position: relative;
}

.cd-panel-containerR {
  position: fixed;
  width: 80%;
  height: 100%;
  top: 0;
  right: 0;
  background: #202020;
  z-index: 1000;
  transition-property: transform;
  transition-duration: 0.3s;
  transition-delay: 0.3s;
}

.from-leftR .cd-panel-containerR {
  right: 0;
  transform: translate3d(100%, 0, 0); /* смещение направо */
}

.is-visibleR .cd-panel-containerR {
  transform: translate3d(0, 0, 0);
  transition-delay: 0s;
}

.cd-panel-contentR {
  position: relative;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

.cd-panelR:after {
  content: '';
  position: absolute;
  right: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,.5);
  border-radius: 5px;
  z-index: 2;
}


