@font-face {font-family: 'Oswald';font-style: normal;font-weight: 400;src: url('/resources/graph/oswald.ttf') format('truetype');}
@font-face {font-family: 'sourcesanspro';font-style: normal;font-weight: 100;src: url('/resources/graph/SourceSansPro-ExtraLight.otf') format('opentype');}
@font-face {font-family: 'sourcesanspro';font-style: normal;font-weight: 200;src: url('/resources/graph/SourceSansPro-Light.otf') format('opentype');}
@font-face {font-family: 'sourcesanspro';font-style: normal;font-weight: 400;src: url('/resources/graph/SourceSansPro-Regular.otf') format('opentype');}
@font-face {font-family: 'sourcesanspro';font-style: normal;font-weight: 500;src: url('/resources/graph/SourceSansPro-Semibold.otf') format('opentype');}
@font-face {font-family: 'sourcesanspro';font-style: normal;font-weight: 700;src: url('/resources/graph/SourceSansPro-Bold.otf') format('opentype');}
@font-face {font-family: 'sourcesanspro';font-style: normal;font-weight: 900;src: url('/resources/graph/SourceSansPro-Black.otf') format('opentype');}

@font-face {font-family: 'Roboto';font-style: normal;font-weight: 100;src: url('/resources/graph/Roboto-Thin.ttf') format('truetype');}
@font-face {font-family: 'Roboto';font-style: normal;font-weight: 200;src: url('/resources/graph/Roboto-Regular.ttf') format('truetype');}
@font-face {font-family: 'Roboto';font-style: normal;font-weight: 400;src: url('/resources/graph/Roboto-Bold.ttf') format('truetype');}
@font-face {font-family: 'RobotoRegular';font-style: normal;font-weight: 400;src: url('/resources/graph/Roboto-Regular.ttf') format('truetype');}


header { height: 70px !important; }

header a:link,a:visited {text-decoration: none; color: #3FB7E1;}
header a:hover {color: #004e76;}
header #banner{
	height: 20px;  
}
header #logo{
	position: absolute; top:10px; left:10px; z-index:10
}
header #pagetitle{
	font-family: Roboto, Geneva, sans-serif;
	font-size: 22px; 
	font-weight: 400;
	position: absolute;
	top: 14px;
	left: 126px;
	border: 0px solid red;
	color: #949494;
}
header #menu {
	margin:0px 0px 0px 0px;
	padding:52px 0px 0px 0px;
	text-align: center;	
}

header ul {
	font-family: Roboto, Geneva, sans-serif;
	font-size: 18px; 
	font-weight: 400;
	height: 7px;  
	text-align: center;	
    list-style-type: none;	
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
}
header ul li {
	float:left;
	margin: 0px 0px 0px 0px; 
	text-align: center;	
}

header .a_active {
	float:left;
	color: #0000F0;
	color: #818699;
	padding: 10px 30px 10px 30px;
	margin: 0px 0px 0px 0px;
	border-radius: 4px 4px 0px 0px;
	background:#EEE;
}
header .a_passive {
	float:left;
	color: #818699;
	padding: 10px 30px 10px 30px;
	margin: 0px 0px 0px 0px;
}
header #refresh {
	position: absolute; top: 62px; left: 92%;
	font-size: .7em; 
	font-weight: normal; 
	color: grey;
	text-align: right;
	}
header #refreshbox {
	position: relative; top: 3px; left: 0px;
	margin-top: -2px;
	padding-top: -2px;
}
header #seq_table_div {
	border-top: 2px solid  #E0E0E0; 	
	padding-left: 20px; 
	padding-top: 5px; 
}

header #scriptsframe_div {
	border-top: 2px solid  #E0E0E0;  
	margin-top: 25px;
	z-index: 100;

}
header #scriptsframe {
}
header #sep_div {
}

//// sequences
table#seq_table {
	border-collapse:collapse;
	width: 100%;
	font-family : Arial, Helvetica, sans-serif;
	color: grey; 
	font-size: .75em; 
	text-align: left;
}
.seq_tr_title1 {
	text-align: left;
	font-weight:bold;
	font-size: .90em; 
	color: #A0A0A0; 
}
.seq_tr_title2 {
	height: 20px;
	text-align: left;
	vertical-align:30%;
	font-weight:normal;
	font-size: .90em; 
	color: #A0A0A0; 
}
.seq_tr {
	text-align: left;
	font-weight:normal;
	font-size: .90em; 
}
.seq_name_td1_title1 {
	width: 300px;
	padding-top:5px;
	padding-bottom:5px;
}
.seq_name_td1_title2 {
	width: 300px;
	border-bottom: 2px solid LightGrey; 
}
.seq_name_td1 {
	width: 360px;
	padding-top:7px;
	padding-bottom:7px;
	border-bottom: 1px solid LightGrey; 
}
.seq_name_td2_title1 {
	width: 120px;
}
.seq_name_td2_title2 {
	width: 120px;
	border-bottom: 2px solid LightGrey; 
}
.seq_name_td2 {
	width: 160px;
	border-bottom: 1px solid LightGrey; 
}
.seq_name_td3_title1 {
	width: 80px;
}
.seq_name_td3_title2 {
	width: 80px;
	border-bottom: 2px solid LightGrey; 
}
.seq_name_td3 {
	width: 60px;
	border-bottom: 1px solid LightGrey; 
}
.seq_time_td_title1 {
	width: 75px;
}
.seq_time_td_title2 {
	width: 60px;
	border-bottom: 2px solid LightGrey; 
}
.seq_time_td {
	width: 60px;
	padding-left: 30px;
	border-bottom: 1px solid LightGrey; 
}
.seq_msg_td_title1 {
	overflow:hidden;
}
.seq_msg_td_title2 {
	overflow:hidden;
	border-bottom: 2px solid LightGrey; 
}
.seq_msg_td {
	overflow:hidden;
	border-bottom: 1px solid LightGrey; 
}
.seq_status_title1{
	width: 75px;
	text-align: center;
}
.seq_status_title2{
	width: 75px;
	text-align: center;
	border-bottom: 2px solid LightGrey; 
}
.seq_status_empty_title2{
	width: 75px;
	text-align: center;
	border-bottom: 2px solid LightGrey; 
}
.seq_status_start{
	width: 75px;
	text-align: center;
	background: url("/resources/graph/s_blue.png") no-repeat center center; 
	border-bottom: 1px solid LightGrey; 
}
.seq_status_end{
	width: 75px;
	text-align: center;
	background: url("/resources/graph/s_green.png") no-repeat center center; 
	border-bottom: 1px solid LightGrey; 
}
.seq_status_error{
	width: 75px;
	text-align: center;
	background: url("/resources/graph/s_red.png") no-repeat center center; 
	border-bottom: 1px solid LightGrey; 
}
.seq_status_empty{
	width: 75px;
	text-align: center;
	border-bottom: 1px solid LightGrey; 
}
.seq_status{
	width: 75px;
	text-align: center;
	border-bottom: 1px solid LightGrey; 
}

// Logs
table#log_table {
	border-collapse:collapse;
	border-spacing: 5px;
	padding:0px;
	width: 100%;
	font-family : Arial, Helvetica, sans-serif;
	color: grey; 
	font-size: .75em; 
	font-weight:bold;
	text-align: left;
	border-bottom: 2px solid #DADADA; 
}
.log_tr_title {
	font-weight:bold;
	font-size: .90em; 
	color: #A0A0A0; 
	height: 25px;
}
.log_tr {
	font-weight:normal;
	font-size: .90em; 
}
.log_tr_error {
	font-weight:normal;
	font-size: .90em; 
	color: red; 
}
.log_tr_warning {
	font-weight:normal;
	font-size: .90em; 
	color: darkorange; 
}
.log_td {
	font-weight:normal;
}
.log_td1 {
	width: 120px;
	padding-top: 5px;
	padding-bottom: 5px;
	border-bottom: 1px solid #DADADA; 
}
.log_td2 {
	width: 170px;
	border-bottom: 1px solid #DADADA; 
}
.log_td3 {
	width: 280px;
	border-bottom: 1px solid #DADADA; 
}
.log_td4 {
	padding-left: 25px;
	border-bottom: 1px solid #DADADA; 
}

#version {
	left: 101px;
    top: 45px;
    font-size: 11px;
    width: auto;
    height: 15px;
    display: block;
    position: absolute;
    color: #FFF;
}

#trial {
	position: absolute;
	z-index: 10;
	left: 126px;
	top: 37px;
	font-family: 'RobotoRegular';
	text-transform:lowercase;
	color:#F42561;
	font-size: 14px;
}


header #busy		{ display:none;}
header #shadowBg	{ background-color:#000; opacity:0.5; position:absolute; width:100%; height:100%; z-index:990}
header #alertMsg	{ position:absolute; width:500px; height:70px; left:50%; top:50%; margin-left:-250px; margin-top:-35px; text-align:center; z-index:992; font-family:Roboto; font-weight:300; font-size: 24px; color:#ffffff; text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.75);}




/* LOADING ANIMATION */
header #alertMsg .spinner { width: 50px; height: 40px; text-align: center; font-size: 10px; margin-left: 225px;}
header #alertMsg .spinner > div {  background-color: #E50071 !important; margin: 0 3px 0 0 !important; height: 100% !important; width: 6px !important; display: inline-block !important; -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out; animation: sk-stretchdelay 1.2s infinite ease-in-out; }
header #alertMsg .spinner .rect2 {  -webkit-animation-delay: -1.1s;  animation-delay: -1.1s;}
header #alertMsg .spinner .rect3 {  -webkit-animation-delay: -1.0s;  animation-delay: -1.0s;}
header #alertMsg .spinner .rect4 {  -webkit-animation-delay: -0.9s;  animation-delay: -0.9s;}
header #alertMsg .spinner .rect5 {  -webkit-animation-delay: -0.8s;  animation-delay: -0.8s;}
@-webkit-keyframes sk-stretchdelay {  0%, 40%, 100% { -webkit-transform: scaleY(0.4) }    20% { -webkit-transform: scaleY(1.0) }}
@keyframes sk-stretchdelay {  0%, 40%, 100% {     transform: scaleY(0.4);    -webkit-transform: scaleY(0.4);  }  20% {     transform: scaleY(1.0);    -webkit-transform: scaleY(1.0);  }}



#popinLogin #banner {
	display: none;
}

#popinLogin #boxLogin {
	margin-top: calc(50% - 50px);
}

#shadowPopinLogin {
	position: absolute;
	left: 0px;
	top:0px;
	width: 100%;
	height: 100%;
	z-index: 999;
	background-color: #000;
	opacity: 0.5;
}

#popinLogin {
	position: absolute;
	left: calc(50% - 200px);
	top: calc(50% - 300px);
	width: 400px;
	height: 600px;
	z-index: 999;
	background-color: #141414;
}