// vim: tabstop=2 shiftwidth=2 expandtab @import url('fonts.css'); @import 'params'; html { background-color: $bg_color; } body { font-family:Open Sans,Arial; color:#555; font-size:16px; line-height:1.4; text-align:justify; margin: 0; padding: 0; } #head { background-color: $head_bg_color; display: flex; justify-content: space-between; align-items: center; margin: 0; padding: 30px 60px; color: $bg_color; .title { font-size: 1.4em; font-weight: bold; } .whoami { font-weight: bold; } a, a:visited { color: $bg_color; } } #main-container { display: flex; justify-content: space-between; @media (max-width: $resp_vsmall) { flex-wrap: wrap; } .tab-selector { margin: 40px; ul { list-style: none; min-width: 200px; padding: 0; li { a { display: block; font-size: 1.2em; padding: 10px 20px; background-color: $head_bg_color; margin: 2px 0; border-top-left-radius: 10px; border-bottom-left-radius: 10px; transition: margin 0.1s ease-in-out; &:hover { margin-left: 10px; } color: $bg_color; } &.active { margin-left: 20px; } } } } #content { margin:2em auto; max-width:800px; padding:1em; flex-basis: 800px; } .profilepic { flex: 0 0 auto; margin: 40px; width: $profile_pic_wid; height: auto; @media (max-width: $resp_small) { width: $profile_pic_wid_small; } @media (max-width: $resp_vsmall) { flex-shrink: 2; width: $profile_pic_wid_vsmall; order: -1; } img { margin: auto; max-height: 100%; max-width: 100%; border-radius: 20px; @media (max-width: $resp_vsmall) { border-radius: 50%; } } } } .items { display: grid; grid-template-columns: 100px auto; .head { grid-column: 1/span 1; font-weight: bold; } } a, a:visited { color: $link_color; text-decoration:none; } .fa { color:#555 } h1 { margin-left:-10px; } h2 { margin-top: 30px; margin-left:20px; .fa { margin-right: 10px; } } #whoami { text-align: right; font-size: 1.2em; font-style: italic; } ul.docsline { list-style: none; text-align: center; margin-top: 30px; font-size: 1.1em; li { display: inline-block; a { display: inline-block; padding: 0 15px; } } } dl { list-style: none; display: grid; grid-template-columns: 1fr 3fr; dt { grid-column: 1 / span 1; justify-self: end; text-align: right; margin-right: 20px; font-weight: bold; } dd { margin-left: 20px; justify-self: start; text-align: left; } } .antispam { unicode-bidi: bidi-override; direction: rtl; } ul.publications, ul.talks, ul.unpublished { li { .authors { font-style: italic; .author:after { content: ', '; } .author:last-child:after { content: ''; } } .title { font-weight: bold; } .journal, .venue { } .date { } } } ul.teaching-courses { li { list-style: circle; } } .course-name { .course-title { font-weight: bold; } .course-longtitle:before { content: ' — ' } } .course-titleblock { h2 { margin-bottom: 10px; } .course-institute { text-align: right; font-size: 1.1em; font-style: italic; } margin-bottom: 20px; }