/* Start:/local/templates/vademec_new_main_2026/components/bitrix/news/companies/bitrix/catalog.section/main_companies_section-new/style.css?17833288467091*/
:root {
    --company-color: #1c3969;
    --company-color-h: #142b51;
    --company-pink-color: #c83a57;
    --company-pink-color-h: #b42643;
}
main .content {max-width: unset;}
.content__title {display: none;}

#company a {
    color: var(--company-color);
    text-decoration: none;
    transition: color .3s;
}
#company a:hover {
    color: var(--company-pink-color);
}
#company .company-wrapper{
    display: grid;
    grid-template-columns: calc(100% - 270px) 250px;
    grid-gap: 20px;
    grid-template-areas: 
        "descr cont"
        "stat cont"
        "sel ."
        "mat .";
    
}
#company .company-descr {grid-area: descr; }
#company .company-contact {grid-area: cont;}
#company .company-stat {grid-area: stat;}
#company .company-mater\ial-selector {grid-area: sel;}
#company .company-material {grid-area: mat;}



#company .company-wrapper.no-finance {
    
}
#company .company-block {
    padding: 30px 20px;
    border-radius: 10px;
    border: 1px solid #e0e0e0;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    display: flex;
    flex-direction: column;
}
#company .company-stat_info ul {
    padding-left: 20px;
    list-style: unset;
}
#company .company-stat_info li {
    margin-bottom: 5px;
    font-size: 14px;
}
#company .company-contact {
    width: 100%;
    max-width: 250px;
    grid-row: span 2;
    display: flex;
    flex-direction: column;
}
/* #company .company-contact.no-finance {
    grid-row: span 2;
} */
#company .company-contact img {
    width: 100%;
    max-height: 200px;
    margin: 0 auto 40px;
}
#company .company-contact h2 {
    margin: 0 0 40px 0;
    text-align: center;
}
#company .company-contact .line {
    margin: 10px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
#company .company-contact .company-param {width: 49%;font-size: 12px;}
#company .company-contact .company-value {width: 50%;font-size: 12px;}
#company .company-social {
    /* height: 100%; */
    display: flex;
    align-items: flex-end;
    flex: 1 0 auto;
    justify-content: center;
}
#company .company-social .company-social__icon {
    width: 33%;
    display: flex;
    justify-content: center;
}
#company .company-social .company-social__icon svg {
    width: 40px;
    height: 40px;
    fill: var(--company-color);
    transition: fill .3s;
    -webkit-transition: fill .3s;
    -moz-transition: fill .3s;
    -ms-transition: fill .3s;
    -o-transition: fill .3s;
}
#company .company-social .company-social__icon:hover svg {fill: var(--company-pink-color);}
#company .company-canvas__wrapper {
    width: 100%;
    display: flex;
    justify-content: center;
}
#company .company-canvas__wrapper canvas {max-width: 600px;}
#company .company-material__wrapper .material-block {
    display: none;
    width: 100%;
    padding: 20px 0;
    flex-direction: column;
}
#company input[name="material-switcher"] {display: none;}
#company input[name="material-switcher"]:checked + .material-block {display: flex;}
#company .company-material-selector > div {display: flex;align-items: center; justify-content: space-between;}
#company .btn {
    max-width: 250px;
    width: 100%;
    padding: 10px;
    display: block;
    position: relative;
    text-transform: uppercase;
    text-align: center;
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
    cursor: pointer;
    color: #fff;
    background-color: var(--company-pink-color);
    transition: background .3s;
    -webkit-transition: background .3s;
    -moz-transition: background .3s;
    -ms-transition: background .3s;
    -o-transition: background .3s;
}
#company .company-material-selector .btn:hover {
    background-color: var(--company-pink-color-h);
}
#company .no-material {width: 100%;text-align: center;}
#company .company-material hr {
    height: 1px;
    width: 100%;
    margin: 20px 0;
    background-color: #e0e0e0;
}
#company .company-name__tag {
    display: block;
    margin-bottom: 10px;
    color: #5f87bb;
    font-size: 14px;
    font-weight: 400;
    line-height: 14px;
} 
#company .company-material .loadmore_btn {
    max-width: unset;
    border: unset;
    background: var(--company-color);
    cursor: pointer;
    transition: background .3s;
    -webkit-transition: background .3s;
    -moz-transition: background .3s;
    -ms-transition: background .3s;
    -o-transition: background .3s;
}
#company .company-material .loadmore_btn:hover {
    background-color: var(--company-color-h);
}
#company .ended-material {
    width: 100%;
    margin: 20px 0;
    text-align: center;
}
#company .company__material-image {width: 200px;height: 200px;background-color: var(--company-color);}
#company .company-material-selector {padding: 10px 20px;}
#company .company-material-selector label.active::after {
    content: ''; 
    position: absolute; /* Абсолютное позиционирование */
    transform: translateX(-50%);
    border: 30px solid transparent;
    border-top: 20px solid green;
    border-top: 15px solid var(--company-pink-color);
    /* bottom: -60px; */
    bottom: -45px;
    left: 50%;
}
/* HTML: <div class="loader"></div> */
.loader {
    width: 50px;
    margin: 10px auto;
    padding: 8px;
    aspect-ratio: 1;
    border-radius: 50%;
    background: var(--company-color);
    --_m: 
      conic-gradient(#0000 10%,#000),
      linear-gradient(#000 0 0) content-box;
    -webkit-mask: var(--_m);
            mask: var(--_m);
    -webkit-mask-composite: source-out;
            mask-composite: subtract;
    animation: spinner 1s infinite linear;
  }
  @keyframes spinner {to{transform: rotate(1turn)}}
@media screen and (max-width: 998px) {
    #company .company-wrapper {
        grid-template-columns: 1fr;
        grid-template-areas: 
            "descr"
            "cont"
            "stat"
            "sel"
            "mat";
    }

    #company .company-contact {max-width: unset;grid-row: 2;}
    #company .company-contact img {max-width: 200px;}
    #company .company-contact h2 {text-align: left;}
    #company .company-contact .company-param {width: 200px;}
    #company .company-contact .company-value {width: 100%;}
    #company .company-social {
        height: auto;
        margin: 20px 0 0 0;
    }
    #company .company-social .company-social__icon {width: 60px;}
    #company .company-canvas__wrapper {overflow-x: auto;}
    #company .company-canvas__wrapper canvas {width: 100%;height: 300px;overflow-x: auto;}
}
@media screen and (max-width: 578px) {
    #company .company-material-selector .btn {max-width: unset;margin: 10px 0;}
    #company .company-material-selector > div {flex-direction: column;}
    #company .company-material-selector label.active::after {content: none;}
    #company .company-material-selector label.active {background-color: var(--company-pink-color-h);}
    #company .company-contact .line {flex-direction: column;}
    #company .company-contact .company-param {width: 100%;}
}
/* End */


/* Start:/local/templates/vademec_new_main_2026/components/bitrix/news/companies/bitrix/catalog.section/main_companies_section-new/styles.css?17833288467091*/
:root {
    --company-color: #1c3969;
    --company-color-h: #142b51;
    --company-pink-color: #c83a57;
    --company-pink-color-h: #b42643;
}
main .content {max-width: unset;}
.content__title {display: none;}

#company a {
    color: var(--company-color);
    text-decoration: none;
    transition: color .3s;
}
#company a:hover {
    color: var(--company-pink-color);
}
#company .company-wrapper{
    display: grid;
    grid-template-columns: calc(100% - 270px) 250px;
    grid-gap: 20px;
    grid-template-areas: 
        "descr cont"
        "stat cont"
        "sel ."
        "mat .";
    
}
#company .company-descr {grid-area: descr; }
#company .company-contact {grid-area: cont;}
#company .company-stat {grid-area: stat;}
#company .company-mater\ial-selector {grid-area: sel;}
#company .company-material {grid-area: mat;}



#company .company-wrapper.no-finance {
    
}
#company .company-block {
    padding: 30px 20px;
    border-radius: 10px;
    border: 1px solid #e0e0e0;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    display: flex;
    flex-direction: column;
}
#company .company-stat_info ul {
    padding-left: 20px;
    list-style: unset;
}
#company .company-stat_info li {
    margin-bottom: 5px;
    font-size: 14px;
}
#company .company-contact {
    width: 100%;
    max-width: 250px;
    grid-row: span 2;
    display: flex;
    flex-direction: column;
}
/* #company .company-contact.no-finance {
    grid-row: span 2;
} */
#company .company-contact img {
    width: 100%;
    max-height: 200px;
    margin: 0 auto 40px;
}
#company .company-contact h2 {
    margin: 0 0 40px 0;
    text-align: center;
}
#company .company-contact .line {
    margin: 10px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
#company .company-contact .company-param {width: 41%;font-size: 12px;}
#company .company-contact .company-value {width: 58%;font-size: 12px;}
#company .company-social {
    /* height: 100%; */
    display: flex;
    align-items: flex-end;
    flex: 1 0 auto;
    justify-content: center;
}
#company .company-social .company-social__icon {
    width: 33%;
    display: flex;
    justify-content: center;
}
#company .company-social .company-social__icon svg {
    width: 40px;
    height: 40px;
    fill: var(--company-color);
    transition: fill .3s;
    -webkit-transition: fill .3s;
    -moz-transition: fill .3s;
    -ms-transition: fill .3s;
    -o-transition: fill .3s;
}
#company .company-social .company-social__icon:hover svg {fill: var(--company-pink-color);}
#company .company-canvas__wrapper {
    width: 100%;
    display: flex;
    justify-content: center;
}
#company .company-canvas__wrapper canvas {max-width: 600px;}
#company .company-material__wrapper .material-block {
    display: none;
    width: 100%;
    padding: 20px 0;
    flex-direction: column;
}
#company input[name="material-switcher"] {display: none;}
#company input[name="material-switcher"]:checked + .material-block {display: flex;}
#company .company-material-selector > div {display: flex;align-items: center; justify-content: space-between;}
#company .btn {
    max-width: 250px;
    width: 100%;
    padding: 10px;
    display: block;
    position: relative;
    text-transform: uppercase;
    text-align: center;
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    -ms-border-radius: 20px;
    -o-border-radius: 20px;
    cursor: pointer;
    color: #fff;
    background-color: var(--company-pink-color);
    transition: background .3s;
    -webkit-transition: background .3s;
    -moz-transition: background .3s;
    -ms-transition: background .3s;
    -o-transition: background .3s;
}
#company .company-material-selector .btn:hover {
    background-color: var(--company-pink-color-h);
}
#company .no-material {width: 100%;text-align: center;}
#company .company-material hr {
    height: 1px;
    width: 100%;
    margin: 20px 0;
    background-color: #e0e0e0;
}
#company .company-name__tag {
    display: block;
    margin-bottom: 10px;
    color: #5f87bb;
    font-size: 14px;
    font-weight: 400;
    line-height: 14px;
} 
#company .company-material .loadmore_btn {
    max-width: unset;
    border: unset;
    background: var(--company-color);
    cursor: pointer;
    transition: background .3s;
    -webkit-transition: background .3s;
    -moz-transition: background .3s;
    -ms-transition: background .3s;
    -o-transition: background .3s;
}
#company .company-material .loadmore_btn:hover {
    background-color: var(--company-color-h);
}
#company .ended-material {
    width: 100%;
    margin: 20px 0;
    text-align: center;
}
#company .company__material-image {width: 200px;height: 200px;background-color: var(--company-color);}
#company .company-material-selector {padding: 10px 20px;}
#company .company-material-selector label.active::after {
    content: ''; 
    position: absolute; /* Абсолютное позиционирование */
    transform: translateX(-50%);
    border: 30px solid transparent;
    border-top: 20px solid green;
    border-top: 15px solid var(--company-pink-color);
    /* bottom: -60px; */
    bottom: -45px;
    left: 50%;
}
/* HTML: <div class="loader"></div> */
.loader {
    width: 50px;
    margin: 10px auto;
    padding: 8px;
    aspect-ratio: 1;
    border-radius: 50%;
    background: var(--company-color);
    --_m: 
      conic-gradient(#0000 10%,#000),
      linear-gradient(#000 0 0) content-box;
    -webkit-mask: var(--_m);
            mask: var(--_m);
    -webkit-mask-composite: source-out;
            mask-composite: subtract;
    animation: spinner 1s infinite linear;
  }
  @keyframes spinner {to{transform: rotate(1turn)}}
@media screen and (max-width: 998px) {
    #company .company-wrapper {
        grid-template-columns: 1fr;
        grid-template-areas: 
            "descr"
            "cont"
            "stat"
            "sel"
            "mat";
    }

    #company .company-contact {max-width: unset;grid-row: 2;}
    #company .company-contact img {max-width: 200px;}
    #company .company-contact h2 {text-align: left;}
    #company .company-contact .company-param {width: 200px;}
    #company .company-contact .company-value {width: 100%;}
    #company .company-social {
        height: auto;
        margin: 20px 0 0 0;
    }
    #company .company-social .company-social__icon {width: 60px;}
    #company .company-canvas__wrapper {overflow-x: auto;}
    #company .company-canvas__wrapper canvas {width: 100%;height: 300px;overflow-x: auto;}
}
@media screen and (max-width: 578px) {
    #company .company-material-selector .btn {max-width: unset;margin: 10px 0;}
    #company .company-material-selector > div {flex-direction: column;}
    #company .company-material-selector label.active::after {content: none;}
    #company .company-material-selector label.active {background-color: var(--company-pink-color-h);}
    #company .company-contact .line {flex-direction: column;}
    #company .company-contact .company-param {width: 100%;}
}
/* End */
/* /local/templates/vademec_new_main_2026/components/bitrix/news/companies/bitrix/catalog.section/main_companies_section-new/style.css?17833288467091 */
/* /local/templates/vademec_new_main_2026/components/bitrix/news/companies/bitrix/catalog.section/main_companies_section-new/styles.css?17833288467091 */