@media screen and (max-width:1440px) {
  .bnote-wrapper .main-blog {
    max-width: 1180px;
  }

  .bnote-wrapper .yma-container .floater {
    display: none;
  }

  .bnote-wrapper #yma-blog .featured-card {
    margin-top: 0;
    margin-right: calc((100% - (350px * 2)) / 2);
  }

  .bnote-wrapper .blog-sidebar,
  .bnote-wrapper .featured-card,
  .bnote-wrapper .blog-sidebar .blog-article {
    max-width: 350px;
  }

  .bnote-wrapper .main-blog .main h3{
    font-size: 21px;
  }
}

@media screen and (max-width:1250px) {
  .bnote-wrapper .you-might-also .featured-card{
    margin-right: 20px;
    margin-left: auto;
  }
}


@media screen and (max-width:1100px) {
  .bnote-wrapper .yma-container .floater {
    display: flex;
  }

  .bnote-wrapper .main-blog{
    flex-flow: column;
    padding-bottom: 20px;
  }

  .bnote-wrapper .main-blog .blog-author{
    display: none;
  }

  .bnote-wrapper .main-blog .main{
    width: 100%;
    margin: 0;
    max-width: none;
  }

  .bnote-wrapper .responsive-author-info{
    display: flex;
    margin-top: 10px;
    font-size: 14px;
    align-items: center;
  }

  .bnote-wrapper .responsive-author-info a{
    margin-left: 20px;
  }  

  .blog-wrapper .all-articles-list button,
  .bnote-wrapper .blog-article button, 
  .blog-wrapper .blog-article button {
    height: 50px;
  }

  .bnote-wrapper .blog-sidebar .sticky{
    display: none;
  }

  .bnote-wrapper .blog-sidebar{
    width: 100%;
    margin: 0;
    margin-top: 40px;
    max-width: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
  }

  .bnote-wrapper .blog-sidebar h3, 
  .bnote-wrapper .blog-sidebar hr{
    width: 100%;
  }

  .bnote-wrapper .blog-sidebar .blog-article{
    max-width: 302px;
    width: 49%;
  }

  .bnote-wrapper .featured-content a.see-more{
    font-size: 16px;
    max-height: 50px;
  }

  .bnote-wrapper .yma-container{
    width: 100%;
    max-width: none;
    margin-top: 35px;
  }

  .bnote-wrapper #yma-blog .featured-card{
    max-width: 350px;
    margin: 0 10px;
    margin-bottom: 40px;
    justify-self: center;
  }

  .bnote-wrapper .yma-container ul{
    flex-wrap: wrap;
    justify-content: center;
  }
  .bnote-wrapper .main-blog .main h3{
    font-size: 20px;
  }
}


@media screen and (max-width:600px) {
  .bnote-wrapper .main-blog, 
  .bnote-wrapper .you-might-also{
    padding: 50px 20px;
    padding-bottom: 20px;
  }

  .bnote-wrapper .blog-sidebar .blog-article{
    width: 100%;
    max-width: none;
  }

  .bnote-wrapper .you-might-also .featured-card{
    margin: 0;
    margin-bottom: 40px;
    max-width: none;
  }  
}

@media screen and (max-width:480px) {
  .bnote-wrapper .main-blog .main h3{
    font-size: 19px;
  }

  .bnote-wrapper .featured-content a.see-more {
    min-width: 100%;
  }
}