.model_wrapper{
  max-width: 1520px;
  margin: 0 auto;
}
.model_title_wrapper{
    width: 100%;
    height: 187px;
    background: url(../../icons/pattern_girl.webp) no-repeat #2b2b2b;
    margin: 0 auto 50px;
    border-radius: 50px;
}
.h1_model{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 64px;
    line-height: 145%;
    text-align: center;
    color: var(--white);
    margin: 0 auto;
    padding: 30px 0 20px 0;
}

.sitemap_container{
  width: 100%;
  display: flex;
  gap: 28px;
  justify-content: center;
  margin-bottom: 70px;
}
.sitemap_topics{
    max-width: 192px;
    width: 100%;
}
.sitemap_topic{
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 34px;
    line-height: 156%;
    color: var(--black);
    margin: 25px 0;
    cursor: pointer;
}
.selected{
  color: var(--red);
}
.sitemap_scroll{
  min-width: 525px;
  width: 55.72vw;
  max-width: 1070px;
  background: var(--black);
  border-radius: 30px;
  padding: 40px 20px 40px 40px;
}


.sitemap_links_wrapper {
 
  grid-column-gap: 30px;
  grid-row-gap: 20px;   
  height: 580px;     
  overflow-y: auto;
  display: none;
}
.category{
  grid-template-columns: repeat(4, 1fr);
}
.models{
  grid-template-columns: repeat(5, 1fr);
}
.main{
  grid-template-columns: repeat(3, 1fr);
  align-content: start;  
  align-items: start; 
}
.active{
   display: grid;
}

.sitemap_link {
  display: block;
}

.sitemap_link a {
  font-family: var(--second-family);
  font-weight: 500;
  font-size: 17px;
  color: var(--white);
  text-decoration: none;
  line-height: 25px;
  transition: 300ms all ease-in-out;
}

.sitemap_link:hover a {
    color:var(--red);
}

.sitemap_links_wrapper::-webkit-scrollbar {
  width: 2px;    
  height: 2px;   
}

.sitemap_links_wrapper::-webkit-scrollbar-button {
  display: none;
}

.sitemap_links_wrapper::-webkit-scrollbar-track {
  background: transparent; 
}

.sitemap_links_wrapper::-webkit-scrollbar-thumb {
  background: var(--red);
  border-radius: 1px;       
}

@media (max-width: 1024px) {
  .model_wrapper{
    max-width: 1024px;
  }
  .model_title_wrapper{
    height: 157px;
    margin: 0 auto 30px;
    border-radius: 0px;
  }

  .h1_model {
    font-weight: 400;
    font-size: 54px;
    line-height: 154%;
    text-align: center;
    padding: 20px 0 10px 0;
  }
  .sitemap_container{
    padding: 0 20px;
  }
  .models {
    grid-template-columns: repeat(3, 1fr);
  }
  .main{
     grid-template-columns: repeat(2, 1fr);
  }
  .category {
    grid-template-columns: repeat(3, 1fr);
  }

}
@media (max-width: 768px) {
  .model_wrapper{
    max-width: 768px;
  }
  .model_title_wrapper{
    height: 147px;
    margin: 0 auto 20px;
  }

  .h1_model {
    font-size: 44px;
    line-height: 166%;
    text-align: center;
    padding: 20px 0 10px 0;
  }
  .models {
    grid-template-columns: repeat(2, 1fr);
  }
  .category {
    grid-template-columns: repeat(2, 1fr);
  }
  .sitemap_topics {
    max-width: none;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-content: center;
    align-items: center;
  }
  .sitemap_topic {
    text-align: center;
    font-size: 24px;
    line-height: 33px;
    margin: 0;
  }
  .sitemap_scroll {
    min-width: auto;
    width: 100%;
  }
  .sitemap_container{
    flex-direction: column;
  }
  

}
@media (max-width: 550px) {
   .models {
    grid-template-columns: repeat(1, 1fr);
  }
  .main{
     grid-template-columns: repeat(1, 1fr);
  }
  .category {
    grid-template-columns: repeat(1, 1fr);
  }

}
@media (max-width: 320px) {
  .model_wrapper{
    max-width: 320px;
  }
  .model_title_wrapper{
    height: 97px;
    margin: 0 auto 15px;
  }

  .h1_model {
    font-size: 34px;
    line-height: 112%;
    padding: 15px 0 10px 0;
  }
  

}