/* ------------------------------------------------------------- Sass CSS3 Mixins! The Cross-Browser CSS3 Sass Library By: Matthieu Aussaguel, http://www.mynameismatthieu.com, @matthieu_tweets List of CSS3 Sass Mixins File to be @imported and @included as you need The purpose of this library is to facilitate the use of CSS3 on different browsers avoiding HARD TO READ and NEVER ENDING css files note: All CSS3 Properties are being supported by Safari 5 more info: http://www.findmebyip.com/litmus/#css3-properties
------------------------------------------------------------- */
#blog-list-page { width: 100%; float: left; }
#blog-list-page .topics { background-color: #2d2b2c; text-align: center; }
#blog-list-page .topics ul { padding: 0; list-style: none; margin: 13px 0; }
#blog-list-page .topics ul li { display: inline-block; background-color: #514f50; padding: 14px 0; min-width: 185px; margin: 5px; color: #e6e6e6; border-radius: 8px; text-transform: uppercase; cursor: pointer; font-weight: 500; }
#blog-list-page .topics ul li:hover, #blog-list-page .topics ul li.active { background-color: #1e9fbe; }
#blog-list-page .page-head { background-color: #1e9fbe; }
#blog-list-page .page-head .gradient-bg { height: 80px; position: absolute; left: 0; right: 0; top: 0; background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(45, 43, 33, 0.3)), to(rgba(45, 43, 33, 0))); background-image: -webkit-linear-gradient(top, rgba(45, 43, 33, 0.3), rgba(45, 43, 33, 0)); background-image: -moz-linear-gradient(top, rgba(45, 43, 33, 0.3), rgba(45, 43, 33, 0)); background-image: -ms-linear-gradient(top, rgba(45, 43, 33, 0.3), rgba(45, 43, 33, 0)); background-image: -o-linear-gradient(top, rgba(45, 43, 33, 0.3), rgba(45, 43, 33, 0)); background-image: linear-gradient(top, rgba(45, 43, 33, 0.3), rgba(45, 43, 33, 0)); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='rgba(45, 43, 33, 0.3)', endColorStr='rgba(45, 43, 33, 0)'); }
#blog-list-page .page-head .img-container { position: absolute; top: 0; bottom: 0; left: 0; width: 65%; }
#blog-list-page .page-head .img-container .img { position: absolute; top: 0; bottom: 0; left: 15px; right: 0; background-image: url(../img/blog/page-header.png); background-size: cover; background-position: top center; }
#blog-list-page .page-head .title { width: 35%; float: right; color: #e6e6e6; text-transform: uppercase; padding-left: 75px; }
#blog-list-page .page-head .title p { margin-top: 75px; }
#blog-list-page .page-head .title h2 { font-size: 30px; margin-top: 40px; }
#blog-list-page .page-head .title .read-more-button { color: #f6f6f6; margin: 60px 0 75px 0; display: inline-block; padding: 15px 0; border: 1px solid #f6f6f6; min-width: 180px; border-radius: 8px; font-weight: 500; text-align: center; }
#blog-list-page .page-head .title .read-more-button:hover, #blog-list-page .page-head .title .read-more-button:focus, #blog-list-page .page-head .title .read-more-button:active { box-shadow: #115564 0px 0px 15px 3px inset; color: #fff; }
#blog-list-page .blog-list { background-color: #191718; text-align: center; text-transform: uppercase; padding: 55px 0 55px 0; }
#blog-list-page .blog-list #blogListCarousel { display: block; max-width: 1050px; margin: auto; }
#blog-list-page .blog-list .single-blog { width: 33.333333%; display: inline-block; padding: 26px 13px; float: left; }
#blog-list-page .blog-list .single-blog:nth-child(3n+1) { clear: both; }
#blog-list-page .blog-list .single-blog .inner { display: inline-block; background-color: #4e4e4e; color: #f6f6f6; }
#blog-list-page .blog-list .single-blog .inner img { width: 100%; }
#blog-list-page .blog-list .single-blog .inner h3, #blog-list-page .blog-list .single-blog .inner p { padding: 0 10px; }
#blog-list-page .blog-list .single-blog .inner p { margin-top: 30px; }
#blog-list-page .blog-list .single-blog .inner h3 { margin: 60px 0 30px 0; font-size: 30px; }
#blog-list-page .blog-list .single-blog a.read-more-button { color: #f6f6f6; margin: 35px 0 40px 0; display: inline-block; padding: 10px 0; border: 1px solid #f6f6f6; min-width: 180px; border-radius: 8px; font-weight: 500; }
#blog-list-page .blog-list .single-blog a.read-more-button:hover, #blog-list-page .blog-list .single-blog a.read-more-button:active, #blog-list-page .blog-list .single-blog a.read-more-button:focus { background-color: #1e9fbe; border: 1px solid #1e9fbe; }
#blog-list-page .blog-list .load-more-articles { text-align: center; margin-top: 65px; font-size: 17px; }
#blog-list-page .blog-list .load-more-articles a { color: #f6f6f6; }

@media only screen and (max-width: 991px) { #blog-list-page .page-head .img-container { position: relative; width: 100%; height: 60vw; }
  #blog-list-page .page-head .title { width: 100%; padding: 0 20px; text-align: center; }
  #blog-list-page .page-head .title p { margin-top: 20px; }
  #blog-list-page .page-head .img-container .img { left: 0; }
  #blog-list-page .page-head .title h2 { font-size: 27px; margin-top: 25px; }
  #blog-list-page .page-head .title .read-more-button { margin: 10px 0 30px 0; display: inline-block; padding: 6px 0; border: 1px solid #f6f6f6; min-width: 147px; }
  #blog-list-page .blog-list .single-blog { width: 33.3333333%; float: left; } }
@media only screen and (max-width: 767px) { #blog-list-page .topics ul { display: none; }
  #blog-list-page .page-head .img-container { height: 85vw; }
  #blog-list-page .blog-list .single-blog { width: 100%; }
  #blogListCarousel .owl-nav { margin-top: 0; }
  #blogListCarousel .owl-nav span { font-size: 30px; color: #1e9ebb; }
  #blogListCarousel.owl-theme .owl-nav [class*='owl-'] { background: transparent; margin: 0; }
  #blogListCarousel.owl-theme .owl-nav [class*='owl-']:hover { background: transparent; } }

/*# sourceMappingURL=blog-list.css.map */
