--- /dev/null
+body {
+ margin: 0; /*turning margin off as default*/
+ min-height: 100vh;
+ font-size: 1em;
+ display: flex;
+ flex-direction: column; /*default flex direction is row*/
+ font-family: 'Verdana', sans-serif;
+}
+
+header img {
+ width: 120px;
+ height: 120px;
+}
+
+header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center; /*vertical centering*/
+ padding: 10px 40px;
+ background: linear-gradient(to bottom, #ccc, white);
+}
+
+header ul {
+ display: flex;
+ margin: 0; /*taking the margin and padding ul default size off*/
+ padding: 0;
+ list-style-type: none;
+}
+
+header li {
+ padding: 2.5em;
+}
+
+header li a {
+ color: #333;
+ text-decoration: none;
+}
+
+main {
+ padding: 2em;
+ line-height: 1.1;
+ display: flex;
+ justify-content: space-between;
+ align-items: stretch; /*vertical centering*/
+ flex-grow: 1;
+}
+
+h2 {
+ font-size: 1em;
+ text-align: center;
+}
+
+main section {
+ flex-grow: 1;
+ flex-basis: 33%;
+ padding: 20px;
+ border-right: solid 1px #b9b9b9;
+ text-align: justify;
+}
+
+main section:last-child {
+ border-right: 0;
+}
+
+main section ul li {
+ list-style: square;
+}
+
+main section ul li a {
+ color: #333;
+}
+
+@keyframes bounce {
+ 0%,
+ 20%,
+ 40%,
+ 60%,
+ 80%,
+ 100% {
+ transform: translateY(0);
+ }
+ 50% {
+ transform: translateY(-10px);
+ }
+}
+
+.button {
+ animation-name: bounce;
+ animation-duration: 2s;
+ animation-iteration-count: infinite;
+ position:absolute;
+ right: 20px;
+ bottom: 20px;
+ background-color: #666;
+ border-radius: 5px;
+ padding: 10px 65px 15px 65px;
+ cursor: pointer;
+}
+
+.member-button {
+ text-decoration: none;
+ color: #fff;
+ font-size: 16px;
+ font-weight: 500;
+}
+
+.hidden-menu {
+ display: none;
+ position: absolute;
+ right: 20px;
+ bottom: 100px;
+ background-color: #666;
+ border-radius: 5px;
+ padding: 25px;
+}
+
+.hidden-menu-buttons {
+ display: flex;
+ flex-direction: column;
+ text-align: left;
+}
+
+.hidden-menu-buttons a {
+ cursor: pointer;
+}
+
+footer {
+ background: linear-gradient(to bottom, white, #ccc);
+ min-height: 15vh;
+ color: #666;
+}
+
+footer ul {
+ margin: 0; /*taking the margin and padding ul default size off */
+ padding: 0;
+ list-style-type: none;
+ display: flex;
+ justify-content: center;
+}
+
+footer li {
+ margin: 5px 10px;
+}
+
+h3 {
+ font-size: 0.8em;
+ text-align: center;
+}
+
+footer p {
+ font-size: 0.6em;
+ text-align: center;
+}
+
+@media screen and (min-width: 1024px) {
+ body {
+ font-size: 1.25em;
+ }
+
+a:hover {
+ text-shadow: 2px 2px #aaa;
+}
+
+.title {
+ margin-top: 20px;
+}
+
+.team-section{
+ min-height: 400px;
+ text-align: center;
+ overflow: hidden;
+ background:#34495e;
+ padding:60px;
+ display:flex;
+}
+
+
+.our-team{
+ margin-top: 100px;
+}
+
+.our-team .pic{
+ display: inline-block;
+ width: 85%;
+ height: 85%;
+ padding: 5px;
+ margin-bottom: 1px;
+ transition: all 0.5s ease 0s;
+ }
+.our-team:hover .pic{
+ background: #17bebb;
+ border-radius: 70%;
+ }
+
+ .pic img{
+ width: 100%;
+ height: auto;
+ border-radius: 50%;
+ }
+
+ .our-team .title{
+ display: block;
+ font-size: 15px;
+ font-weight: 600;
+ color: white;
+ margin: 0 0 7px 0;
+ }
+ .our-team .post{
+ display: block;
+ font-size: 15px;
+ color: #17bebb;
+ text-transform: capitalize;
+ margin-bottom: 15px;
+ }
+
+ @media only screen and (max-width: 990px){
+ .our-team{ margin-bottom: 30px; }
+ }