/* Projects page */ section{ width: 90%; margin: auto; } section div#projects{ margin: 0; padding: 0; text-align: center; } section article.project{ position: relative; display: inline-block; vertical-align: top; width: 40%; margin: 2em 3%; padding: 1em; text-align: left; border-left: 0.1em solid #aacaaa; border-right: 0.1em solid #aacaaa; background: linear-gradient(to bottom, #e5f0e500 0%, #e5f0e5ff 20%, #e5f0e5ff 80%, #e5f0e500 100%); } @media screen and (max-width : 800px){ section article.project{ width: 96%; margin: 0.3em auto; padding: 0.3em; } } section article.project table{ width: 100%; } section article.project table td.logo{ text-align: center; vertical-align: top; width: 9em; } section article.project table td.logo img.project_image{ padding: 0.5em; max-width: 9em; max-height: 9em; background-color: #cccccc; border: 0.1em solid #60ae29; box-shadow: inset 0 0 0.5em #00220077; border-radius: 1em; } @media screen and (max-width : 800px){ section article.project table td.logo{ width: 17vw; } section article.project table td.logo img.project_image{ padding: 0.3em; width: 15vw; height: 15vw; border-radius: 0.5em; } } section article.project table td.project_details{ padding-left: 1.5em; vertical-align: top; } @media screen and (max-width : 800px){ section article.project table td.project_details{ padding-left: 0.5em; } section article.project table td.project_details h4{ margin-bottom: 0.2em; } } section article.project table span.project_tagline{ font-size: 80%; font-style: italic; }