/* clear hack */
.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
 
.clearfix {
    display: inline-block;
}
 
html[xmlns] .clearfix {
    display: block;
}
 
* html .clearfix {
    height: 1%;
}

.clear{
    clear:both;
}

/*
    common tags
*/
body {
    margin-left: auto;
    margin-right: auto;
    font-family: Helvetica;
    width:1000px;
    min-height:768px;
    height:100%;
    position: relative;
    font-size: 12pt;
}

header,article,aside {
    -webkit-animation-duration:1s;
    -webkit-animation-name:fadein;
}

nav {
    position: fixed !important;
    top: 0px;
    left: 0px;
    width: 100%;
    background: black;
    min-width: 750px;
    z-index:99;
}

body header { height: 30px; }
body article header {
    height: 90px;
}

article {
    position: relative;
    min-height: 650px;
    padding: 50px 0 0 0;
    width: 1000px;
}

section {
	float: left;
	clear:both;
}

aside {
	width: 160px;
	position: absolute;
	right: 0;
	display: block;
	top: 185px;
	min-height: 100px;
    border-collapse: collapse;
	font-family: Helvetica;
	z-index:-1;
}

em {font-style: italic;}

@-webkit-keyframes fadein {
    from   { opacity:0; }
    to     { opacity:1; }
}

@-webkit-keyframes fadeinborder{
    from {
        border: 1px solid white;
        color: #888888;
    }
    to {        
      border: 1px solid #c0c0c0;
      color:black;
      }
}

@-webkit-keyframes fadeoutborder{
    from {
        border: 1px solid #c0c0c0;
        color:black;
    }
    to {
        border: 1px solid white;
        color: #888888;
      }
}

.button {
    background-color: #FFEC64;
    border: 1px solid #FFAA22;
    border-radius: 6px 6px 6px 6px;
    box-shadow: 0 1px 0 0 #FFF6AF inset;
    color: #333333;
    display: inline-block;
    font-family: Trebuchet MS;
    font-size: 15px;
    font-weight: bold;
    padding: 6px 24px;
    text-decoration: none;
    text-shadow: 1px 1px 0 #FFEE66;
}

/* 
    header
*/
#menu_lt {
    float: left;
    list-style: none;
    margin: 0;
    padding: 0;
    width: 150px;
}
#menu_lt li {
    background: black url("/http/nerd.eurecom.fr/ui/img/topbar/seperator.gif") bottom left no-repeat;
    float: left;
    font: 67.5% Helvetica;
    margin: 0;
    padding: 0;
}

#menu_lt a {
    background: black url("/http/nerd.eurecom.fr/ui/img/topbar/seperator.gif") bottom left no-repeat;
    color: black;
    display: block;
    float: left;
    margin: 0;
    padding: 8px 12px;
    text-decoration: none;
    font-weight: normal;
    height: 13px;
}

#menu_lt a:hover {
    background: yellow;
    padding-bottom: 8px;
}

#menu_lt #thunbnail a:hover {
    background: yellow url("/http/nerd.eurecom.fr/ui/img/topbar/nerd-logo_black-small.png") center no-repeat;
    color: black;
    padding-bottom: 8px;
}
#menu_lt #thunbnail a {
    background: black url("/http/nerd.eurecom.fr/ui/img/topbar/nerd-logo_white-small.png") center no-repeat;
    color: black;
    padding-bottom: 8px;
    width: 70px;
    height: 14px;
}

#menu_dx {
    float: right;
    list-style: none;
    margin: 0;
    padding: 0;
    width: 600px;
}
#menu_dx li {
    float: right;
    font: 67.5% Helvetica;
    margin: 0;
    padding: 0;
}
#menu_dx a {
    background: black url("/http/nerd.eurecom.fr/ui/img/topbar/seperator.gif") bottom left no-repeat;
    color: white;
    display: block;
    /*float: right;*/
    margin: 0;
    text-decoration: none;
    font-weight: normal;
    height: 30px;
    line-height: 30px;
    padding: 0 20px;
}

#menu_dx a:hover {
    background: yellow;
    color: black;
    /*padding-bottom: 8px;*/
}
ul#menu_dx li {
    float: right;
    position: relative
}
ul#menu_dx li li {
    float: none
}
ul#menu_dx ul {
    position: absolute;
    right: -9999px;
    margin-top: 7px;
}
ul#menu_dx li:hover ul#nobg {
    background: url("");
    right: 0;
    font: 135% Helvetica;
    list-style: none;
}
ul#menu_dx li.sep {
    height: 30px;
    background: #666
}
ul#menu_dx li.sep span {
    display: block;
    height: 1px;
    overflow: hidden;
    margin: 10px 5px 0;
    background: #CCC
}

ul#menu_dx li.nav_user { display: none; }
ul#menu_dx li.nav_arrow { display: none; }

ul#menu_dx li.nav_arrow { 
	padding-bottom: 7px;
	cursor: pointer;
 }

#menu_dx a.arrow {
	width: 0;
	height: 0;
	border-left: 7px solid transparent;
	border-right: 7px solid transparent;
	border-top: 14px solid white;
	margin: 10px 10px 0 10px;
	padding: 0;
}

ul#menu_dx li.nav_arrow:hover a.arrow {
    border-top-color: yellow;
    background: none;
}

/*
    article
*/
section#main { width: 100%; }
section#main > div {  padding: 10px 0 10px 0;}
 
section#main h1 {
    background: none repeat scroll 0 0 black;
    color: white;
    cursor: default;
    font-size: 100%;
    padding: 5px;
}

#open {	width: 1000px;	padding: 60px 0 0 0; 	border-top: 3px solid;	height: 500px;}
#openid_description {
    float: right;
    width: 220px;
    color: #444;
    padding: 0 8px 2px 8px;
    margin-bottom: 10px;
    color: #735005;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    text-align: left;
}

div#title {
    float: left;
    position: relative;
    width: 400px;
    top: 20px;
}

span#stitle {
    cursor: default;
    font-size: 200%;
    font-weight: bold;
}

#ssubtitle a {
    text-decoration: none;
}

div#usage {
    cursor: default;
    position: relative;
    float: right;
    width: 400px;
    text-align: right;
}
div#usage span {
    position: relative;
    top: -40px;
}
span#totalusage_field {
    left: 50px;
    position: relative;
}
div#usage img {
    width: 300px;
}
span#dailyusage_field {
    position: relative;
    right: 45px;
}

/* /publication */
.pub-list { counter-reset: pub }
.pub-item:before {
    content: "["counter(pub) "] - ";
    counter-increment: pub;
}

/* /user/xxx */
div#activitystream { border:1px solid; }

div#activitystream .activity {
    padding: 15px;
    text-align: justify;
}

div#activitystream .activity:nth-child(2n+1) { background: #EAEAEA; }

/* /profile/xxx */
div#profile div {vertical-align:middle;}
div#profile div span {height: 17px;}
div#profile div span.key {
	display: inline-block;
	width: 200px;
	padding: 5px 0 5px 0;
	text-align: right;
}
div#profile div span.value {
	display: inline-block;
	max-width: 450px;
	border: 1px solid white;
    color: #888888;
}
div#profile div span.edit {
    cursor: text;
    display: inline-block;
    border: 1px solid #C0C0C0;
    color: black;
    width:500px;
    -webkit-animation-duration:0.5s;
    -webkit-animation-name:fadeinborder;
}
div#profile div span.incomplete {
    border: 1px solid red;
    display: inline-block;
    height: 16px;
    width:500px;
    -webkit-animation-duration:0.5s;
    -webkit-animation-name:fadeinborder;
}
@-webkit-keyframes fadeinborder{
    from {
        border: 1px solid white;
        color: #888888;
    }
    to {        
      border: 1px solid #c0c0c0;
      color:black;
      }
}

div#profile div span.noedit {
    -webkit-animation-duration:0.5s;
    -webkit-animation-name:fadeoutborder;
}
@-webkit-keyframes fadeoutborder{
    from {
        border: 1px solid #c0c0c0;
        color:black;
    }
    to {
        border: 1px solid white;
        color: #888888;
      }
}
div#profile a {
    width: 60px;
    height: 17px;
    background-repeat: no-repeat;
    background-position: center center;
    text-indent: -900em;
    color: #333;
    text-decoration: none;
    line-height: 100%;
    white-space: nowrap;
    display: inline-block;
    position: relative;
    vertical-align: middle;
    margin: 0 2px 5px 0;
    background-color: #ECECEC;
    border: solid 1px #B8B8B9;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5), inset 0 -2px 0 rgba(0, 0, 0, .25), inset 0 -3px 0 rgba(255, 255, 255, .2), 0 1px 0 rgba(0, 0, 0, .1);
    -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.5), inset 0 -2px 0 rgba(0,0,0,.25), inset 0 -3px 0 rgba(255,255,255,.2), 0 1px 0 rgba(0,0,0,.1);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5), inset 0 -2px 0 rgba(0, 0, 0, .25), inset 0 -3px 0 rgba(255, 255, 255, .2), 0 1px 0 rgba(0, 0, 0, .1);
}
div#profile a:hover {
    background-color: #ccc;
    border: solid 1px #999; 
}

div#buttons {text-align:center; padding: 10px 0 0  0;}

div span#s-key {display:none;}
div a#b-key {display:none; border-radius: 5px; padding: 2px;}
div#profile div#nickname img { display: none; vertical-align:middle; }

div#externalapi {text-align: center;}
div#externalapi span {
	width:450px;
	text-align: left;
	border: 1px solid silver;
	display: inline-block;
	height: 17px;
	padding-left: 5px;
}
div#externalapi input {
    width:450px;
    text-align: left;
    border: 1px solid silver;
    display: inline-block;
    height: 17px;
    padding-left: 5px;
}
div#externalapi img { vertical-align:middle; }
div#externalapi img { vertical-align:middle; }

/* /document/xxx */
div#extractor { display :none;}
div#extractor ul { padding: 10px 0 10px 0; }
div#extractor ul li { display: inline; }
div#extractor ul li a {
    text-indent: 0;
    width: auto;
    height: 40px;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    width: 92px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 1px 17px;
    color: #333;
    text-decoration: none;
    line-height: 100%;
    white-space: nowrap;
    display: inline-block;
    position: relative;
    vertical-align: middle;
    margin: 0 1px 10px 0;
    background-color: #D6D3D3;
    border: solid 1px #B8B8B9;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5), inset 0 -2px 0 rgba(0, 0, 0, .25), inset 0 -3px 0 rgba(255, 255, 255, .2), 0 1px 0 rgba(0, 0, 0, .1);
    -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.5), inset 0 -2px 0 rgba(0,0,0,.25), inset 0 -3px 0 rgba(255,255,255,.2), 0 1px 0 rgba(0,0,0,.1);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5), inset 0 -2px 0 rgba(0, 0, 0, .25), inset 0 -3px 0 rgba(255, 255, 255, .2), 0 1px 0 rgba(0, 0, 0, .1);
}

div#extractor ul li a:hover {
    background-color: #ccc;
    border: solid 1px #999; 
}
ul li a#alchemyapi{ background-image: url(/http/nerd.eurecom.fr/ui/img/alchemyapi/b.png); }
ul li a#dandelionapi { background-image: url(/http/nerd.eurecom.fr/ui/img/dandelionapi/b.png); }
ul li a#dbspotlight {background-image: url(/http/nerd.eurecom.fr/ui/img/dbspotlight/b.png); }
ul li a#evri { background-image: url(/http/nerd.eurecom.fr/ui/img/evri/b.png);}
ul li a#extractiv { background-image: url(/http/nerd.eurecom.fr/ui/img/extractiv/b.png); }
ul li a#lupedia { background-image: url(/http/nerd.eurecom.fr/ui/img/lupedia/b.png); }
ul li a#opencalais { background-image: url(/http/nerd.eurecom.fr/ui/img/opencalais/b.png); }
ul li a#saplo { background-image: url(/http/nerd.eurecom.fr/ui/img/saplo/b.png); }
ul li a#semitags { background-image: url(/http/nerd.eurecom.fr/ui/img/semitags/b.png); }
ul li a#textrazor {background-image: url(/http/nerd.eurecom.fr/ui/img/textrazor/b.png); }
ul li a#wikimeta { background-image: url(/http/nerd.eurecom.fr/ui/img/wikimeta/b.png); }
ul li a#yahoo { background-image: url(/http/nerd.eurecom.fr/ui/img/yahoo/b.png); }
ul li a#zemanta { background-image: url(/http/nerd.eurecom.fr/ui/img/zemanta/b.png); }
ul li a#thd { background-image: url(/http/nerd.eurecom.fr/ui/img/thd/b.png); }
ul li a#combined { background-image: url(/http/nerd.eurecom.fr/ui/img/nerd-logo-b.png); }
ul li a#nerdml { background-image: url(/http/nerd.eurecom.fr/ui/img/nerdml/b.png); }

div#content div { padding: 10px 0 10px 0; }

/* /analysis */
div#analysis { padding: 40px 0 0 40px; }
div#analysis a {
    width: auto;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    color: #333;
    text-decoration: none;
    background-color: #ECECEC;
    border: solid 1px #B8B8B9;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5), inset 0 -2px 0 rgba(0, 0, 0, .25), inset 0 -3px 0 rgba(255, 255, 255, .2), 0 1px 0 rgba(0, 0, 0, .1);
    -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.5), inset 0 -2px 0 rgba(0,0,0,.25), inset 0 -3px 0 rgba(255,255,255,.2), 0 1px 0 rgba(0,0,0,.1);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5), inset 0 -2px 0 rgba(0, 0, 0, .25), inset 0 -3px 0 rgba(255, 255, 255, .2), 0 1px 0 rgba(0, 0, 0, .1);
}

div#analysis a:hover {
    background-color: #ccc;
    border: solid 1px #999; 
}

#rawtext{ margin-top:40px; }

#uriinputbox {
    display: block;
    margin-bottom: 10px;
    width: 700px;
}

#rawtext textarea {
    display: block;
    margin-bottom: 10px;
    width: 700px;
    height: 250px;
}

/* /annotation/xxx */
p#document {
	padding: 60px;
	padding-right: 80px;
	background: #EAEAEA; 
	line-height: 1.9em;
}

p#document a {
    text-decoration: none;
    padding: 5px;
    border-radius: 5px;
    -moz-border-radius:5px; /* Firefox 3.6 and earlier */
}
    
.nerd {
	background-color: white;
    opacity: 0.8;
    color: black;
}

.nerd-thing{
	background-color:red;
	opacity: 0.8;
	color: white;
	
}
.nerd-amount {
    background-color: purple;
    opacity: 0.8;
    color: white;
}
.nerd-animal {
    background-color: #61210B;
    opacity: 0.8;
    color: white;
}
.nerd-event {
    background-color: lightCoral;
    opacity: 0.8;
    color:white;
}
.nerd-function {
    background-color: powderBlue;
    opacity: 0.8;
    color: black;
}
.nerd-location {
    background-color: green;
    opacity: 0.8;
    color: white;
}
.nerd-person {
    background-color: orange;
    opacity: 0.8;
    color: white;
}
.nerd-organization {
    background-color: yellow;
    opacity: 0.8;
    color: black;
}
.nerd-product {
	background-color: darkSlateGray;
	opacity: 0.8;
	color: white;
}
.nerd-time {
	background-color: blue;
	opacity: 0.8;
	color: white;
}

/* /statistics/xxx */
div#statistics { text-align: center; }
input#start, input#end {
    width:120px;
    font-size: 12pt;
}

div#summaryextraction div {margin-top: 2    0px; text-align:center;}

/* /stream/xxx */
#streamlist {
    width: 800px;
    text-align: center;
    border: 1px solid black;
}
#streamlist thead{ 
    background: none repeat scroll 0 0 #FFC800; 
	font-size: 17px;
	font-style: italic;
}
#streamlist tbody tr:nth-child(2n+1) { background: #EAEAEA; }

#streamlist tbody td {
	padding: 5px;
}
/* /team */
div.maintainer {
	width: 100%;
	padding: 20px;
}
div.maintainer img{ float: left;}

ul.details {
	width: 500px;
    display: inline-block;
    padding: 0 0 0 20px;
    line-height: 50px;
}
ul.details li a{ color: black; text-decoration: none;}
ul.details li a:hover{ color: rgb(90,90,90);}
ul.details li.name {font-size: 24px;}
ul.details li.email {
	background-image: url('/http/nerd.eurecom.fr/ui/img/email.png');
	background-repeat: no-repeat;
    padding-left: 50px;
}
ul.details li.twitter {
    background-image: url('/http/nerd.eurecom.fr/ui/img/twitter.png');
    background-repeat: no-repeat;
    padding-left: 50px;
}
div#collaborators ul { 
	margin-left: 20px;
    padding: 10px;
    list-style: disc;
    line-height: 25px;
}
div#collaborators ul li a {text-decoration: none; color: black;}
div#collaborators ul li a:hover {color: rgb(90,90,90);}


/* /changelog */
div ul.changelog{
	margin-left: 20px;
	padding: 10px;
	list-style: disc;
	line-height: 25px;
}

/* /publication */
div.pub-list a:hover {color: rgb(80,80,80);}
div.pub-list div.pub-item {margin: 10px 0 0 0; line-height: 1.4em;}


/* /documentation */
.item{
	margin: 20px 0 0 0;
}
div.abstract p {
	line-height:1.3em;
	padding: 20px 40px;
	background: #EAEAEA;
}

ol.list { 
    margin-left: 40px;
    list-style: upper-roman;
    line-height: 20px;
}

ul.list { 
	margin-left: 40px;
    list-style: square; 
    line-height: 20px;
}
ul.list li a {text-decoration: none; color: black;}
ul.list li a:hover {color: #5A5A5A;}
ul.list li ul {
    margin-left: 40px;
    list-style:disc;
}

div.description { padding : 20px;}
div.description h2 { font-size:20px; }
div.description div {padding: 20px;}
div.description div h3 { font-size: 18px; padding-bottom: 10px;}


.first {border-top: 1px solid #EEE;}
.parameter {
	border-bottom: 1px solid #EEE;
	line-height: 1.5em;
	font-size: 15px;
}
.param {
	display: block;
	float: left;
	width: 220px;
	color: #333;
	font-weight: bold;
}
.parameter .param span {
	display: block;
	color: #999;
	font-weight: normal;
}
.parameter p {
margin-left: 220px;
}

table#example { width: 100% }
table td.key {width: 15%;}
table td.value {width: 85%;}

/* 
    /ontology
*/
section#main.ontology  {
	text-align:justify;
	line-height:1.3;
	margin-top:10px;
}
section#main.ontology > div {padding:0px;}
section.ontology dl {padding: 20px 0;}
section.ontology dl dt {font-weight: bold;}
section.ontology dl dd {display: block; margin: 0 0 0 40px;}
section.ontology .copyright{padding:0 0 20px 0; font-size:14px;}
section.ontology h2 { font: 140% sans-serif; margin: 0.83em 0;}
section.ontology h3{font: 120% sans-serif; padding:10px 0; display:block;}
section.ontology ul {
	display: block;
    list-style-type: circle;
    margin: 20px 40px;
}
section.ontology div.ontology-core {
	background-color: #DDF;
	border: 1px solid black;
	float: left;
}

section.ontology div.ontology-core h3 {
	background-color: #BBF;
	font-size: 100%;
	margin: 0;
	padding: 5px;
}

section#main.ontology div.specterm {
	border: 1px solid black;
	background: #F0F0F0;
	padding: 20px 40px;
	margin-top: 10px;
}


/*
    /terms
*/
section#main.terms {text-align:justify;}

section#main.terms ol {
    list-style: none;
    counter-reset: item;
}
section#main.terms ol li {
    display: block;
    margin: .5em 0;
    padding-left: 2em;
    font: 1.2em sans-serif;
}

section#main.terms ol li ol li {
	font: 16px sans-serif;
	margin: 0 0 0.2em 0;
}

section#main.terms ol li h3, section#main.terms ol li p
{
    font: 0.9em sans-serif;
}

section#main.terms ol li p {
	padding: 0.1em;
}

section#main.terms ol li:before {
    display: inline-block; 
    margin-left: -2em;
    margin-right: .5em;
    text-align: center;
    content: counters(item, ".") ".";
    counter-increment: item;
}
section#main.terms ol ol {/*resets from parent OL*/
    width: auto;
    margin: 0;
    padding: .5em 0;
}
section#main.terms ol li li:before {/*remove the trailing period*/
    content: counters(item, ".") " ";
}

/*
    aside
*/
aside div {border: 1px solid black;}
aside div {display: none;}  
aside div:first-child {margin: 0 0 10px 0;}
aside h1 {
    background: none repeat scroll 0 0 black;
    color: white;
    cursor: default;
    padding: 5px;
    text-align: center;
}

aside ul#menu li {padding: 7px;}
aside ul#menu li a{
    color: black;
    text-decoration: none;
    width: 100%;
    display: inline-block;
}
aside ul#menu li:hover{
    //color: rgb(90,90,90);
    background-color: yellow;
}

aside div#legend ul#mainclass li {margin: 10px 0 15px 10px;}
aside div#legend ul#mainclass li a {text-decoration:none; padding: 5px; border-radius: 5px; -moz-border-radius: 5px;}
/* 
    side section content 
*/
#spinner {
    display: none;
    z-index: 4;
    width: 467px;
    height: 40px;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -20px;
    margin-left: -233px;
}

#spinner-overlay {
    display:none;
    position:fixed;
    _position:absolute; /* hack for internet explorer 6*/
    height:100%;
    width:100%;
    top:0;
    left:0;
    background:#000000;
    border:1px solid #cecece;
    z-index:3;
}

/*
    footer
*/
footer{
    width: 1000px;
    height:60px;
    font-size: 0.75em;
    margin: 40px 0 0 0;
    padding-top: 15px;
    clear: both;
    border-top: 1px solid;
    position:relative;
    bottom: 0 !important;
}

footer a.left {
	float: left;
	text-decoration: none;
	color: black;
}

footer span.right {
    float: right;
    color: gray;
}