styles.css

@import url('https://fonts.googleapis.com/css?family=Permanent+Marker&display=swap');
@import url('https://fonts.googleapis.com/css?family=Martel+Sans:200,400,600&display=swap');

/* Global */
html {
  scroll-behavior: smooth;
}

p {
  font-family: 'Martel Sans', sans-serif;
  font-weight: 300;
}

h1 {
  font-family: 'Permanent Marker', cursive;
  font-size: 3.25em;
  color: #0A2463;
}

/* Header */
.row-1 {
  background-color: #eee;
  min-height: 60vh;
  padding-bottom: 30px;
}

.row-1 p {
  color: grey;
  font-weight: 200;
  font-size: 20px;
  padding: 10px 0px;
  /* max-width: 1000px; */
}

.row-1 img {
  max-width: 400px;
  width: 100%;
}

.heading i {
  font-size: 1.55em;
  color: rgb(149, 149, 149);
  padding-right: 6px;
}

.heading i:hover {
  color: #0A2463;
}

/* Bio */
.row-2 {
  padding-top: 30px;
  min-height: 60vh;
  background-color: #0A2463;
  color: white;
  padding-bottom: 30px;
}

.row-2 h3 {
  font-family: 'Permanent Marker', cursive;
  font-size: 40px;
  padding-bottom: 30px;
}

.row-2 p {
  margin-bottom: 40px;
}

.row-2 img {
  max-width: 400px;
}

.button {
  color: white;
  background: #ff3366;
  padding: 8px 10px 5px;
  border-radius: 4px;
  text-align: center;
  transition: background 0.3s ease;
  font-family: 'Martel Sans', sans-serif;
}

.button:hover {
  color: white;
  text-decoration: none;
  background: #d62c56
}

/* Career */
.row-3 {
  min-height: 60vh;
}

.career h3 {
  font-family: 'Permanent Marker', cursive;
  color: #0A2463;
  font-size: 40px;
  padding-bottom: 30px;
}

.square {
  display: block;
  border-radius: 7px;
  background: white;
  box-shadow: 0 0 20px 0px #f0f0f0;
  padding: 20px;
  border-left: 5px solid #ff3366;
  margin-bottom: 3rem;
  height: 120px;
}

.square p {
  font-size: 1.1rem;
  color: grey;
}

/* Projects */
.projects h3 {
  font-family: 'Permanent Marker', cursive;
  color: #0A2463;
  font-size: 40px;
  padding-bottom: 30px;
}

.projects i {
  color: #d62c56;
  font-size: 2.5em;
}

.projects h4 {
  color: #0A2463;
}

.projects p {
  color: grey;
}

.projects a {
  text-decoration: none;
}

.square-card {
  display: block;
  border-radius: 10px;
  background: white;
  box-shadow: 0 0 20px 0px rgb(235, 235, 235);
  padding: 20px;
  margin-bottom: 3rem!important;
  font-size: 1.4rem;
  transition: box-shadow 0.3s ease;
}
.square-card:hover {
  box-shadow: 0 0 20px 0px #e6acba;
}

/* Week */
.row-6 {
  min-height: 60vh;
}
.week h3 {
  font-family: 'Permanent Marker', cursive;
  color: #0A2463;
  font-size: 40px;
  padding-bottom: 30px;
}

.week h4 {
  font-size: 3.5rem;
  color: #ff3366;
}

.week .stats {
  padding: 25px 0px;
}
.week p {
  font-size: 25px;
  color: grey;
}

.title {
  padding-top: 50px;
}

/* Footer */
.footer {
  background-color: #0A2463;
  color: white;
  padding: 40px;
  font-family: 'Martel Sans', sans-serif;
  font-weight: 300;
}

.footer h3 {
  font-family: 'Permanent Marker', cursive;
}

.footer .button {
  border: none;
}