/* CCS for Eurolimpacs page */
/* (C) Copyright Gavin Simpson */
/* 2003-2004 All Rights Reserved */

/*
    general styles
    do not alter these styles    
*/
body {
    font-family: "Muli", sans-serif;
    margin: 0.5em;
    color: #000;
	background: #ffffff;
    /*background: #eeeeee;*/
    font-size:100%;
}
p {
    font-family: "Muli", sans-serif;
    font-size: 100%;
    color: #000;
    background: transparent;
    text-align: justify;
    clear: none;
}
.italic {
    font-style: italic;
}
.bold {
    font-weight: bold;
}
.center {
    text-align: center;
}

.small {
	font-size: 75%;
	text-align: center;
}

.big {
	font-size: 115%;
	}

ul {
    font-family: "Muli", sans-serif;
    color: #000;
    background: transparent;
}

ul li{
    font-size: 100%;
    margin: 0em 2.5em 0.0em 0em;
}






/* heading styles */
h1 {
	font-family: "Muli", sans-serif;
	font-weight: bold;
	font-size: 175%;
	color: #512d76;
	background: transparent;
	border-bottom: solid 1px #aaa;
	margin: 0em 0em 0.5em 0em;
	
}

h2 {
	font-family: "Muli", sans-serif;
	font-weight: bold;
	font-size: 120%;
	color: #512d76;
	background: transparent;
	border-bottom: solid 1px #aaa;
	margin: 2em 0em 1.5em 0em;
}
h3 {
    font-family: "Muli", sans-serif;
    font-weight: bold;
    padding: 0px 0px 1px 0px;
    font-size: 110%;
    color: #512d76;
    background: transparent;
    margin: 0em 0em -0.5em 0em;
}
h4 {
	font-family: "Muli", sans-serif;
	font-weight: normal;
	padding: 0px 0px 1px 0px;
	color: #512d76;
	font-size: 110%;
	background: transparent;
	margin-bottom: 0em ;
	margin-top: 1em;
	border-bottom: 1px solid #aaa;
}




/* general links */
a:link, a:visited, a:active {
	text-decoration: none;
	color: #656565;
	/*color: #330366;
	*/
}
a:hover {
    text-decoration: underline;
    color: #656565;
    /*color: #330366;*/
}
/* header strip styles */
/* The negative margins are required for IE to sort the alignment
    of the images with the background png, so do not change */
#logoleft {
    float: left;
    margin-left: -3px;
    padding: 0px;
}
#logoright {
    float: right;
    margin-right: -3px;
    padding: 0px;
}
#header {
    margin: 5px;
    padding: 0px;
    height: 85px;
}

#header_titel {
    margin: 5px;
    padding: 0px;
    height: 115px;
}

#box {
    border: 0px solid #1853a2;
    padding: 0.0ex 3px 0ex 3px;
    min-height: 5em;
    min-width: 600px;
    vertical-align: middle;
    margin: 0em 0em 0.2em 0em;
    background: white;
}
#boxheader {
    font-family: "Muli", sans-serif;
    font-weight: normal;
    font-size: 100%;
    color: #330366;
    background: #fff;
    margin: 0.3em 0em 0.2em 0em;
    clear: both;
    text-align: center;
    letter-spacing: 0px;
}
#printheader {
    display: none;
}
#printheader h1 {
    display: none;
}
#printheader span {
    display: none;
}
/* stuff for the main text area */

/* style for the main text area */
#pagebody {
    border: 1px solid #1853a2;
    font-size: 90%;
    background: #fff url("http://www.eurolimpacs.ucl.ac.uk/images/lightbluegrad2.png") repeat-y right;
    padding: 1%;
}
#sidebar {
	font-size: 90%;
	margin-right: 83%;
	/*margin-right: 85%;
	*/
	/*border: 1px dashed blue;
	*/
	padding-top : 0.2em;
}
#main {
	border: 1px solid #aaa;
	font-size: 90%;
	/*background: #fff url("http://www.eurolimpacs.ucl.ac.uk/images/lightbluegrad2.png") repeat-y right;
	*/
	padding: 1%;
	float: right;
	width: 80%;
	/*width: 82%;
	*/
	margin-bottom: 0.5em;
	/*border: 1px solid #900;
	*/
}
/* images in box on right */
.rightsideimage {
	/*border: 1px solid #990000;*/
	padding: 2px;
	margin: 0em 0em 0.75em 2.5em;
	float: right;
	clear: right;
	text-align: center;
}

#rightside {
	float: right;
	width : 48%;
	padding-left : 1em;
	text-align : center;
	
}

#leftside {
	margin: 0 50% 0 0;
	padding-right : 1em;
	text-align : center;
}




/* red background box out on right */
#boxoutleft {
    border: 1px solid #990000;
    margin: 0.3em 0em 0.5em 0em;
    background: #fff url("http://www.eurolimpacs.ucl.ac.uk/images/redhorizontalgrad2.png") repeat-y right;
    padding: 0.5em;
    /*width: 200px;*/
}
#boxoutleft p {
    font-family: "Muli", sans-serif;
    font-size: 90%;
    text-align: left;
}
div.boxouttitle{
    font-family: "Muli", sans-serif;
    font-size: 110%;
    text-align: left;
    font-weight: bold;
    border: none;
    color: #900;
    margin: 0em 0em 0em 0em;
}
#boxoutleft ul {
    font-family: "Muli", sans-serif;
    color: #000;
    background: transparent;
    margin-bottom: 1em;
}
#boxoutleft ul li{
    font-family: "Muli", sans-serif;
    font-size: 90%;
    text-align: left;
    margin-left: -1.5em;
}
#boxoutleft a:link {
    font-size: 90%;
    text-decoration: none;
    color: #330366;
}
#boxoutleft a:visited {
    font-size: 90%;
    text-decoration: none;
    color: #330366;
}
#boxoutleft a:active {
    font-size: 90%;
    text-decoration: none;
    color: #330366;
}
#boxoutleft a:hover {
    font-size: 90%;
    text-decoration: underline;
    color: #330366;
}
#boxoutleft span.forummenutext {
    font-size: 75%;
    color: #330366;
}
div.forumlinks {
    margin: 0.5em 0em 0.5em 0em;
}

/* page footer style */
#footer {
    font-family: "Muli", sans-serif;
    font-size: 70%;
    color: #900;
    background: #eee;
    margin: 1em 0em 0em 0em;
    text-align: center;
    font-weight: bold;
    clear: both;
	padding: 2px;
	border: 1px solid #aaaaaa;
}
#footer a:link, #footer a:visited, #footer a:active {
    text-decoration: none;
    color: #900;
}
#footer a:hover {
    text-decoration: underline;
    color: #900;
}
/* search style */
#searchtop {
    width: 20em;
    font-size: 80%;
}
/* news styles */
.news {
    border: 1px solid #aaa;
    background: #eee;
    margin: 0em 0em 0.5em 0em;
    padding: 0.5em;
    font-size: 90%;
    /*width: 200px;*/
}
#newsboxtitle {
	font-family: "Muli", sans-serif;
	font-weight: bold;
	font-size: 100%;
	color: #512d76;
	background: transparent;
	margin: 0em 0em 0em 0em;
	border-bottom: solid 1px #aaa;
}

.news h3 {
	text-align: center;
	font-weight: bold;
	color: #656565;
	font-size: 100%;
	border-bottom: 0px solid #1853a2;
}

.news h4 {
	font-weight: bold;
	font-size: 100%;
}

.news p  {
	text-align : center;
}



.news img {
	border: 1px solid #aaa;
}

.fip {
    border: 1px solid #aaa;
    background: #eee;
    margin: 0em 0em 0.5em 0em;
    padding: 0.5em;
    font-size: 90%;
    /*width: 200px;*/
}

.responsive-image{
    height:auto;
    width:100%;
}




.news dl {
    font-family: "Muli", sans-serif;
    font-size: 1.3em;
    color: #900;
    font-weight: normal;
    margin: 0em 0.1em 0.1em 0.1em;
    padding: 0.1em 0em 0.1em 0em;
}
.news dt {    
    font-family: "Muli", sans-serif;
    font-size: 75%;
    font-weight: bold;
    color: #1853a2;
    margin: 0em 0em 0em 0em;
    padding: 0.3em 0em 0.2em 0em;
}
.news dd {
    font-family: "Muli", sans-serif;
    font-weight: normal;
    font-size: 65%;
    color: #000;
    margin: 0em 0em 0em 1em;
    padding: 0.1em 0em 0.2em 0em;
}
/* for news in the editor */
.newsedit dt {
    font-family: "Muli", sans-serif;
    font-weight: normal;
    /*padding: 0px 0px 0px 0px;*/
    font-size: 110%;
    color: #990000;
    background: transparent;
    margin: 0em 0em 0em 0.5em;
}
.newsedit dd {
    font-family: "Muli", sans-serif;
    font-weight: normal;
    /*padding: 0px 0px 0px 0px;*/
    font-size: 100%;
    color: #000;
    background: transparent;
    margin: 0em 0em 0.3em 2.5em;
}
.newsedit dd.summary {
    font-size: 85%;
    margin-left: 2.9em;
}
.newsedit dd.newsoptions{
    margin: 0.3em 0em 0.5em 0.5em;
    font-size: 85%;
}
span.newsdate {
    font-size: 70%;
    color: #000;
    background: transparent;
}
dl.newsedit hr {
    color: #1853a2;
}
.newsedit pre {
    font-size: 95%;
    font-family: "Muli", sans-serif;
    color: #000;
    background: transparent;
}
/* Form styles */
form {
    font-family: "Muli", sans-serif;
    font-size: 100%;
}
form label {
    /*font-size: 90%;*/
    /*color: #900;*/
    background: transparent;
}
form.main {
    margin: 0.75em 0em 0.75em 0em;
}
form.main label {
    color: #900;
    background: transparent;
    font-size: 100%;
    margin: 0em 0em 0em 0em;
}
form.main input {
    font-size: 100%;
    margin: 0em 1em 0em 0em;
}
table.form {
    border-collapse: collapse;
    border-spacing: 0;
    border: none;
}
table.form td {
    padding: 2px 2px 2px 2px;
    vertical-align: top;
}
td.formright {
    text-align: right;
}


/* menu styles */
.menu {
    font-family: "Muli", sans-serif;
    border: 1px solid #aaa;
    margin: 0.5em 0em 0.5em 0em;
    font-size: 90%;
    font-weight: bold;
    color: #656565;
    padding: 0.3em;
    background: #eee;
    text-align: center;
}
.menu a:link {
    text-decoration: none;
    color: #900;
}
.menu a:visited {
    text-decoration: none;
    color: #900;
}
.menu a:active {
    text-decoration: none;
    color: #900;
}
.menu a:hover {
    text-decoration: underline;
    color: #900;
}
.menu label {
    font-size: 100%;
    font-weight: bold;
    color: #900;
}
#loggedin {
    /*float: right;*/
    text-align: center;
    padding: 2px 5px 2px 5px;
    margin: 0em 0em 0.5em 0em;
    border: 1px solid #aaaaaa;
    color: #1853a2;
    background: #eee;
    font-size: 85%;
}
#loggedin a:link, #loggedin a:visited, #loggedin a:active {
    text-decoration: none;
    color: #006600;
}
#loggedin a:hover {
    text-decoration: underline;
    color: #006600;
}
/* page summary layouts
for use on portal pages
*/
#summaryholder {
    width: 620px;
    margin-right: auto;
    margin-left: auto;
    padding: 5px;
}
.summarybox {
    width: 300px;
    height: 199px;
    background: #900 no-repeat;
    margin-bottom: 5px;
}
.summarytext {
    padding: 5px;
    width: 110px;
    font-family: "Muli", sans-serif;
    font-size: 80%;
    color: #fff;
    font-weight: normal;
}
.summarytitle {
    font-size: 1.1em;
    font-weight: bold;
}
.summarytext p {
    color: #fff;
    text-align: left;
}
.summarytext a:link {
    color: #fff;
    text-decoration: underline;
}
.summarytext a:link:after {
    content: "";
}
.summarytext a:visited {
    color: #fff;
    text-decoration: underline;
}
.summarytext a:active {
    color: white;
    text-decoration: underline;
}
.summarytext a:hover {
    color: #fff;
    text-decoration: none;
}
.summarytext a:hover:after {
    content: "\00BB";
}
/* admin tables */
table.admin {
    border-collapse: collapse;
}
table.admin th {
	background: #ddd;
	color: Black;
	font-weight: bold;
	font-size: 100%;
	border: 2px solid white;
	padding: 3px;
}
table.admin td {
    color: black;
    font-size: 100%;
    border: 2px solid white;
    padding: 3px;
}
/* data tables */
table.data {
    border-spacing: 0;
    /*width: 100%;*/
    font-size: 100%;
    font-family: "Muli", sans-serif;
    border-collapse: collapse;
    margin-bottom: 1.0em;
	margin-top: 0.5em;
}
table.data thead tr th {
    font-size: 100%;
    font-weight: normal;
    color: #900;
    text-align: left;
    padding: 5px;
    vertical-align: top;
}
table.data thead tr th.biblio {
    font-size: 85%;
    font-weight: normal;
    color: #1853a2;
    background-color: #eee;
    text-align: left;
    padding: 2px;
    text-transform: capitalize;
    vertical-align: top;
}
table.data tbody.biblio tr td {
    font-size: 85%;
    padding: 5px;
    vertical-align: top;
    background-color: #ffffff;
    /*border: 1px solid #006600;*/
}
/*table.data tbody.biblio tr {
    border: 1px solid #cccccc;
}*/
table.data tbody.biblio {
    border: 1px solid #cccccc;
}
table.data tbody.biblio tr td.odd {
    background-color: #ffffff;
    color: #000000;
    /*border: 1px solid red;*/
}
table.data tbody.biblio tr td.even{
    background-color: #eeeeee;
    color: #000000;
    /*border: 1px solid red;*/
}
table.data caption {
    font-size: 150%;
    color: #060;
    margin-bottom: 0.25em;
    text-align: left;
}
table.data caption#small {
    font-size: 100%;
    color: #900;
    margin-bottom: 0.25em;
    text-align: left;
}
table.data td {
    padding: 5px;
    vertical-align: top;
    /*border: 1px solid #006600;*/
}
table.data td.title {
    font-weight: bold;
    padding: 5px 5px 5px 5px;
    text-align: right;
    vertical-align: top;
}
table.data thead tr {
    border: 1px solid #ccc;
}
table.data tfoot tr td {
    font-size: 75%;
    padding: 2px;
    vertical-align: top;
    border: 1px solid #cccccc;
    color: #1853a2;
    background-color: #eeeeee;
}
table.data td pre {
    font-size: 100%;
    font-family: "Muli", sans-serif;
    color: #000;
    background: transparent;
}
table.data tr td.small {
    font-size: 75%;
    font-family: "Muli", sans-serif;
    color: #444;
    background: transparent;
    font-style: italic;
}
/*testing*/
/* new style to split the main page into two sections*/
div.smallpageleft {
    width: 75%;
}
/* this floats a small section to the right, which contains images or text for example */
div.smallpageright {
    float: right;
    padding:1.2em 1.2em 1.2em 1.2em;
    margin:0.3em 0.3em 0.3em 0.3em;
	border: 1px solid #aaa;
    background: #eee;
}
/* for images in the right, wrap the <img> in this div, which just centers the thing
 and adds some space between elements. Wrap the whole thing in the smallpageright style above
 and the whole thing is floated right, pictures centered in this column and text should be
 left aligned if not included in the picture right div, or centered otherwise*/
div.pictureright {
    text-align: center;
    margin-bottom: 0.5em;
	border: 1px solid #656565;
   
}
/* style for adding green and bold text to pages */
.greybold {
    font-weight: bold;
    color: #656565;
}

.greenbold {
    font-weight: bold;
    color: #006600;
}
.redbold {
    font-weight: bold;
    color: #990000;
}
.bluebold {
    font-weight: bold;
    color: #512d76;
}

.mzb {
	color : #ec9a2f;
	font-weight: bold;
}

.fi {
	color: #1d549e;
	font-weight: bold;
}

.di {
	color: #cccc33;
	font-weight: bold;
}

.mp {
	color: #659a1f;
	font-weight: bold;
}

.pp {
	color: #9f6f2f;
	font-weight: bold;
}


/*  Styles for the announcements-like sections
    These have generic names and should be used
    as:
    1)  <div class='standalonebar'>
            <span class='titlebar'>For larger text headers</span> or...<br />
            <span class='footerbar'>For smaller text headers</span>
        </div>
    or
    2)  <div class='titlebar'>
            <span class='titlebar'>text</span>
        </div>
        <div class='bodyouterbar'>
            <div class='bodyinnerbar'>
                text for body element
            </div>
        </div>
        <div class='footerbar>
            <span class='footerbar'>footer text</span>
        </div>
    the spans are needed to alter font sizes etc, otherwise the outer containing
    <div> tags would not all line up nicely.
    If something specific is needed, such as different margins, add a style='' argument
    in the html to overide these definitions.
    If it is something being used a lot, then we should add the style to the css
*/
div.standalonebar {
    width:100%;
    background-color: #eee;
    border: 1px solid #ccc;
    margin: 0em 0em 0em 0em;
    padding: 2px 4px 2px 4px;
}
div.nowidthstandalonebar {
    background-color: #eee;
    border: 1px solid #ccc;
    margin: 0em 0em 0em 0em;
    padding: 2px 4px 2px 4px;
}
div.titlebar {
    width:100%;
    background-color: #eee;
    border: 1px solid #ccc;
    margin: 2em 0em 0em 0em;
    padding: 2px 4px 2px 4px;
}
span.titlebar {
    font-weight: normal;
    color: #1853a2;
    font-size: 95%;
    background-color: #eee;
}
div.bodyouterbar {
    width:100%;
    background-color: #fff;
    border: 1px solid #ccc;
    margin: 0em 0em 0em 0em;
    padding: 5px 4px 5px 4px;
}
div.bodyinnerbar {
    width:95%;
    font-weight: normal;
    color: #000;
    font-size: 85%;
    background-color: #fff;
}
div.altbodyouterbar {
    width:100%;
    background-color: #eee;
    border: 1px solid #ccc;
    margin: 0em 0em 0em 0em;
    padding: 5px 4px 5px 4px;
}
div.altbodyinnerbar {
    width:95%;
    font-weight: normal;
    color: #000;
    font-size: 85%;
    background-color: #eee;
}
div.footerbar {
    width:100%;
    background-color: #eee;
    border: 1px solid #ccc;
    margin: 0em 0em 0.5em 0em;
    padding: 2px 4px 2px 4px;
}
span.footerbar {
    font-weight: normal;
    color: #1853a2;
    font-size: 80%;
    background-color: #eee;
}

/* Diary styles */
table.diary_month {
    border: 1px solid #cccccc;
    font-size: 90%;
    border-spacing: 0;
    border-collapse: collapse;
    margin-top: 0.5em;
}
thead.daysofweek {
    text-align: center;
    border: 1px solid #cccccc;
    color: #1853a2;
    background: #eeeeee;
}
thead.daysofweek th {
    padding: 0.4em;
}
tfoot.diary_month {
    text-align: center;
    border: 1px solid #cccccc;
    color: #1853a2;
    background: #eeeeee;
}
tfoot.diary_month td {
    padding: 0.4em;
}
table.diary_month tbody {
    text-align: right;
    border: 1px solid #cccccc;
    color: #000000;
    background: #ffffff;
}
table.diary_month tbody td {
    padding: 0.4em;
}
table.diary_month a:link, table.diary_month a:visited, table.diary_month a:active {
    text-decoration: none;
    color: #990000;
    font-weight: normal;
}
table.diary_month a:hover {
    text-decoration: underline;
    color: #990000;
    font-weight: normal;
}
table.diary_month caption {
    color: #990000;
    background: transparent;
    font-weight: bold;
    font-size: 110%;
}
/* diary event list */
table.diary_eventlist {
    border: 1px solid #cccccc;
    font-size: 90%;
    border-spacing: 0;
    border-collapse: collapse;
    margin-top: 0.5em;
}
table.diary_eventlist thead {
    text-align: center;
    border: 1px solid #cccccc;
    color: #1853a2;
    background: #eeeeee;
}
table.diary_eventlist thead th {
    padding: 0.4em;
}
table.diary_eventlist tfoot {
    text-align: center;
    border: 1px solid #cccccc;
    color: #1853a2;
    background: #eeeeee;
    font-size: 80%;
}
table.diary_eventlist tfoot td {
    padding: 0.2em;
    text-align: left;
}
table.diary_eventlist tbody {
    text-align: left;
    border: 1px solid #cccccc;
    color: #000000;
    background: #ffffff;
}
table.diary_eventlist tbody td {
    padding: 0.4em;
    vertical-align: top;
}
table.diary_eventlist a:link, table.diary_eventlist a:visited, table.diary_eventlist a:active {
    text-decoration: none;
    color: #990000;
    font-weight: normal;
}
table.diary_eventlist a:hover {
    text-decoration: underline;
    color: #990000;
    font-weight: normal;
}
table.diary_eventlist caption {
    color: #990000;
    background: transparent;
    font-weight: normal;
    font-size: 175%;
    margin-bottom: 0.5em;
    margin-top: 0.75em;
    text-align: left;
}
/* new side menu styles*/
/*
#boxoutleft {
    border: 1px solid #990000;
    margin: 0.3em 0em 0.5em 0em;
    background: #fff url("http://www.eurolimpacs.ucl.ac.uk/images/redhorizontalgrad2.png") repeat-y right;
    padding: 0.5em;
}
#boxoutleft p {
    font-family: "Trebuchet MS", tahoma, verdana, sans, arial, helvetica, sans-serif;
    font-size: 90%;
    text-align: left;
}
div.boxouttitle{
    font-family: "Trebuchet MS", tahoma, verdana, sans, arial, helvetica, sans-serif;
    font-size: 110%;
    text-align: left;
    font-weight: bold;
    border: none;
    color: #900;
    margin: 0em 0em 0em 0em;
}
#boxoutleft ul {
    font-family: "Trebuchet MS", tahoma, verdana, sans, arial, helvetica, sans-serif;
    color: #000;
    background: transparent;
    margin-bottom: 1em;
}
#boxoutleft ul li{
    font-family: "Trebuchet MS", tahoma, verdana, sans, arial, helvetica, sans-serif;
    font-size: 90%;
    text-align: left;
    margin-left: -1.5em;
}
#boxoutleft a:link {
    font-size: 90%;
    text-decoration: none;
    color: #330366;
}
#boxoutleft a:visited {
    font-size: 90%;
    text-decoration: none;
    color: #330366;
}
#boxoutleft a:active {
    font-size: 90%;
    text-decoration: none;
    color: #330366;
}
#boxoutleft a:hover {
    font-size: 90%;
    text-decoration: underline;
    color: #330366;
}
#boxoutleft span.forummenutext {
    font-size: 75%;
    color: #330366;
}
div.forumlinks {
    margin: 0.5em 0em 0.5em 0em;
}
*/
#newmenu {
    background: #ffffff;
	color: black;
	font-size: 100%;
}
#newmenu a:link {
    text-decoration: none;
    color: #990000;
}
#newmenu a:visited {
    text-decoration: none;
    color: #990000;
}
#newmenu a:active {
    text-decoration: none;
    color: #990000;
}
#newmenu a:hover {
    text-decoration: underline;
    color: #990000;
}
div.menulevel1 {
	border: 1px solid #aaaaaa;
	background: #eeeeee;
	color: #000000;
	font-size: 90%;
	padding-left: 0.5em;
	padding-top: 2px;
	padding-bottom: 2px;
}
div.menulevel2 {
	border-left: 1px solid #aaaaaa;
	border-right: 1px solid #aaaaaa;
	background: #ffffff;
	color: #000000;
	padding-left: 1.5em;
	font-size: 85%;
}
div.menulevel3 {
	border-left: 1px solid #aaaaaa;
	border-right: 1px solid #aaaaaa;
	background: #ffffff;
	color: #000000;
	padding-left: 2.5em;
	font-size: 80%;
}
#menubottom {
	border-bottom: 1px solid #aaaaaa;
}#menusectionbottom {
	padding-bottom: 2px;
}

/* eigenes Styling für die neue Parameterabfrage*/
.DSPTitel {
	border: 1px solid #000000;
	padding: 0px;
	background: #EEEEEE;
}

/* fip-banner 06/2015 */
.fip_banner {
	float: right;
	margin-top: 0px;
	width: 250px;
}