.blog-section {
  margin-bottom: 64px;
}

.blog-section .blog-container .blog-carousel{
  margin: 0;
}

.blog-section .blog-container .blog-carousel .owl-stage-outer .owl-stage{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 32px;
}

.blog-section .blog-container .blog-carousel .owl-stage-outer .owl-stage .owl-item{
  margin: 0 !important;
  width: 100% !important;
}

.blog-section .blog-container .blog-carousel .owl-nav,
.blog-section .blog-container .blog-carousel .owl-dots {
    display: none;
}
/* blog title home */
.blog-section-title {
  font-family: var(--font-family);
  font-style: normal;
  font-weight: 400 !important;
  font-size: var(--headline-3-font-size) !important;
  line-height: var(--headline-3-line-height)!important;
}

.blog-txts {
  color: var( --gray-scale-900);
}

.blog-image-card .blog-date {
  font-family: var(--font-family-bold);
  font-weight: var(--caption-bold-font-weight);
  color:var(--gray-scale-800-main);
  font-size: var(--caption-2-bold-font-size);
  line-height: var(--caption-2-bold-line-height);
  letter-spacing: 0.5px;
  margin: 20px 0 !important;
}

.blog-txts .blog-title {
  font-family: var(--font-family-narrow-medium);
  font-style: normal;
  font-weight: 500;
  color: var(--gray-scale-800-main);
  font-size:  var(--headline-4-font-size);
  line-height: var(--headline-4-line-height);
  letter-spacing: 1px;
  margin: 0 0 15px 0;
}

.blog-txts .blog-description {
  font-family: var(--font-family);
  font-style: normal;
  font-weight: 400;
  font-size:  var(--caption-font-size);
  color: var(--gray-scale-900) ;
  line-height: var(--caption-line-height);
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

.blog-txts .blog-btn {
  font-family: var(--font-family-bold);
  font-style: normal;
  font-size: var(--button-font-size);
  line-height: 20px;
  letter-spacing: 1.25px;
  text-transform: none;
  color: var(--gray-scale-800-main);
  position: relative;
  width: fit-content;
  display: flex;
  align-items: center;
  padding-right: 15px;
}

.blog-txts .blog-btn:after {
  content: "";
  border: solid var( --gray-scale-900);
  border-width: 0 1.5px 1.5px 0;
  padding: 3px;
  transform: rotate(315deg);
  display: inline-block;
  margin-left: 10px;
  z-index: 100;
}

.blog-txts .blog-btn:hover {
  color: var( --modern-gold-600);
}

.blog-txts .blog-btn:hover:after {
  content: "";
  border: solid var( --modern-gold-600);
  border-width: 0 2px 2px 0;
  padding: 3px;
  transform: rotate(315deg);
  display: inline-block;
  margin-left: 10px;
  z-index: 100;
}

.blog-image {
  width: 100%;
  object-fit: cover;
}

#myCarouselblog{
  display: none;
  margin-bottom: 64px;
}

#myCarouselblog .slider-home-arrow{
  position: relative;
  top: -75px;
  right: 5%;
}

#myCarouselblog .slider-home-arrow .carousel-control{
  z-index: 15;
  background-image: none;
  opacity: 1;
  height: fit-content;
}

#myCarouselblog .slider-home-arrow .carousel-control.left{
  right: 40px;
  left: auto;
}

#myCarouselblog .slider-home-arrow .carousel-control .glyphicon-chevron-right,
#myCarouselblog .slider-home-arrow .carousel-control .glyphicon-chevron-left{
  background-position: center;
  width: 40px;
  height: 40px;
  background-size: cover;
  background-repeat: no-repeat;
  top: 50%;
  left: 0;
  right: 0;
  margin: 0;
}

#myCarouselblog .slider-home-arrow .carousel-control .glyphicon-chevron-right{
  left: unset;
  transform: rotate(360deg);
}

#myCarouselblog .slider-home-arrow .carousel-control .glyphicon-chevron-left{
  transform: rotate(180deg);
}

#myCarouselblog .slider-home-arrow .carousel-control .glyphicon-chevron-right:before,
#myCarouselblog .slider-home-arrow .carousel-control .glyphicon-chevron-left:before{
  content: none;
}

#myCarouselblog .carousel-inner .slider-home-card{
  max-height: 500px;
  min-height: 430px;
  height: 82vw;
  background-position: center top;
  background-size: 15%;
  background-repeat: no-repeat;
}

#myCarouselblog .carousel-inner .slider-home-card .slider-home-container .carousel-caption{
  right: unset;
  left: unset;
  width: 100%;
  height: 100%;
}

#myCarouselblog .carousel-inner .slider-home-card .slider-home-container .carousel-caption .slider-inner-container .slider-home-sub{
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  padding: 0;
}

#myCarouselblog .carousel-inner .slider-home-card .slider-home-container .carousel-caption .slider-inner-container .slider-home-sub .tg-blog{
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 2;
}

#myCarouselblog .carousel-inner .slider-home-card .slider-home-container .carousel-caption .slider-inner-container .slider-home-sub:hover .blog-btn{
  color: var(--modern-gold-400-main);
}

#myCarouselblog .carousel-inner .slider-home-card .slider-home-container .carousel-caption .slider-inner-container .slider-home-sub:hover .blog-btn:after{
  border-color: var(--modern-gold-400-main);
}

#myCarouselblog .carousel-inner .slider-home-card .slider-home-container .carousel-caption .slider-inner-container .slider-home-sub .blog-image-slider{
  width: 100%;
  height: 40vw;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  margin-bottom: 16px;
  position: relative;
}

#myCarouselblog .carousel-inner .slider-home-card .slider-home-container .carousel-caption .slider-inner-container .slider-home-sub .blog-image-slider .yellow-overlay{
  height: 100%;
}

#myCarouselblog .carousel-inner .slider-home-card .slider-home-container .carousel-caption .slider-inner-container .slider-home-sub:hover .blog-image-slider .yellow-overlay{
  opacity: 1;
}

#myCarouselblog .carousel-inner .slider-home-card .slider-home-container .carousel-caption .slider-inner-container .slider-home-sub .blog-date,
#myCarouselblog .carousel-inner .slider-home-card .slider-home-container .carousel-caption .slider-inner-container .slider-home-sub .blog-title,
#myCarouselblog .carousel-inner .slider-home-card .slider-home-container .carousel-caption .slider-inner-container .slider-home-sub .blog-description,
#myCarouselblog .carousel-inner .slider-home-card .slider-home-container .carousel-caption .slider-inner-container .slider-home-sub .blog-btn{
  width: 100%;
  margin: 0;
  text-align: left;
  color: var( --gray-scale-900);
  text-shadow: none;
}

#myCarouselblog .carousel-inner .slider-home-card .slider-home-container .carousel-caption .slider-inner-container .slider-home-sub .blog-date{
  font-family: var(--font-family-narrow-regular);
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 1px;
  color: var( --gray-scale-900);
}

#myCarouselblog .carousel-inner .slider-home-card .slider-home-container .carousel-caption .slider-inner-container .slider-home-sub .blog-title{
  font-family: var(--font-family-narrow-regular);
  font-size:  var(--headline-4-font-size);
 line-height: var(--headline-4-line-height);
  letter-spacing: 0.5px;
  margin-bottom: 8px;
}

#myCarouselblog .carousel-inner .slider-home-card .slider-home-container .carousel-caption .slider-inner-container .slider-home-sub .blog-description{
  font-family: var(--font-family-narrow-regular);
 font-size:  var(--caption-font-size);
  line-height: 22px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  letter-spacing: 0.4px;
  color: var(--gray-scale-600);
  margin-bottom: 16px;
}

#myCarouselblog .carousel-inner .slider-home-card .slider-home-container .carousel-caption .slider-inner-container .slider-home-sub .blog-btn{
  color: var( --gray-scale-900);
  font-family: var(--button-font-size);
  font-size:  var(--caption-font-size);
  line-height: var(--caption-line-height);
  letter-spacing: 1.25px;
  text-decoration: none;
  box-shadow: none;
}

#myCarouselblog .carousel-inner .slider-home-card .slider-home-container .carousel-caption .slider-inner-container .slider-home-sub .blog-btn:hover{
  color: var(--modern-gold-400-main);
}

#myCarouselblog .carousel-inner .slider-home-card .slider-home-container .carousel-caption .slider-inner-container .slider-home-sub .blog-btn:after{
  content: "";
  border: solid var( --gray-scale-900);
  border-width: 0 1.5px 1.5px 0;
  padding: 3px;
  transform: rotate(315deg);
  display: inline-block;
  margin-left: 10px;
  z-index: 100;
}

#myCarouselblog .carousel-inner .slider-home-card .slider-home-container .carousel-caption .slider-inner-container .slider-home-sub .blog-btn:hover:after{
  border-color: var(--modern-gold-400-main);
}

#myCarouselblog .carousel-inner .slider-dots .carousel-indicators{
  top: unset !important;
  left: unset !important;
  width: 90vw;
  text-align: left;
  margin: 0 auto;
  position: relative;
}

#myCarouselblog .carousel-inner .slider-dots .carousel-indicators .indicator-lines{
  border-radius: 0;
  width: 48px;
  height: 2px;
  background-color: var(--gray-scale-600);
}

.carousel-col4Desktop .owl-dots .owl-dot.active {
  background: var(--modern-gold-400-main);
}

.carousel-col4Desktop .owl-dots .owl-dot {
  border-radius: 0;
  width: 48px;
  height: 2px;
}

.carousel-col4Desktop.owl-carousel .owl-item .blog-card {
  position: relative;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.carousel-col4Desktop.owl-carousel .owl-item .blog-card .tg-blog{
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 2;
}

.carousel-col4Desktop.owl-carousel .owl-item .blog-card:hover .blog-txts .blog-btn{
  color: var( --modern-gold-600);
}

.carousel-col4Desktop.owl-carousel .owl-item .blog-card:hover .blog-txts .blog-btn:after{
  border-color: var( --modern-gold-600);
}

.carousel-col4Desktop.owl-carousel .owl-item .blog-image-card .image-container{
  display: flex;
  max-height: 320px;
  position: relative;
}

.carousel-col4Desktop.owl-carousel .owl-item .blog-image-card .yellow-overlay{
  height: 100%;
  cursor: pointer;
}

.carousel-col4Desktop.owl-carousel .owl-item .blog-card:hover .blog-image-card .yellow-overlay{
  opacity: 1;
}

@media only screen and (min-width: 768px) {
    .blog-section-title {
        margin: 0 0 25px 0 !important;
    }
}

@media screen and (max-width: 767px) {
    .blog-section{
        margin-bottom: 32px;
    }
    .blog-section .blog-carousel{
        display: none;
    }
    .blog-section .blog-container .blog-card {
        margin: 0 10% !important;
    }
    .blog-section .blog-container .blog-carousel {
        margin: 0;
    }
    #myCarouselblog{
        display: block;
    }
}