/* ------------------------- CONTEXT MENU STRUCTURE ------------------------- */

.node-context-menu {
	transition: all .5s ease;
}

.node-context-menu a {
	font-family: 'Open Sans', sans-serif;
}

.node-context-menu {
	min-width: 200px;
	background-color: #FFF;
	font-family: 'Open Sans', sans-serif;
	color: #555;
	box-sizing: border-box;
	/* border: 1px solid #D6D6D6; */
	border-radius: 2px;
	box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
}

.node-context-menu > .node-context-menu-header {
	font-variant: small-caps;
	font-size: 120%;
	color: #2C3E50;
	border-bottom: 1px solid #2C3E50;
	padding-top: 5px;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 5px;
	background-color: #CBD0D3;
}

.node-context-menu > .node-context-menu-body {
	padding: 0px;
	font-size: 95%;
}

.node-context-menu > .node-context-menu-footer {
	padding: 10px;
	border-top: 1px solid #2C3E50;
	background-color: #CBD0D3;
}

.node-context-menu > .arrow {
	border-width: 10px;
	position: absolute;
	display: block;
	width: 0;
	height: 0;
	border-color: transparent;
	border-style: solid;
}

.node-context-menu.top {
	margin-top: -12px;
}
.node-context-menu.top > .arrow {
	left: 50%;
	bottom: -10px;
	margin-left: -10px;
	border-top-color: #FFF;
	border-bottom-width: 0;
}

.node-context-menu.bottom {
	margin-top: 12px;
}
.node-context-menu.bottom > .arrow {
	left: 50%;
	top: -10px;
	margin-left: -10px;
	border-bottom-color: #FFF;
	border-top-width: 0;
}

.node-context-menu.left {
	margin-left: -12px;
}
.node-context-menu.left > .arrow {
	top: 50%;
	right: -10px;
	margin-top: -10px;
	border-left-color: #FFF;
	border-right-width: 0;
}

.node-context-menu.right {
 	margin-left: 12px;
}
.node-context-menu.right > .arrow {
	top: 50%;
	left: -10px;
	margin-top: -10px;
	border-right-color: #FFF;
	border-left-width: 0;
}

/* ----------------------- END CONTEXT MENU STRUCTURE ----------------------- */

/* ----------------------------- GEOFFREY STUFF ----------------------------- */

.node-context-menu .separator {	
	width: 100%;
    height: 1px;
    margin: 3px auto;
    background-color: #D6D6D6;
}

.node-context-menu li.existing-relationships {
	line-height: 1;
	
}

.node-context-menu li.existing-relationships span.relationship-name-wrapper {
    float: left;
    width: 130px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.node-context-menu .existing-relationships a {
    padding: 0 5px;
}

.row-node-context-menu-title {
	border         			: 0px solid red;
	margin         			: 0px;
  	padding        			: 0px;	
	display        			: flex;	  
	-webkit-align-items		: center;
	flex-align	   			: center;
}

	.row-node-context-menu-title .icon-column {
		border       : 0px solid red;
		display      : inline;
		float        : left;
		font-size    : 20px;
		color        : white;
		text-align   : center;
		padding-top	 : 5px;
	}	
	.row-node-context-menu-title .circle-base {
		border-radius: 50%;
	   	border: 1px solid #2c3e50;
	}
	.row-node-context-menu-title .icon-circle {
		width: 36px;
		height: 36px;
		margin : 0px;
		padding: 3px;
	}
	
		.row-node-context-menu-title .row-node-id {
		  clear         : both;
		  display       : block;
		  margin-bottom : 5px;
		  
		}
		
			.row-node-context-menu-title .row-node-id .node-id {
			  font-size : 12px;
			  color     : #7F8C8D;
			}


	.row-node-context-menu-title .node-name-column {
	  border         : 0px solid purple;
	  float          : left;
	  display        : inline;
	  margin-top     : 0px;
	  margin-left    : 10px;
	  padding        : 0px;
	  
	}

		.node-context-menu-title {
    margin-top: 50px;
		}		
		
			.node-context-menu-title .node-label{
				color : #7f8c8d;
			}

.node-context-menu-body .menu-item {
  margin-left : 10px;
}
  
.node-context-menu-body .icon-container {
  width     : 18px;
  border    : 0px solid red;
  display	: inline-block;
}
			
/* --------------------------- END GEOFFREY STUFF --------------------------- */

.menu-item .relationship-name-container{
	   			border 				: 0px solid red;
	   			display 			: inline-block;
	   			width 				: 145px;
	   			margin-top			: 3px;
	   			margin-bottom 		: 0px;
	   			line-height 		: 12px;
	   }

			.menu-item .relationship-name-wrapper{
  				white-space				  : nowrap;
     			overflow				  : hidden;
  				display 				    : block;
  				width 					    : 140px !important;
  				border 					    : 0px solid orange;
  				text-overflow 			: ellipsis;
  			}





.node-context-menu-body .icon-container {
  width     : 18px;
  border    : 0px solid red;
  display	: inline-block;
}

.node-context-menu-body  .active-node-id {
        			font-size 		: 12px;
        			color     		: #ff0000;
        			font-style		: italic;
        
        			text-overflow	: ellipsis;
    				white-space		: nowrap;
    				overflow		: hidden;
    				max-width		: 65px; 
    				float			: right;
    				margin-right 	: 5px;
        
      	}
      	
.node-context-menu-body  .active-node-id-other {
        			font-size 		: 12px;
        			color     		: #7f8c8d;
        			font-style		: italic;
        
        			text-overflow	: ellipsis;
    				white-space		: nowrap;
    				overflow		: hidden;
    				max-width		: 65px; 
    				float			: right;
    				margin-right 	: 5px;
        
      	}			
      
           
.node-context-menu-body ul li ul li.nodes-end-points:hover .active-node-id {	     			
	color     		: #2e2e2e;
	font-style		: italic;
	text-overflow	: ellipsis;
	white-space		: nowrap;
	overflow		: hidden;
	max-width		: 65px; 
	float			: right;
}

   
	
.node-context-menu-body .number-of-nodes-circle{
    width: 15px;
    height: 15px;
    background-color: #555555;
    color: #FFFFFF;
    font-size: 9px;
    float: left;
    margin-right: 5px;
    text-align: center;
    border-radius: 50%;
    margin-top: 7px;
    font-weight: bold;
    line-height: 28px;
}
	
.number-of-nodes-circle .number-inside-circle{
	border 				      : 0px solid orange;
	height 				      : 18px;
 	margin-top 			    : -6px;
}
			
.node-context-menu-body .direction-icon-container-wrapper {
    float: right;
    line-height: 12px;
    padding-top: 4px;
}
				

.direction-icon-container .direction-text-in-container,
.direction-icon-container .direction-text-out-container {
    font-size: 10px;
    color: #555;
    text-align: center;
    margin: 2px auto;
}

.direction-icon-container .direction-icon-wrapper{
	  font-size            : 16px;
	  margin-top           : -8px;
	  border               : 0px solid purple;
	  padding-bottom       : -5px;
	  line-height		       : 8px;
	}