/* Adapted from selfhtml.org */ /* ==================================================== GLOBAL DEFINITION ==================================================== */ @font-face { font-family: 'Tauri'; font-style: normal; font-weight: 400; src: local('Tauri Regular'), local('Tauri-Regular'), url(http://themes.googleusercontent.com/static/fonts/tauri/v2/33NkxyDp8MBgQpwno_A-zw.woff) format('woff'); } * { margin: 0; padding: 0; } html { padding: 5px 2%; } body { width: 700px; margin: 0 auto; font: normal .75em Arial, sans-serif; color: #474747; background: #ffffff; } a { color:#843953; font-weight: bold; } a:hover, a:focus { color: #8F8F90; } p { /* line-height: 1.6em; */ margin: 20px 0; } h1 { font: bold 1.875em Tauri, serif; color:#7C2D48; } h2 { font-size: 1.875em; font-weight: normal; color: #7C2D48; margin-top: 15px; padding: 10px 0px 5px; border-bottom: 1px solid #BBBCBE; } h3 { font: normal 1.10em Tauri, serif; color: #898989; margin: 20px 0 5px; } h4 { font: normal 1.0em Tauri, serif; color: #898989; margin: 10px 0 5px; } ol { margin: 7px 0 0 20px; } ol li { margin-bottom: 5px; } dl { margin-bottom: 10px; clear: left; } dt { float: left; font-weight: bold; margin-right: 5px; padding: 5px; width: 90px; } dd { margin: 2px 0; padding: 5px 0; } dd::after { clear: left; content: " "; display: block; } p { margin-bottom: 0; margin-top: 5px; } address { margin-top: 5px; clear: both; } /* ==================================================== HEADER ==================================================== */ header { width: 100%; } header h1 { padding-top: 60px; } #navlink { display:none; float: right; text-decoration: none; font-size: 1.875em; font-weight: bold; padding: 10px; margin: 0px 30px 0 0; } h2 #navlink { font-weight: normal; font-size: 1.3em; padding: 0px; margin: -0.2em 40px 0 0px; } h3 #navlink { font-weight: normal; font-size: 1.875em; padding: 0px; margin: -0.5em 40px 0 0px; } /* ==================================================== CONTENT ==================================================== */ main { display: block; position: relative; width: 100% } /* ==================================================== NAV ==================================================== */ nav { float: left; width: 100%; list-style-type: none; position: absolute; top: -120px; left:0%; display: block; text-align: center; margin: 0 auto 10px; } nav ul { float: left; width: 100%; list-style-type: none; background: #7C2D48; } nav ul li { float: left; } nav ul li:first-child { margin-left: 2%; } nav ul li a { float: left; padding: 16px 0 16px 16px; color: #FFFFFF; text-decoration: none; } nav ul li a:after { content:" | "; color: #ffa323; margin-left: 20px; } nav li a:hover, nav li a:focus { background: #6D273F; } /* ==================================================== FOOTER ==================================================== */ footer { float: left; width: 100%; margin: 10px 0 40px 0; color: #989898 } footer ul { float: left; margin-left: 22px; list-style-type: none; } footer ul li { display: inline-block; border-left: 1px solid #989898; } footer ul li:first-child { border: 0 none; } footer ul li a { padding: 0 8px; } footer p { float: right; margin-right: 30px; margin-top: 0; padding-top: 0; text-align: right; } /* 1-Spaltenlayout mit Navigation unten*/ @media screen and (max-width: 740px) { body, section { float: none; width: 100%; } header h1 { padding-top: 0px; } #navlink { display:block; } nav { position:relative; top: 10px; } nav ul { display: block; background: transparent; margin: 3em 0 2em; } nav ul li{ width: 90%; margin: 5px 2%; } nav ul li a{ width: 90%; background: #7C2D48; margin: 5px 5%; border-radius: 10px; } nav ul li a:after { display:none; } } /* Year listing in teaching */ ul.lecture li { display: inline; list-style-type: none; } ul.lecture li:not(:first-child)::before { content: '- '; } /* Downloads for publications */ ul.pubdown li { display: inline; list-style-type: none; } ul.pubdown li:not(:first-child)::before { content: "- "; } ul.courses { margin-top: 0; padding-left: 15px; } ul.courses li { margin-bottom: 5px; } ul.thesis { margin-top: 0; padding-left: 15px; } /* Abstracts with hovering */ li.abstract a { text-decoration: underline; } li.abstract a:hover, li.abstract a:focus { color:#843953; } li.abstract span.abstract { visibility: hidden; height: 0; z-index: 1000; display: block; } li.abstract:hover span.abstract, li.abstract:active span.abstract, li.abstract:focus span.abstract, li.abstract:focus-within span.abstract { visibility: visible; height: auto; padding: 5px; border: 1px solid #8F8F90; }