﻿

    .upcoming-row{
        display:flex;
    }

        .upcoming-row .img-con,
         .upcoming-row .txt-con{
        flex:1 0 0;
        max-width:50%;
    }


        .upcoming-row .img-con {
            aspect-ratio:1/1
        }


                .upcoming-row .img-con img {
        width:100%;
        height:100%;
        object-fit:cover;
        }



 .upcoming-row .txt-con  {
         display:flex;
         align-items:flex-end;
         background-color:#ddd;
        }
  .upcoming-row .txt-con .txt {
      padding:45px;
        }




  
  .upcoming-row .txt-con .head1 {
            font-size: 36px;
            font-weight: 400;
            line-height:1em;
            padding: 0;
            margin: 0;
            color:#000;
        }

          

 

  .upcoming-row .txt-con .tag {
           background-color:#555;
           display:inline-block;
           color:#Fff;
           font-size:14px;
           padding:3px 45px;
           margin-bottom:20px;
        }

                


  .upcoming-row .txt-con .desc {
            font-size: 18px;
            font-weight:200;
            padding: 0;
            margin: 20px 0 30px 0;
        }







  .index-about-row{
      background-color:#222;
      color:#fff;
      display:flex;
  }

  .index-about-row .txt-con{
     
      display:flex;
      align-items:center;
      justify-content:flex-end;
      flex:1 0 0;
      max-width:50%;
      position:relative;
      overflow:hidden;
  }
    .index-about-row .img-con{

      flex:1 0 0;
      max-width:50%;
      position:relative;
      aspect-ratio:3/2;
  }

    .index-about-row .img-con video,
        .index-about-row .img-con img{
        position:absolute;
        top:0;
        right:0;
        width:100%;
        height:100%;
        object-fit:cover;
        z-index:8
    } 
  

      .index-about-row .txt-con .txt{
     padding:45px 0;
     position:relative;
     z-index:10
  }



        .index-about-row .txt-con .txt .head {
            font-size: 24px;
            margin: 0;
            font-weight: 400;
        }
        .index-about-row .txt-con .txt .desc {
            font-size: 16px;
            margin:30px  0;
            font-weight: 200;
        }


        .index-about-row .txt-con .txt .more {
            font-size: 16px;
            font-weight: 200;
            color: #fff;
            display: inline-block;
            border-bottom: 1px solid #fff;
            transition: all 0.3s;
        }

        .index-about-row .txt-con .txt .more:hover {
            color: #dc272e;
            border-bottom: 1px solid #dc272e;
        }

          .index-about-row .txt-con .bg{
      position:absolute;
        top:0;
        right:0;
        width:100%;
        height:100%;
        z-index:8;
        opacity:0.06;
        transform:scale(2) translate(-15%, 25%)
  }

          .index-about-row .txt-con .bg img{

        width:100%;
        height:100%;
        object-fit:contain;
       

  }





          .index-blog-row{
              display:grid;
              grid-template-columns: repeat(2, 1fr);
    display: grid;
    grid-column-gap: 30px;
    grid-row-gap: 30px;

          }

          .index-blog-row .blog-item{
             display:flex;
                 align-items:flex-end;
          }



              .index-blog-row .blog-item .img-con{
            width:110px;
            height:110px;
            min-width:110px;
            margin-right:15px;
            position:relative;
          }

                            .index-blog-row .blog-item .img-con img{
            position:absolute;
        top:0;
        right:0;
        width:100%;
        height:100%;
        object-fit:cover;
          }



              .index-blog-row .blog-item .txt-con{
           flex-grow:1;
          }

          
              .index-blog-row .blog-item .txt-con .head{
          color:#000;
          font-size:16px;
          font-weight:400;
          margin:0;
          }    

                            .index-blog-row .blog-item .txt-con .date{

          font-size:12px;
          font-weight:200;
          margin-top:5px;
          }    




@media(max-width:1199px) {
       

}

@media(max-width:991px) {
         
}



@media(max-width:767px) {


    
    .upcoming-row{
        flex-direction:column;
    }

        .upcoming-row .img-con,
         .upcoming-row .txt-con{
        min-width:100%;
        max-width:100%;
    }




  .upcoming-row .txt-con .txt {
      padding:20px;
        }




  
  .upcoming-row .txt-con .head1 {
            font-size: 24px;
            
        }

          

 

  .upcoming-row .txt-con .tag {

           font-size:10px;
           padding:3px 30px;
           margin-bottom:15px;
        }

                


  .upcoming-row .txt-con .desc {
            font-size: 14px;

            margin: 15px 0 20px 0;
        }







  .index-about-row{
     flex-wrap:wrap;
  }

  .index-about-row .txt-con{

min-width:100%;
      max-width:100%;

  }
    .index-about-row .img-con{
min-width:100%;
      max-width:100%;

  }

  

      .index-about-row .txt-con .txt{
     padding:40px 0;

  }



        .index-about-row .txt-con .txt .head {
            font-size: 20px;

        }
        .index-about-row .txt-con .txt .desc {
            font-size: 12px;
            margin:20px  0;

        }


        .index-about-row .txt-con .txt .more {
            font-size: 14px;
            
        }






          .index-blog-row{
              grid-template-columns: repeat(1, 1fr);
    grid-column-gap: 15px;
    grid-row-gap: 15px;

          }



              .index-blog-row .blog-item .img-con{
            width:75px;
            height:75px;
            min-width:75px;
            margin-right:10px;
     
          }




          
              .index-blog-row .blog-item .txt-con .head{

          font-size:12px;
       
          }    

                            .index-blog-row .blog-item .txt-con .date{

          font-size:9px;
          margin-top:3px;

          }    


}