body{font-family: 'Inter', sans-serif;}
A{cursor:pointer}
.navbar{background-color: #ffffff;}
.logo{padding:16px 0px;}
.btn-primary{background-color:#262626;border-color:#262626;border-radius:6px;}
.btn-primary:hover{background-color:#0e0e0e;border-color:#0e0e0e}

#artRes{

}

.main{display: flex;
  flex-wrap: nowrap;
 
position: relative;
  
  
  padding: 75px 0px 60px;
}
.sideMenu{width:240px;
  min-height:427px;
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  background-color: #F1F1F1;border-radius:12px;
justify-content:space-between;
height: calc(100vh - 95px);
position:sticky;
top:75px;}

.links{margin:0px;padding:0px;list-style-type: none;}
.links li{padding-bottom:10px;}
.links li.active A{background-color:#E2E2E2;}
.links li A{display:block;font-size:16px;text-decoration:none;color:#262626;padding:8px 8px 8px 32px;border-radius:8px;
background-repeat:no-repeat;background-position:4px center;background-size:24px}
.links li A:hover{text-decoration: underline;}
.links li.active A:hover{text-decoration:none;}
.brdBtm{border-bottom:1px solid #DDDDDD;margin-bottom:20px;}
.icon{display:inline-block;width:24px;height:24px;margin:0px 3px;}

.hero{background-color:#252628;
  color:#FBFBFB;padding:90px 60% 90px 60px;border-radius:16px;background-image:url('../images/hero.png');
background-position:right bottom;}
.categories {padding:40px 0px;border-bottom:1px solid #ECECEC;display: block;position: relative;height:40px;
  box-sizing:content-box;
}
.catHld{display:block;width:auto;position:absolute;width:750px;}

.categories A{background:#EBEBEB;
  text-decoration:none;
  display:inline-block;padding:6px 20px; margin:6px;border-radius:20px;font-size:14px;color:#262626;}
  .categories A.active{background-color:#262626;color:#F1F1F1}
  .article{border-bottom:1px solid #ECECEC}
  .article:last-child{border:0px;}
  .article a{color:#262626;text-decoration:none;}
  .article a:hover{text-decoration:underline}
.article a.more{font-weight: bold;background-image:url('../images/arrwBlck.svg');
background-repeat:no-repeat; padding-right:24px;background-position:right center}

.imgHld{display:block;height:307px;overflow:hidden;position:relative;border-radius:20px;}
.imgHld img{height:307px;width:auto;position:absolute}
.prod{font-size:14px;color:#646464; line-height:24px;}
.prod div{background-repeat:no-repeat;padding-left:30px;height:24px;background-position:left center;background-size:24px;}
  .cta{background-color:#242527;
    color:#FBFBFB;
    padding-bottom:60px;
    padding-top:381px;
background-image: url('../images/cta.png');
background-repeat:repeat-x;
background-position: top center;
  }
  .cta A{color:#FBFBFB;text-decoration:none;font-weight:600;background-image:url('../images/arrwWhite.svg');background-repeat: no-repeat;
  background-position: right 4px;padding-right:24px;}
  .cta A:hover{text-decoration: underline;}
  .date{font-size:14px; color:#646464}
  .date .artType{display:inline-block;background-color:#EDEDED;padding:6px 20px;margin-left:5px;border-radius:20px;}

  A.bckArw{text-decoration: none;font-weight:400;color:#262626;padding-left:20px;background-image:url('../images/arrwBck.svg');
  background-repeat:no-repeat;background-position: left center;;} 
  .footer{font-size:14px;}
.dtSmall{display: none;}
.mobHld{display: none;}
.mobMenu{display:block;width:50px;height:46px;position:relative;
  background-color:transparent;border:0px;
}
    .mobBtn {
     
      top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
      position: absolute;
      width: 20px;
    }
    .mobBtn:before,
  .mobBtn:after,
  .mobBtn div {
    background: #262626;
    content: "";
    display: block;
    height: 3px;
    border-radius: 3px;
    margin: 4px 0;
    transition: 0.5s;
  }
  
  
  .mobAct:before {
    transform: translateY(7px) rotate(135deg);
  }
  .mobAct:after {
    transform: translateY(-7px) rotate(-135deg);
  }
  .mobAct div {
    transform: scale(0);
  }
  .closeBtn{float:right;cursor:pointer;display: none;}
  .img-responsive{width:100%;}
  .opt1{background-image: url('../images/icn1.svg')}
  .opt2{background-image: url('../images/icn2.svg')}
  .opt3{background-image: url('../images/icn3.svg')}
  .opt4{background-image: url('../images/icn4.svg')}
  .prd0{background-image: url('../images/prd1.svg')}
  .prd1{background-image: url('../images/prd3.svg')}
  .prd2{background-image: url('../images/prd2.svg')}
  .prd3{background-image: url('../images/prd4.svg')}

  .cnt1{background-image: url('../images/cnt1.svg')}
  .cnt2{background-image: url('../images/cnt2.svg')}
  .cnt3{background-image: url('../images/cnt3.svg')}

  @media (max-width: 991px)
  {.closeBtn{display:block}
    .lrnMr{display: none;}
    .main{position:unset}
  .sideMenu{display: none;
  position:absolute;top:0px;left:0px;
z-index:1040;
width:100%;
border-radius: 0px;
height:100%;
}
  .date span{display: none;}
  .dtSmall{display: block;}
  .logo{margin:0px auto;}
  .mobHld {
    display: block;
    position: absolute;
    left: 1.5rem;
    top: 14px;
  }
  .mobMenu {
    display: inline-block;
    position:relative;
   
  }


  .hero {
    
    color: #FBFBFB;
    padding: 60px 60px 300px 60px;
    text-align: center;
    background-position: right 50px;
    background-repeat: no-repeat;
  }
}
@media (max-width: 768px)
{
.categories{overflow-x: scroll;}
}