body { margin: 0; padding: 0; background-color: white; font-family: sans-serif; font-size: 16px; line-height: 1.5; color: black; } .container { margin-left: auto; margin-right: auto; padding-left: 15px; padding-right: 15px; } @media (min-width: 992px) { .container { width: 970px; } } .row { display: grid; grid-template-columns: repeat(12, 1fr); } #dhead { margin-top: 20px; } #dpic { grid-column: span 6; text-align: right; } #ddesc { padding-top: 40px; padding-left: 20px; grid-column: span 6; } @media (max-width: 991px) { #dpic { grid-column: span 12; text-align: center; } #ddesc { grid-column: span 12; padding-top: 20px; text-align: center; } } h1 { font-size: 34px; font-weight: normal; padding: 0; margin: 0; } h2 { font-weight: normal; font-style: italic; color: #999; font-size: 18px; padding: 0; margin: 5px 0 10px 0; } @media (min-width: 992px) { h2 { max-width: 300px; } } #dpic img { width: 240px; height: 240px; border-radius: 120px; } .iico { width: 40px; height: 40px; } hr { height: 1px; background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0)); background-image: -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0)); background-image: -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0)); background-image: -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0)); padding: 0; margin: 20px 0px 20px 0px; border: 0; } .ico { grid-column: span 1; vertical-align: top; border-left: 2px solid #cfcfcf; position: relative; } .ico img { border-radius: 5px; width: 100%; max-width: 80px; margin-left: 10px; } .desc { grid-column: span 10; vertical-align: top; font-size: 17px; padding-left: 20px; padding-bottom: 20px; } .entry { } .entry-dot { position: absolute; top: 4px; left: -7px; width: 8px; height: 8px; border-radius: 10px; background-color: #cfcfcf; border: 2px solid white; } .timespan { grid-column: span 1; font-size: 14px; text-align: right; padding-right: 5px; color: #bbb; } .hassets { position: relative; } @media (max-width: 991px) { .hassets { display: none; } } .hasset { position: absolute; margin: 0; padding: 0; } .ctitle { font-size: 36px; margin-bottom: 20px; margin-top: 40px; } .card { grid-column: span 3; vertical-align: top; background-color: #eee; border: 1px solid #ddd; border-radius: 3px; padding: 5px; background-color: white; padding-bottom: 10px; } @media (max-width: 991px) { .card { grid-column: span 6; } #featured-talks .row { grid-column-gap: 5px; grid-row-gap: 5px; } } .card img { border-radius: 5px; width: 100%; } .cdesc { height: 30px; vertical-align: top; margin-bottom: 10px; font-size: 15px; } @media (max-width: 768px) { .cdesc { font-size: 14px; padding-bottom: 10px; } }