#top {min-width:500px;position:absolute; z-index:4;box-shadow: 1px 1px 8px #333333;left:0;right:0;}
#action { background-color : #3170B5; position:absolute; top:60px; height:30px; left:0px; right:0px; overflow:hidden; z-index:2;}
/*
#function { visibility:hidden;background-color : lightGrey; position:absolute; top:90px; bottom:0; left:0px; width:250px; overflow:hidden; z-index:2;box-shadow: 1px 1px 3px #888888;}
*/
#content { background-color : white; position:absolute; top:90px; bottom:0px; left:0px; right:0; overflow:auto; z-index:1}
#content > iframe { position:relative; width:99%; height:99%}
#user { position:absolute; margin-top:7px; margin-left:20px; width:200px;color:White;white-space: nowrap;overflow:hidden;text-overflow: ellipsis;text-align:center;}
#project { position:absolute; margin-top:7px; margin-left:240px; width:200px;color:White;white-space: nowrap;overflow:hidden;text-overflow: ellipsis;}
#searchicon { position:absolute; margin:4px; margin-left:230px; width:16px; color:White;}
#search { position:absolute; margin:6px; margin-left:481px; width:205px;background-color:White; border-radius: 5px;}
#search > input { margin-left:5px;border:0px;width:195px;}
#search > select { margin-left5px;border-top:0px; border-bottom:0px; border-right:0px;}
.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }

#topx {z-index:300;box-shadow: 2px 2px 5px #888888;text-align: left; margin: 0 auto; width: *px; position: relative; -webkit-box-shadow: 0 0 50px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 0 50px rgba(0, 0, 0, 0.1); box-shadow: 0 0 50px rgba(0, 0, 0, 0.1); background-color: #fff; }

#main-header { padding: 5px 10px 5px 20px;}
#logo   { float: left; height:50px; padding-right:60px}
#navigation { float: left; padding-top: 3px; }

#navigation a { color: #333; text-decoration: none; display: block; position: relative;}
#navigation li.active > a {  color: #ff7100; }
#navigation li.active > a:hover {color: #fff; }
#navigation > ul > li > ul > li  > a:before {content:'> '; color:black; font-weight: bold;}
#navigation > ul > li > ul > li.active  > a {color:black}
#navigation > ul > li > ul > li > a:hover {color:black;padding-left:30px;padding-right:13px;}
#navigation > ul > li > ul > li.active  > a:hover {color:black}
#navigation > ul > li > ul > li.active  > a:before {content:'> '; color:#ff7100; font-weight: bold;}
#navigation > ul > li > ul > li > a { overflow: hidden; height: 17px; -moz-transition: all .5s; -webkit-transition: all .5s; -o-transition: all .5s; transition: all .5s; }

#navigation > ul > li > a { overflow: hidden; height: 17px; -moz-transition: all .5s; -webkit-transition: all .5s; -o-transition: all .5s; transition: all .5s; }
#navigation > ul > li > a:hover { color: #fff; background-color: #ff8a1d; -webkit-box-shadow: inset 0 0 30px #d9531f; -moz-box-shadow: inset 0 0 30px #d9531f; box-shadow: inset 0 0 30px #d9531f; }
#navigation > ul > li > a:hover { background-color: #1e73be; }
#navigation > ul > li > a:hover { -moz-box-shadow: inset 0 0 30px #1b14a0; -webkit-box-shadow: inset 0 0 30px #1b14a0; box-shadow: inset 0 0 30px #1b14a0; }

h1, h2, h3, h4, h5, h6 { font-family: 'Roboto Condensed', Helvetica, Arial, Lucida, sans-serif; }
body { font-family: 'Droid Sans', Helvetica, Arial, Lucida, sans-serif; }

* {margin: 0;padding: 0;}

html{height:100%;/* make sure it is at least as tall as the viewport */position:relative;min-width:900px;min-height:400px;}
body{ height:100%; /* force the BODY element to match the height of the HTML element */	background-color:white;}

h1, h4{margin-top:10px;margin-left:40px;}

h4 {	float:left;}

h4 > a:hover {color:#ff7100;}

#searchresult {z-index:2;position:absolute;top:90px;	left:480px;width:233px;max-height:250px;	background-color : lightGrey;box-shadow: 2px 2px 5px #888888;overflow-y:auto;}

#message {z-index:5;position:absolute;bottom:10px;left:10px;width:600px;max-height:250px;border-width:1px;border-color:#888888;border-radius: 5px;border-style:solid;background-color : #FFFFF0;box-shadow: 2px 2px 5px #888888;padding:0px;overflow-y:auto; }
#message:empty {visibility: hidden;}
#message >div {margin-left:12px;margin-right:12px;border-width:0px;border-style:solid;border-color:grey;background-color: #FFFFF0;display:table-row;}
#message >div>div.info {padding-left:2px;padding-right:2px;border-width:0px;border-bottom-width:1px;border-style:solid;border-color:grey;background-color: #FFFFF0;}
#message >div>div.debug {padding-left:2px;padding-right:2px;border-width:0px;border-bottom-width:1px;border-style:solid;border-color:grey;background-color: #FAFAFA;}
#message >div>div.error {padding-left:2px;padding-right:2px;border-width:0px;border-bottom-width:1px;border-style:solid;border-color:grey;background-color: #FFE0E0;}
#message >div:last-child>div {border-width:0px;border-style:none;margin-right:2px}

.searchmodule{
	background-color : #3170B5;
	color:white;
	margin:5px;
	margin-left:5px;
	width:180px;
	padding:3px;
	padding-left:6px;
	padding-right:6px;
	overflow:hidden;
}

.droppedelement {
	position:absolute;
	background-color : #3170B5;
	color:white;
	width:180px;
	padding:3px;
	padding-left:6px;
	padding-right:6px;
	overflow:hidden;
}

.module {
	position:absolute;
	/*background-color : #eeeeee;*/
	color:black;
	padding:0px;
	margin:0px;
	z-index:2;
	width:150px;
	overflow:hidden;
}

.markmodule {
	box-shadow: 0px 0px 0px 4px rgba(76,84,162,1);
}


.core {
	/*background: rgb(250, 250, 120);
	background: rgb(110, 116, 198);*/
	/*background:lightBlue;*/
	color: black;
	width: 150px;
	/*margin-right:20px;*/
	padding-top:0px;
	padding-bottom:0px;
	text-align:center;
	height:19px;
	z-index:0;
	overflow:hidden;
	line-height: 19px; /* to vertically align text properly in firefox*/
}

.io {
	width:100%;
	background-color : #eeeeee;
	overflow-y:auto;
}

.execution {
	width:100%;
	background-color : #eeeeee;
	overflow-y: hidden;
}

.left {
	width:60px;
	float:left;
}

.right {
	width:60px;
	float:right;
}

.prev {
	float:left;
	background: rgb(110, 100, 100);
	color: white;
	text-align:center;
	width: 60px;
}

.prev-active {
	background: #FF0000;
	color: white;
}

.prev-hover {
	background: #FFAA00;
}

.right-connector {
	float:right;
	background: rgb(110, 100, 100);
	color: white;
	text-align:center;
	width: 60px;
}

.right-connector:hover {
	background: #FFAA00;
	color: black;
}

.arg {
	float:left;
	background: #E9967A;
	color: white;
	text-align:left;
	width: 60px;
	margin-bottom:3px;
	padding:0px;
	overflow:hidden;
	height:18px;
}


.arg:last-child{
	margin-bottom:0px;
}

.arg-repeatable {
	float:left;
	background: #5DBDEC;
	color: white;
	text-align:left;
	width: 60px;
	margin-bottom:3px;
	padding:0px;
	overflow:hidden;
	height:18px;
}


.arg-repeatable:last-child{
	margin-bottom:0px;
}

.arg-locked {
	background: lightGreen;
	color: black;
}

.arg-active {
	background: #FF0000;
	color: white;
}

.arg-hover {
	background: #FFAA00;
	color: black;
}

.arg:hover {
	background: #FFAA00;
	color: black;
}

.res {
	float:right;
	background: lightGreen;
	color: black;
	text-align:right;
	width: 60px;
	margin-bottom:3px;
	height:18px;
	overflow:hidden;
}


.res:last-child{
	margin-bottom:0px;
}


.res:hover {
	background: #FFAA00;
	color: black;
}

.errdata{
	float:right;
	background: #FFAA00;
	color: white;
	text-align:right;
	width: 60px;
	margin-bottom:3px;
	height:18px;
	overflow:hidden;
}

.blank{
	min-height: 18px;
}

.ui-draggable-dragging{
	box-shadow: 5px 5px 5px #888888;
}

li {
	margin-left:40px;
}

table {
	border-collapse:collapse;
}

.message-text {
	margin-top:40px;
	margin-left:40px;
}

.edit-table {
	margin-top:40px;
	margin-left:40px;
}

.edit-table td{
	padding-bottom : 10px;
	padding-right : 5px;
}

.login-table {
	margin-top:40px;
	margin-left:40px;
}

.login-table td{
	padding-bottom : 10px;
	padding-right : 5px;
}


.list-table {
	margin-top:40px;
	margin-left:40px;
	border-width:0px;
	border-style:solid;
}

.list-table tr:nth-child(odd)	{
	background-color:#eee;
	border-color:Grey;
	border-top:0px;
	border-bottom:0px;
	border-color:LightGrey;
}

.list-table tr:nth-child(even) {
	background-color:#fff;
	border-color:Grey;
	border-top:0px;
	border-bottom:0px;
	border-color:LightGrey;
}
.list-table tr:hover {
	background-color:#CCE7E7;
	cursor: pointer;
	cursor: hand;
}

.list-table th{
	padding-left:7px;
	padding-right:7px;
	padding-top:6px;
	padding-bottom:6px;
	background-color:Beige;
	border-style:solid;
	border-width:1px;
	border-top:0px;
	border-bottom:0px;
	border-color:LightGrey;
}

.list-table td{
	padding-left:7px;
	padding-right:7px;
	padding-top:4px;
	padding-bottom:4px;
	border-style:solid;
	border-width:1px;
	border-top:0px;
	border-bottom:0px;
	border-color:LightGrey;
}

.list-table-last-row td{
	border-width:0px;
	background-color: Beige;
}

.list-table tr th:first-child,
.list-table tr td:first-child{
	border-left:0px;
}

.list-table tr th:last-child,
.list-table tr td:last-child{
	border-right:0px;
}


.left-col {
	float:left;
}

.right-col {
	float:right;
}

.main-menu {
    list-style:none;
    float:left;
	position:relative;
	z-index:5;
	padding:0px;
	margin:0px;
}

.main-menu li{
    float:left;
	margin-left:0px;
    position:relative;
	list-style:none;
	/*margin:0px; */
	/*display:inline-block;*/
 	text-decoration: none;
	background-color: LightGrey;
}

#navigation > ul > li > ul > li > a{ padding-right:30px;}

.main-menu a{
    display:block;
    padding:13px;
    color:#fff;
    background:#fff	;
    text-decoration:none;
}

.main-menu ul{
    background:LightGrey; /* Adding a background makes the dropdown work properly in IE7+. Make this as close to your page's background as possible (i.e. white page == white background). */
    background:rgba(255,255,255,0); /* But! Let's make the background fully transparent where we can, we don't actually want to see it if we can help it... */
    display:normal;
    position:absolute;
    left:-9999px; /* Hide off-screen when not needed (this is more accessible than display:none;) */
	box-shadow: 2px 2px 5px #888888;
}

.main-menu ul li{
    padding-top:1px; /* Introducing a padding between the li and the a give the illusion spaced items */
	padding-left:1px;
    float:none;
}

.main-menu ul a{
    white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */
}

.main-menu li:hover ul{ /* Display the dropdown on hover */
    left:0px; /* Bring back on-screen when needed */
}

a {
	text-decoration: none;
	color: black;
	margin:0px;
}

#searchinfo {
	z-index:2;
	visibility:hidden;
	position:absolute;
	top:95px;
	left:720px;
	background-color:lightGrey;
	width:200px;
	max-height:250px;
	box-shadow: 2px 2px 5px #888888;
}

#tooltip {
	z-index:5;
	visibility:hidden;
	position:absolute;
	top:0px;
	left:545px;
	background-color:lightGrey;
	width:200px;
	max-height:250px;
	box-shadow: 2px 2px 5px #888888;
}

#tooltiptitle {
	font-weight: bold;
	color:#444444;
	padding:6px;
	/*background-color:#DDDDDD;*/
}

#tooltipvalue {
	background: lightGreen;
	color: black;
	padding:6px;
	word-wrap: break-word;
}

#tooltipbody {
	padding:6px;
}


hr { border:0px; height:1px; background-color:darkGrey;}

.xxxdeleteedge1 {
	position: absolute;
	background: transparent;
	color: #FF0000;
	z-index:0;
}

.elink {stroke:green;stroke-width:1px;fill: none;}
.elink:hover {stroke:Orange;stroke-width:6px;}

.dlink {stroke:black;stroke-width:1px;fill: none;}
.dlink:hover {stroke:Orange;stroke-width:6px;}

svg {
	position: absolute;
	width: 100%;
	height: 100%;
	z-index:0;
}

#links {
	z-index:0;
}

.operator { background-color : #6FC464 }
.visualization { background-color : #F3C51F }
