/*------------------------------------------------------------------------
# mod_mx_awoseme-news Extension
# ------------------------------------------------------------------------
# author    mixwebtemplates
# copyright Copyright (C) 2020 mixwebtemplates.com. All Rights Reserved.
# @license - http://www.gnu.org/licenses/gpl-2.0.html GNU/GPL
# Websites: http://www.mixwebtemplates.com
-------------------------------------------------------------------------*/

:root {
	--mxtawe-color: #FD8900;
}
.mos-img img {display: none !important;}

.mx-awesome12 {
 border-radius:20px
}
.mx-awesome12 .blog-img {
 margin-bottom:-75px
}
.bg-mask {
 -webkit-mask-size:100% 100%;
 mask-size:100% 100%;
 -webkit-mask-repeat:no-repeat;
 mask-repeat:no-repeat
}
.mx-awesome12 .blog-content {
 box-shadow:0px 0px 15px rgba(0,0,0,0.04);
 border-radius:30px 95px 30px 30px;
 background-color: #f6f6f6;
 padding:30px;
 position:relative;
 z-index:3
}
.mx-awesome12 .box-title {
  font-size: 25px;
  margin-bottom: 8px;
  font-weight: bold;
  line-height: 1;
}
.mx-awesome12 .box-title a {
 background-image:-webkit-linear-gradient(right, var(--mxtawe-color), var(--mxtawe-color));
 background-image:linear-gradient(to left, var(--mxtawe-color), var(--mxtawe-color));
 background-repeat:no-repeat;
 background-position:bottom left;
 background-size:0 2px;
 color: inherit;
 -webkit-transition:0.5s ease-in-out;
 transition:0.5s ease-in-out
}
.mx-awesome12 .box-title a:hover {
 background-size:100% 2px
}
.mx-awesome12 .blog-img {
 overflow:hidden
}
.mx-awesome12 .blog-img img {
 width:100%;
 -webkit-transition:0.4s ease-in-out;
 transition:0.4s ease-in-out
}
.mx-awesome12 .blog-meta {
 margin:-0.4em 0 5px 0
}
.mx-awesome12 .blog-meta span>i,
.mx-awesome12 .blog-meta a>i {
 color:var(--mxtawe-color)
}
.mx-awesome12 .blog-meta {
 display:block
}
.mx-awesome12 .blog-meta span,
.mx-awesome12 .blog-meta a {
 display:inline-block;
 font-size:15px;
 color: #222;
 position:relative;
 margin-right:10px
}
.mx-awesome12 .blog-meta span i,
.mx-awesome12 .blog-meta a i {
 margin-right:6px;
 color:var(--mxtawe-color)
}
.mx-awesome12 .blog-meta span:last-child,
.mx-awesome12 .blog-meta a:last-child {
 margin-right:0
}
.mx-awesome12 .blog-meta span:not(:last-child),
.mx-awesome12 .blog-meta a:not(:last-child) {
 padding-right:20px
}
.mx-awesome12 .blog-meta span:not(:last-child):after,
.mx-awesome12 .blog-meta a:not(:last-child):after {
 content:"";
 height:16px;
 width:1px;
 background-color:#d8dde1;
 position:absolute;
 top:50%;
 right:0;
 margin-top:-8px
}
.mx-awesome12 .blog-meta .author img {
 border-radius:50%;
 width:30px;
 height:30px;
 margin-right:6px
}
.mx-awesome12 .blog-meta a:hover {
 color:var(--mxtawe-color)
}
@media (max-width: 1199px) {
 .mx-awesome12 .blog-meta span,
 .mx-awesome12 .blog-meta a {
  margin-right:15px
 }
 .mx-awesome12 .blog-meta span:not(:last-child),
 .mx-awesome12 .blog-meta a:not(:last-child) {
  padding-right:15px
 }
}
@media (max-width: 575px) {
 .mx-awesome12 .blog-meta span,
 .mx-awesome12 .blog-meta a {
  margin-right:20px
 }
 .mx-awesome12 .blog-meta span:not(:last-child),
 .mx-awesome12 .blog-meta a:not(:last-child) {
  padding-right:0
 }
 .mx-awesome12 .blog-meta span:not(:last-child):after,
 .mx-awesome12 .blog-meta a:not(:last-child):after {
  display:none
 }
}
.mx-awesome12:hover .blog-img img {
 -webkit-transform:scale(1.08);
 -ms-transform:scale(1.08);
 transform:scale(1.08)
}
@media (max-width: 1299px) {
 .mx-awesome12 .blog-img {
  margin-bottom:-60px
 }
 .mx-awesome12 .blog-content {
  padding:20px
 }
}
@media (max-width: 1199px) {
 .mx-awesome12 .blog-img {
  margin-bottom:-75px
 }
 .mx-awesome12 .blog-content {
  padding:30px;
  border-radius:30px 90px 30px 30px
 }
}
@media (max-width: 991px) {
 .mx-awesome12 .blog-img {
  margin-bottom:-55px
 }
 .mx-awesome12 .box-title {
  font-size:20px
 }
 .mx-awesome12 .blog-content {
  padding:20px;
  border-radius:30px 70px 30px 30px
 }
}
@media (max-width: 767px) {
 .mx-awesome12 .blog-img {
  margin-bottom:-87px
 }
 .mx-awesome12 .blog-content {
  padding:30px;
  border-radius:30px 106px 30px 30px
 }
 .mx-awesome12 .box-title {
  font-size:24px
 }
}
@media (max-width: 575px) {
 .mx-awesome12 .blog-img {
  margin-bottom:-66px
 }
 .mx-awesome12 .blog-content {
  padding:30px;
  border-radius:20px 80px 20px 20px
 }
}
@media (max-width: 410px) {
 .mx-awesome12 .blog-img {
  margin-bottom:-58px
 }
 .mx-awesome12 .box-title {
  font-size:22px
 }
 .mx-awesome12 .blog-content {
  border-radius:20px 70px 20px 20px
 }
}
@media (max-width: 350px) {
 .mx-awesome12 .blog-img {
  margin-bottom:-50px
 }
 .mx-awesome12 .blog-content {
  padding:18px
 }
 .mx-awesome12 .box-title {
  font-size:20px
 }
}
.th-btn {
 position:relative;
 z-index:2;
 overflow:hidden;
 vertical-align:middle;
 display:inline-block;
 border:none;
 text-transform:uppercase;
 text-align:center;
 background-color:var(--mxtawe-color);
 color:#fff;
 font-size:14px;
 font-weight:600;
 line-height:1;
padding: 16px 25px;
min-width: 152px;
 border-radius:30px;
 -webkit-perspective:320px;
 perspective:320px
}
.th-btn:before {
 content:"";
 position:absolute;
 height:100%;
 bottom:0;
 left:0;
 width:100%;
 background-color:var(--title-color);
 z-index:-1;
 -webkit-transition:all 0.4s ease-out;
 transition:all 0.4s ease-out;
 border-radius:inherit;
 -webkit-transform:scaleX(0.8) scaleY(0);
 -ms-transform:scaleX(0.8) scaleY(0);
 transform:scaleX(0.8) scaleY(0);
 -webkit-transform-origin:top center;
 -ms-transform-origin:top center;
 transform-origin:top center
}
.th-btn i {
 font-size:0.95em
}
.th-btn:hover,
.th-btn.active {
 color:#fff;
 box-shadow:none
}
.th-btn:hover::before,
.th-btn:hover:after,
.th-btn.active::before,
.th-btn.active:after {
 -webkit-transform:scaleX(1) scaleY(1);
 -ms-transform:scaleX(1) scaleY(1);
 transform:scaleX(1) scaleY(1)
}
.mx-awesome12 .blog-card .th-btn {
 background-image:-webkit-linear-gradient(left, #F25517 0%, #FD8900 100%);
 background-image:linear-gradient(to right, #F25517 0%, #FD8900 100%)
}
.mx-awesome12 .blog-card .th-btn:after {
 content:'';
 position:absolute;
 inset:1px;
 background-color:#010407;
 border-radius:inherit;
 z-index:-2
}
.mx-awesome12 .blog-card .th-btn:before {
 background-image:-webkit-linear-gradient(left, #F25517 0%, #FD8900 100%);
 background-image:linear-gradient(to right, #F25517 0%, #FD8900 100%)
}
.mx-awesome12 .blog-card .th-btn:hover {
 color:#fff
}