* {
  box-sizing: border-box;
 }
 body {
  font-family: "Roboto", sans-serif;
 }
 
 .header-wrapper {
  background-color: #fff;
  position: fixed;
  z-index: 1000;
  width: 100%;
  border-bottom: solid 1px #ddd;
  height: 80px;
  padding: 10px;
 }
 
 .header-wrapper .logo-wrapper {
  float: left;
 }
 
 .header-wrapper .menu-wrapper {
  float: right;
 }
 
 .menu-wrapper .menu ul {
  display: block;
  list-style: none;
  margin: 0;
  padding-left: 0;
 }
 
 .menu-wrapper .menu ul > li {
  display: inline-block;
  margin: 15px 10px 0;
 }
 
 .menu-wrapper .menu ul > li.contact-link {
   display: none;
 }
 
 .menu-wrapper .menu ul > li.contact-link a,
 .menu-wrapper .menu ul > li.contact-link a:hover,
 .menu-wrapper .menu ul > li.contact-link a:visited {
   color: inherit;
 }
 
 .signin-btn, .read-article-btn {
  background-color: #20c668;
  border: none;
  padding: 5px 20px;
 }
 
 .signin-btn:hover, .read-article-btn:hover {
  background-color: #1ba557;
 }

 main {
  padding-top: 80px;
  background-color: #f5f5f7;
 }
 
 .main-wrapper {
  max-width: 80%;
  margin: 0 auto;
  padding-bottom: 20px;
}

.jumbotron {
  padding: 100px 10px;
  margin: 0;
  border-radius: 0px ;
  color: #eee;
  letter-spacing: 5px;
  background: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)),url(../assets/images/main-jumbotron-bg.jpg) no-repeat;
  background-position: 70%;
  background-size: cover;
}

.jumbotron h2 {
  font-weight: 300;
  font-size: 36px;
  text-align: center;
}

.blog-list {
  margin-top: 30px;
}

.blog-card-wrapper {
  margin-bottom: 30px;
}

.blog-card {
  background-color: #f5f5f7;
  box-shadow: 0 0 2px #c7cfdd;
  transition: all 0.15s linear;
  height: 100%;
  overflow: hidden;
}

.blog-card:hover {
  box-shadow: 0 0 10px #c7cfdd;
}

.article-img-wrapper img{
  width: 100%;
}

.article-text-wrapper {
  padding: 20px;
  min-height: 100px;
  background-color: #fff;
}

.article-text-wrapper h3{
  font-size: 22px;
}

.article-text-wrapper p{
  color: #555c67;
  font-size: 18px;
  font-weight: 300;
}

.read-article-wrapper {
  background-color: #f5f5f7;
  padding: 20px;

}

.read-article-wrapper a{
  color: #fff;
}
 
 footer {
   background-color: #2d323b;
   color: #8b95a5;
   padding: 20px 0 0;
 }
 
 footer a, footer a:hover, footer a:visited {
   color: inherit;
 }
 
 footer .footer-wrapper {
   margin: 0 auto;
   display: flex;
   justify-content: space-between;
   flex-direction: column;
   font-size: 14px;
 }
 
 footer .footer-wrapper span{
   margin-bottom: 10px;
 }
 
 @media screen and (min-width: 992px) {
   footer {
     padding: 20px 0;
   }
   
   footer .footer-wrapper {
     flex-direction: row;
   }
 
   footer .footer-wrapper span{
     margin-bottom: 0px;
   }
 }
 
 @media screen and (min-width: 576px) {
   .menu-wrapper .menu ul > li.contact-link {
     display: inline-block;
   }
 }

 @media screen and (min-width: 692px) and (max-width: 849px) {
  .article-text-wrapper h3{
    height: 75px;
  }
}

@media screen and (min-width: 850px) {
  .article-text-wrapper h3{
    height: 50px;
  }
}