/* GRA310 - Digital Graphic Design for Web - SNHU Style Sheet - Our Team Author: Claudia Lindsay Date: 01/20/2017 Filename: style_sheet_our_team_CLindsay.css*/ /* #############################OUR TEAM########################### */ @import url(https://fonts.googleapis.com/css?family=Muli); h3{ font-family: 'Dancing Script', cursive; font-size: 3em; color: #8a8c8f; width: 100%; } .team { font-family: 'Muli', Arial, sans-serif; color: #8a8c8f; position: relative; float: left; overflow: hidden; margin: 10px 1%; min-width: 230px; max-width: 315px; width: 100%; color: #8a8c8f; text-align: left; line-height: 1.4em; background-color: #141414; } .team img { max-width: 100%; vertical-align: top; opacity: 0.85; } .team figcaption { font-family: 'Muli', Arial, sans-serif; width: 100%; background-color: #141414; padding: 25px; position: relative; } .team figcaption:before { position: absolute; content: ''; bottom: 100%; left: 0; width: 0; height: 0; border-style: solid; border-width: 55px 0 0 400px; border-color: transparent transparent transparent #141414; } .team figcaption a { font-family: 'Muli', Arial, sans-serif; padding: 5px; border: 2px solid #8a8c8f; color: #8a8c8f; font-size: 0.7em; text-transform: uppercase; margin: 10px 0; display: inline-block; width: 97%; text-align: center; font-weight: 600; letter-spacing: 1px; text-decoration: none; } .team figcaption a:hover { opacity: 1; color: #be1e2d; } .team .profile { border-radius: 50%; position: absolute; bottom: 100%; left: 25px; z-index: 1; max-width: 90px; opacity: 1; } .team h2 { font-family: 'Muli', Arial, sans-serif; margin: 0 0 5px; font-weight: 300; } .team h2 span { font-family: 'Muli', Arial, sans-serif; display: block; font-size: 0.5em; color: #8a8c8f; } .team p { margin: 0 0 10px; font-size: 1.09em; } #middle { margin-left: 20%; }