.djcontextmenu {
  position: absolute;
  width: auto;
  z-index: 9999999999;
  top: 0;
  left: 0;
  flex-direction: column;
  display: none;
  /*&.loaded{
  	.menu_items{
  		transition: opacity 0.3s, transform 0.7s,max-height 0.3s;
  	}
  	&.cxvis{		
  		.menu_items{
                 min-height:2rem;
                 min-width:5rem;
  			opacity:1;
  			transform:translateY(0);			
  			max-height:500px;
  			transition: opacity 0.5s, transform 0.3s,max-height 0.7s;
                 box-shadow: 6px 5px 9px -5px rgba(0,0,0,0.6);                
  		}
         }
         &.cxdone{
             .menu_item{
                 a{
                     &:hover{                        
                         background:$config_popup_primary_col;                        
                         color: choose-contrast-color($config_popup_primary_col);                        
                         i,span{
                             color: choose-contrast-color($config_popup_primary_col);                        
                         }				
                     }
                 }
             }
         }
     }*/
  /* &[data-position="left"]{
       .menu_items{
           right:auto;
           left:0;   
       }
   }*/
}
.djcontextmenu.vis {
  display: flex;
}
.djcontextmenu .menu_icon {
  position: relative;
  z-index: 10;
  top: 50%;
  margin-top: -50%;
}
.djcontextmenu .menu_icon a {
  cursor: pointer;
  background: transparent;
  padding: 0.3rem;
  font-size: 2rem;
  line-height: 0.1rem;
  text-align: center;
  width: 2rem;
  height: 2rem;
  display: flex;
  align-items: center;
  color: #1a1a1a;
  border: 1px solid transparent;
  border-radius: 3px;
}
.djcontextmenu .menu_icon a:hover {
  background: #f3f3f3;
  color: #1a1a1a;
  border: 1px solid rgba(0, 0, 0, 0.4);
}
.djcontextmenu .menu_items {
  position: relative;
  background: #f3f3f3;
  border: 1px solid rgba(0, 0, 0, 0.1);
  display: flex;
  flex-direction: column;
}
.djcontextmenu .menu_items:hover {
  border: 1px solid rgba(0, 0, 0, 0.2);
}
.djcontextmenu .menu_items .menu_title {
  text-align: center;
  padding: 0.5rem;
  background: #82c4f8;
  color: #fff;
  font-weight: 600;
}
.djcontextmenu .menu_items .menu_item a {
  font-weight: 300;
  font-size: 0.875rem;
  line-height: 1rem;
  padding: 1rem 1rem;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  text-decoration: none;
  color: #1a1a1a;
  cursor: pointer;
}
.djcontextmenu .menu_items .menu_item a span {
  flex: 1 1 auto;
  text-align: left;
  white-space: nowrap;
  padding-right: 1rem;
}
.djcontextmenu .menu_items .menu_item a i {
  text-align: left;
  color: #1a1a1a;
  font-size: 1rem;
  margin: 0;
  padding: 0;
  flex: 0 0 1.6rem;
}
.djcontextmenu .menu_items .menu_item a:hover {
  background: #2196F3;
  color: #fff;
}
.djcontextmenu .menu_items .menu_item a:hover i, .djcontextmenu .menu_items .menu_item a:hover span {
  color: #fff;
}
.djcontextmenu.sm .menu_items .menu_item a {
  font-size: 0.85rem;
  font-weight: 600;
  padding: 0.5rem 1rem;
}
.djcontextmenu.sm .menu_items .menu_item a span {
  padding-right: 0.7rem;
}
.djcontextmenu.sm .menu_items .menu_item a i {
  font-size: 0.85rem;
  flex: 0 0 1.3rem;
}

/*# sourceMappingURL=modules-common-scss-djcontextmenu.css.map */