@import url(http://fonts.googleapis.com/css?family=Lato&subset=latin-ext); /* 'Lato' font */

* {margin:0;padding:0;}

body {
 margin:0 auto;
 padding:0 10px;
 max-width:1600px;
 font-family:'Lato', sans-serif;
 font-size:16px;
}

/* GO TOP BUTTON */
body img.top_arrow {display:none;}
a[href="#top"]:before {content: "";}
a[href="#top"] {
 padding:1em 0.8em;
 background:#fff !important;
 display:block;
 position:fixed;
 bottom:20px;
 left:50%;
 box-shadow:0px 0px 5px #888888;
 text-align:center;
 margin-left:-23.3em;
 line-height:0;
}
a[href="#top"]:hover {text-decoration:none;background:#eee !important;}
a[href="#top"]:before {
 border-width:0.5em;
 border-color:#000;
 width:0;
 height:0;
 display:inline-block;
 vertical-align:middle;
 border-style:solid;
 border-top-style:none;
 border-left-color:transparent;
 border-right-color:transparent;
}
    
/* in CE system (HTML 4.01 Transitional) <abr> is <acronym> */
abbr {
 border-bottom : 1px dashed #EB6B3D;
}

a abbr,
abbr a {
 cursor: help;
}

a:link, a:visited, a:hover {
 background : transparent;
 text-decoration : none;
 color : #0055d4;
}


/* HEADER */  
#header {
 padding-top:10px;
 padding-bottom:30px;
 border-bottom: 1px #ccc solid;
}
        
/* RESPONSIVE HEADER */
#header table {width:100%;border:0;border-spacing:0;border-collapse:collapse;}
#header table td {padding:0;}
img#banner,
img[name=banner] {width:100%;}
table.sponsorboard img {width:100%;}
table.sponsorboard, table.sponsorboard td {padding:0;width:80% !important;border:0;}
table.sponsorboard td, #header table td {vertical-align:top;text-align:right;}
#header table td:nth-child(2) {width:3%;} /* space between banner and sponsorboard */
#header table td:last-child {background:transparent;}
     
#header h1 span {
 font-size : 1.6em;
 color : blue;
}
#header h2 span {
 font-size : 1.3em;
 font-style : italic;
 color : red;
}

/* MIDDLE PART OF WEBSITE */
#container {
 position : relative;
 min-width : 640px;
 top : 0;
 padding-top: 2.5em;
}


/* URGENT INFO */
@keyframes fadeIn { 
 from { opacity: 0; } 
}

span#urgentInfo {
 animation: fadeIn 1s infinite alternate;
 font-size : 1.5em;
 font-weight : bold;
 display: block;
 text-align:left;
 padding-bottom: 2.5em;
 margin-left: 32.5%;
}

span#urgentInfo,
span#urgentInfo a {
 color: #ff0000;
}




/* CONTENT */
#info {
 padding : 0;
 display: block;
 float:none;
 overflow: hidden; 
}


/* ELEMENTS SECTIONS */
div.section {
 margin-left : 10.5%;
 margin-bottom: 5%;
}
    
div.section p,
div.section td,
div.section th {line-height:1.3;}

div.section th, 
div.section td {display:table-cell;vertical-align:top;padding:0;}
div.section th p,
div.section td p {margin:0;padding:0;display:table-cell;vertical-align:top;}

div.section p,
div.section table,
div.section ul {
 margin:0;
 margin-top:1em;
}

div.section h3.headline {
 margin : 0;
 padding : 0;
 margin-bottom:2em;
 background: #ccc; /* by KK */
}
div.section h3 {
/* Subsection Title */
 font-size : 1.1em;
 margin:0;
 margin-top:2em;
}
div.section h4 {
/* Paragraph Title */
 font-size : 1.1em;
 margin:0;
 margin-top:2em;
}


/* TABELS IN SECTIONS */
div.section table {width:100%;}
div.section table td {vertical-align:top;padding:0.4em 1em !important;text-align:justify;}
#welcome table td:first-child {
 width:16.75% !important;
 text-align:right !important;
}
#deadlines table td:nth-child(2) {
 text-align:center;
}

/* ELEMENTS IN "ORGANISERS" SECTION */    
#organisers p.symposia span ol li {
 font-style : italic;
}
#organisers p.symposia span ol li ul li {
 font-style : normal;
}

/* ELEMENTS IN "PROGRAM" SECTION */
#programme table {border-collapse: collapse;}
#programme table,
#programme table th,
#programme table td {
 border:1px solid #000;
 padding:0.5em;
}
#programme table td p {display:block;}
#programme table ol {padding-left:2em;}

/* 
#programme table td:first-child {width:16.75%;text-align:center;vertical-align:center}
#programme table tr:first-child td:first-child {text-align:left;background:#ccc}
#programme table tr:nth-child(even) {background:#eee}
#programme table tr:nth-child(odd) {background:#fff}
 */
 
/* ELEMENTS IN "CONTACT" SECTION */
#contact table td {
padding:5px;}
#contact table td:first-child {width:50px;}



#info div ul,
#info div ol {
 margin-top : 0;
 padding-top : 0;
}

#accommodation table td {
 text-align : center;
}

div.section h3.headline span {
 font-size : 2em;
}

/* SECTIONS */
div.section a.txt:hover {border-bottom:dotted 1px #000;}
div.section a.img:hover {}
div.section ul {list-style-type:square;padding-left:2em;}

/* SECTIONS HEADERS ICONS */
div.section h3.headline {
/* let's make left side of a section header ready for icons */
 padding-left:3em;
 background-size:auto 100%;
 background-repeat:no-repeat;
 background-position:center left;
}
#welcome h3.headline {background-image:url(welcome.png);}
#programme h3.headline {background-image:url(programme.png);}
#abstracts h3.headline {background-image:url(abstracts.png);}
#proceedings h3.headline {background-image:url(proceedings.png);}
#sponsors h3.headline {background-image:url(sponsors.png);}
#organisers h3.headline {background-image:url(organisers.png);}
#requirements h3.headline,
#deadlines h3.headline {background-image:url(deadlines.png);}
#venue h3.headline {background-image:url(venue.png);}
#accommodation h3.headline {background-image:url(accommodation.png);}
#contact h3.headline {background-image:url(contact.png);}



/* styles for side elements (lists, footer, etc.) */
#linkList {
 float : left;
 list-style: none;
 display: block;
 width: 24%;
 text-align:right;
}
#linkList a {display : inline-block; background:none; padding:0.4em 0;}
#linkList a:hover {background:#eee;}
#linkList h3.headline {
 font-weight : normal;
 text-transform : lowercase;
}


ul.linksection {
 margin-top : 0px;
 margin-left: 0px;
 padding-top : 0px;
 padding-left : 0px;
}
ul.linksection { list-style-type : none; }
ul.linksection li ul {
 list-style-type : none;
 margin:0;
 padding:0;
 padding-bottom : 2em;
}
ul.linksection li ul li span {
 color : #999;
}
ul.linksection h3.headline {
/* side menu header */
  background: #ccc; /* by KK */
 padding-top : 5px;
 margin : 0 0 5px 0;
 overflow : hidden;
 display : block;
 font-size : 2em;
}

    
    

#lonline ul li small {
 font-style : oblique;
 text-align : right;
}
#lonline ul li a.c {
 display : inline;
 text-align : right;
}
    

/* FOOTER */
#footer {
 position : relative;
 margin : 0;
 clear : both;
 border-top : 1px solid #909090;
 min-height: 100vh;
}
#footer table {margin:0 auto;}
#footer table , #footer table td {width:auto !important;}

p.copyrightnote, table.copyrightnote {
 color : #999;
 font-size : 0.8em;
 padding-left : 1em;
 padding-right : 1em;
 vertical-align : top;
}
table.copyrightnote {
 width : 100%;
 vertical-align : top;
}
table.copyrightnote tr {
 vertical-align : top;
}
p.copyrightnote a:link, table.copyrightnote a:link {text-decoration : none; color : #999;}
p.copyrightnote a:visited, table.copyrightnote a:visited {text-decoration : none; color : #999;}
p.copyrightnote a:hover, table.copyrightnote a:hover {/* text-decoration : underline; */ color : #00C;}




/* CHANGE TEXT INSIDE MENU HEADERS */
#lonline .headline span {visibility:hidden;display:none;}
#lonline .headline:before {content: "on-line content";}


/* SELECT PATTERNS */ 
body {
/* let's make everything unselectable */
 -webkit-touch-callout: none;
 -webkit-user-select: none;
 -khtml-user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
 user-select: none;
 cursor: default;
}

.section {
/* let's make section content selectable */
 -webkit-touch-callout: text;
 -webkit-user-select: text;
 -khtml-user-select: text;
 -moz-user-select: text;
 -ms-user-select: text;
 user-select: text;
 cursor: text;
}


/* ADJUST TO SCREEN SIZE */   
@media screen and (max-width: 1600px) {
/* big screen */
 body {
  /* background-color: lightblue; */
  font-size:1vw; /* responsive font size */
 }
}

@media screen and (max-width: 1200px) {
/* small screen */
 body {
  /* background-color: lightblue; */
  width:1000px;
  font-size:12px;
 }
 a[href="#top"] {left:22em;margin-left:0;}
}



/* CUSTOM TEMPLATE */

#highlights {padding: 1em;border:1px dashed #eee;}
#highlights h3 {margin:0;}


#keynote table {border-collapse: collapse; border-spacing: 0;background:#eee;padding:0;}
#keynote table td {padding:0 !important;}
#keynote table #keynoteInfo {padding:1em;}
#keynote table #keynotePhoto {vertical-align:bottom;width:25%;}
#keynote table #keynotePhoto img {display:block;width:100%;}
#keynote table h2 {
 font-size:1.5em;
 padding:.3em 0;
 padding-left:2.5em;
 background-size:auto 1.5em;
 background-repeat:no-repeat;
 background-position:center left;
 background-image:url(../nobelprize.png);
 display:block;
}
#keynote table a#more {font-size:1em important;}

#partners, #keynote {margin-top:1em;}
#partners table td {
/*  height: 4.5vw; */
 vertical-align:top;
 text-align:center;
 padding: 0.1vw;
 overflow:auto;
/*  white-space:nowrap; */
}

#partners td a.img {display:inline-block;height:4vw;width:100%;}

#partners td a.img span {display:block;}