/* ******************************
:: 21.0 BLOG AREA CSS
****************************** */
.f30 {
  font-size: 30px;
}
.blog-area {
  z-index: 1;
}

.single-blog {
  background-color: #fff;
  -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
  border-radius: 6px;
  margin-bottom: 15px;
}
.single-blog ul li {
  list-style: none;
}
.single-blog ul {
  margin-left: 0px;
  padding-left: 0px;
}
.blog-thumb img {
  display: block;
  width: 100%;
  border-radius: 6px;
}

.blog-content > p {
  line-height: 1.8;
}

.blog-btn {
  position: relative;
  display: inline-block;
}

.blog-btn::after {
  position: absolute;
  content: '\f101';
  font-weight: 900;
  font-family: 'Font Awesome 5 Free';
  opacity: 0;
  visibility: hidden;
  top: 50%;
  -webkit-transform: translateX(3px) translateY(-50%);
  transform: translateX(3px) translateY(-50%);
  -webkit-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s;
}

.blog-btn:hover::after,
.blog-btn:focus::after {
  visibility: visible;
  opacity: 1;
  top: 50%;
  -webkit-transform: translateX(5px) translateY(-50%);
  transform: translateX(5px) translateY(-50%);
}

.single-blog:hover {
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
  box-shadow: 0 5px 8px rgba(0, 0, 0, 0.1);
}

/* ******************************
:: 22.0 BREADCRUMB AREA CSS
****************************** */
.breadcrumb-area {
  height: 450px;
  z-index: 1;
}

.breadcrumb-content > h3 {
  font-size: 38px;
}

.breadcrumb {
  background-color: transparent;
  margin: 0;
}

.breadcrumb-item + .breadcrumb-item::before {
  content: '>';
  color: #fff;
}

.blog .breadcrumb-item > a,
.blog .breadcrumb-item,
.blog .breadcrumb-item::before,
.blog .breadcrumb-item.active {
  color: #fff;
}

/* ******************************
:: 23.0 BLOG PAGE AREA CSS
****************************** */
.blog .navbar-light .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='rgba(255, 255, 255, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.blog .single-blog {
  margin-bottom: 45px;
}

.pagination > li > a {
  font-size: 14px;
  height: 40px;
  width: 40px;
  line-height: 40px;
  display: inline-block;
  border: 1px solid #444;
  color: #444;
  text-align: center;
}

.pagination li:first-child a,
.pagination li:last-child a {
  display: block;
  border: none;
  position: relative;
}

.pagination li:first-child:hover a,
.pagination li:last-child:hover a {
  background: none;
  color: inherit;
  border: none;
}

.pagination li:first-child:hover a {
  -webkit-transform: translateX(-4px);
  transform: translateX(-4px);
}

.pagination li:last-child:hover a {
  -webkit-transform: translateX(4px);
  transform: translateX(4px);
}

/* **********************************
:: 24.0 BLOG PAGE DETAILS AREA CSS
*************************************/
/*Single Widget*/
.single-widget {
  margin-bottom: 35px;
}

.sidebar .single-widget:last-child {
  margin-bottom: 0;
}

.widget-content {
  position: relative;
}

/*Search Widget*/
.search-widget input {
  background-color: #f7f7f7;
  border: 1px solid #eee;
  color: #444;
  height: 45px;
  padding: 10px 15px;
  width: 100%;
  -webkit-transition: -webkit-box-shadow 1s ease 0s;
  transition: -webkit-box-shadow 1s ease 0s;
  transition: box-shadow 1s ease 0s;
  transition: box-shadow 1s ease 0s, -webkit-box-shadow 1s ease 0s;
}

.search-widget input:focus {
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
}

/*Catagory Widget*/
.widget .single-accordion {
  border: 1px solid #eee;
  border-radius: 4px;
}

.widget .single-accordion h5 a {
  color: #444;
  border-bottom: 1px solid #eee;
}

.widget-items li a {
  position: relative;
  border-bottom: 1px solid #eee;
}

.widget-items li a.active {
  color: #7c4fe0;
}

.widget-items li a::before {
  position: absolute;
  content: '';
  height: 100%;
  width: 0px;
  top: 0;
  bottom: 0;
  left: 0;
  background-color: transparent;
  -webkit-transition: all 0.1s ease 0s;
  transition: all 0.1s ease 0s;
}

.widget-items li a:hover,
.widget-items li a:focus,
.widget-items li a.active {
  background-color: #f7f7f7;
}

.widget-items li a:hover::before,
.widget-items li a:focus::before,
.widget-items li a.active::before {
  width: 2px;
  background-color: #7c4fe0;
}

.widget-items li a span {
  line-height: 1.4;
}

/*Post Widget*/
.post-thumb img {
  border: 1px solid #eee;
}

.post-widget .widget-items .post-date {
  font-size: 13px;
  line-height: 1;
}

.post-content h6 {
  font-weight: 400;
  line-height: 20px;
}

/*Tags Widget*/
.tags-widget .single-accordion {
  border: none;
}

.tags-widget-items a {
  border: 1px solid #e5e5e5;
  font-size: 12px;
}

/*Blog Details*/
.sApp-blog .meta-info {
  border-bottom: 1px solid #eee;
}

.meta-info > ul > li {
  position: relative;
}

.meta-info > ul > li::after {
  position: absolute;
  content: '';
  height: 30%;
  width: 2px;
  background-color: #777;
  top: 50%;
  left: 100%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.meta-info > ul > li:last-child::after {
  display: none;
}

.sApp-blog .blog-share a {
  padding: 0 10px;
}

.blog-share .social-icons > a {
  width: 35px;
  height: 35px;
  font-size: 16px;
}

.blog-share .social-icons > a.facebook:hover {
  background-color: #3b5999 !important;
  color: #fff;
}

.blog-share .social-icons > a.twitter:hover {
  background-color: #55acee !important;
  color: #fff;
}

.blog-share .social-icons > a.google-plus:hover {
  background-color: #dd4b39 !important;
  color: #fff;
}

.blog-share .social-icons svg {
  line-height: 35px;
}

.blog-share .social-icons > a:hover svg:first-child {
  margin-top: -35px;
}

.sApp-blog .blog-details .blog-title > a {
  font-size: 24px;
}

.blockquote {
  background-color: #f7f7f7;
  position: relative;
}

.blockquote::after {
  position: absolute;
  content: '';
  height: 100%;
  width: 2px;
  top: 0;
  left: 0;
}

.blog-comments {
  margin-top: 20px;
}

.admin {
  border-top: 1px solid #e5e5e5;
}

.admin-thumb img,
.comments-thumb img {
  border: 1px solid #eee;
}

.comments,
.blog-contact {
  margin-left: 200px;
}

.single-comments {
  border: 1px solid #eee;
  margin-bottom: 1rem;
}

.single-comments:last-of-type {
  margin-bottom: 0;
}

.comments-content > h5 > a:last-child {
  font-size: 14px;
  font-weight: 500;
  color: #7c4fe0;
}

.contact-box.comment-box {
  text-align: left;
}

.contact-box.comment-box .form-group input {
  font-size: 15px;
  border: 1px solid #e5e5e5;
}

.contact-box.comment-box .form-group textarea {
  font-size: 15px;
  border: 1px solid #e5e5e5;
  height: 150px;
}

.recent-blog-area {
  padding-top: 80px;
}
.postdetails h1 {
  font-size: 25px;
}
.postdetails h2 {
  font-size: 22px;
  margin: 10px 0;
}
.postdetails h1:hover {
  color: #1abc9c;
}
.allPostLink {
  margin-top: 60px;
  text-align: center;
  font-weight: bold;
}
.allPostLink a {
  color: #ffffff;
  background: #1abc9c;
  padding: 10px 30px;
}
.blogheader {
  padding: 80px 0px;
  background: #e8f3ff;
  margin-bottom: 20px;
}
.single-post,
.search-results,
.blog {
  margin-top: 80px;
}
.single-post {
  margin-top: 100px;
}