:root {
    --menu-bg: #1A5AEB; /* синий*/
    /*--banner1-bg: #fab832; !* жёлто-оранжевый как на фотке *!*/
    --top: #fff;
    --banner1-bg: #18C1C7; /* тёмно-голубой */
    /*--banner2-bg: #15777A; !* что-то бирюзовое *!*/
    --banner2-bg: #2f4f4f; /* как в контактах */
    --footer-bg: #fff; /* почти чёрный */
    --mobile-phone-bg: green; /* зелёная кнопка */
    --top-color: #585858; /* тёмно-серый */
    --footer-color: #585858;

    --scrollbar-track-color: transparent;
    --scrollbar-color: rgba(0,0,0,.2);

    --scrollbar-size: .375rem;
    --scrollbar-minlength: 1.5rem; /* Минимальная длина бегунка скроллбара (ширина горизонтального, высота вертикального) */
}
.overflowing-element::-webkit-scrollbar {
    height: var(--scrollbar-size);
    width: var(--scrollbar-size);
}
.overflowing-element::-webkit-scrollbar-track {
    background-color: var(--scrollbar-track-color);
}
.overflowing-element::-webkit-scrollbar-thumb {
    background-color: var(--scrollbar-color);
    /* Если нужно - добавьте :hover и:active */
}
.overflowing-element::-webkit-scrollbar-thumb:vertical {
    min-height: var(--scrollbar-minlength);
}
.overflowing-element::-webkit-scrollbar-thumb:horizontal {
    min-width: var(--scrollbar-minlength);
}

/* temp test */
.mr20em {margin-right: 20rem;}

/* Small screens - MOBILE */
@media only screen { } /* Define mobile styles - Mobile First */

body {
    box-sizing: content-box;
    margin: 0;
    padding: 0 0 20px 0;
    display: grid;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}
html {
    font-size: 100%;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
}
.p, p {
    font-size: 1rem;
}

h1 {
    font-size: 1.3rem;
    text-align: center;
    display: block;
    text-transform: uppercase;
    font-weight: 200;
    /*position: relative;*/
    /*z-index: 2;*/
    /*background: #fff9;*/
    /*top: -15px;*/
    /*left: -25px;*/
    /*width: 101vw;*/
    /*padding: 1em;*/
    /*box-sizing: border-box;*/
    /*text-shadow: 0 0 3px white;*/
}
h2,h3,h4 {
    font-size: 1.3rem;
}
body > * {
    box-sizing: border-box;
}
article a, article a:visited {
    color: #d96803;
    text-decoration: none;
}
article a:hover {
    color: #d96803;
    border-bottom: dotted 1px #d96803;
}
article .primeri-rabot a:hover {
    border-bottom: unset;
}
article .primeri-rabot td:hover {
    outline: 1px dotted #d96803;
}
.banner {
    width: 100%;
    /*min-height: 300px;*/
    display: grid;
    justify-content: center;
    align-content: start;
    /*padding-bottom: 30px;*/
    color: white;
    font-size: 1.5rem;
    /*padding-top: 3rem;*/
    text-align: center;
}
.banner img {
    max-width: 100%;
    height: auto;
}
.banner p {
    margin: 0 1rem;
}
.banner1__name  {
    text-transform: uppercase;
    font-weight: 200;
}
.wideimg__banner2 {
    font-size: 0;
}
.wideimg__banner2 p {
    font-size: 1rem;
}
.banner1 {
    grid-area: banner1;
    /*outline: 1px solid #808080;*/
    background: radial-gradient(at bottom right, #01979c 0%, #1cc1c7 25%, #19e8ef 70%, #1ef6fe 99%);
}
.banner2 {
    grid-area: banner2;
    /*outline: 1px solid #808080;*/
    background: var(--banner2-bg);
}
p {
    margin: 0 0 1rem 0;
}

.wideimg {
    max-width: 100%;
    margin: 2rem 0;
}

.wideimg picture, .wideimg img, .wideimg source {
    width: 100%;
    max-width: 100%;
    height: auto;
}
.wideimg__main img {
    margin: 0;
    padding: 0;
}
.wideimg__main a, .wideimg__main a:visited {
    color: #ff2332;
}
.wideimg__main a:hover {
    color: #000000;
}
#mainimage3 {
    grid-area: main-img;
    position: relative;
    background: #fab634;
    margin: 0;
}
ul, li, ol {margin: 0; padding: 0;}

.menu {
    /*background: var(--menu-bg);*/
    color: #d96803;
    padding: 3rem 10px 1rem 2rem;
    /*background: radial-gradient(at bottom left, #01979c 0%, #1cc1c7 25%, #19e8ef 70%, #1ef6fe 99%);*/
    background: white;
}

.menu > ul {
    list-style: none;
    margin-block-start: 0;
    margin-block-end: 0;
    padding-inline-start: 0;
    font-weight: bold;
    text-transform: uppercase;
}

.menu > ul > li {
    margin: 0 0 1em 0;
}

.menu > ul > li > ul {
    padding-inline-start: 0;
    list-style: disc;
    font-weight: 400;
    text-transform: none;
}

.menumob {
    background: var(--top) no-repeat;
    background-position-y: center;
    background-position-x: 10%;
    background-size: auto 76%;
}
.contacts {
    color: white;
    padding-bottom: 2em;
    background: var(--banner2-bg);
}

.contacts .head {
    text-transform: uppercase;
    margin: 1em 0;
}
.contacts .maps > *, .contacts__phone {
    margin-left: -2em;
}
.contacts__phone {
    margin-left: -1em;
}
.logo-top {
    grid-area: logo;
    background: transparent no-repeat center center;
    padding: 3rem 1rem;
    /*outline: var(--top) 13px solid;*/
    /*background-size: contain;*/

    background-size: contain;
    /*background-position: center center;*/
}
.phone a  {
    color: var(--top-color);
    text-decoration: none;
    /*border-bottom: dotted white thin;*/
    border-bottom: dotted thin gray;
}
.contacts a {
    color: white;
    text-decoration: none;
}
 .menu a {
    color: #d96803;
    text-decoration: none;

 }
 .phone {
    color: var(--top-color);
    text-transform: uppercase;
    /*text-transform: capitalize;*/
    /*font-family: monospace;*/
    /*font-size: 1.3em;*/
}


.contacts a {
    margin: 0 0 1em 0;
    display: inline-block;
}
.icon:before {
    background-repeat: no-repeat;
    content: " ";
    display: inline-block;
    height: 1.5em;
    width: 1.5em;
    margin-right: 0.5em;
    background-size: contain;
    background-position: bottom;
    margin-bottom: -0.5em;
}
.wow .icon:before, .calc-link .catalog:before, .calc-link .calc:before {
    content: "";
}

.maps {
    width: fit-content;
    margin: 0 auto;
    white-space: nowrap;
}

.part, .table, .wideimg, .widevideo {
    /*column-count: 2;*/
    column-gap:10px;
    margin-bottom: 1.5em;
    padding-bottom: 1.5em;
}
.wideimg.wideimg__banner1, .wideimg.wideimg__banner2 {
    padding-bottom: 0;
    margin-bottom: 0;
}
section.widevideo {
    width: 100%;
    max-width: 100vw;
}
video {
    object-fit: fill;
    width: 100%;
    height: auto;
}
.part {
    /*border-bottom: thin dotted lightgray;*/
}
.part:nth-last-child(1) {
    /*border-bottom: none;*/
}

.footer {
    grid-area: footer;
    background: var(--footer-bg);
    color: var(--footer-color);
    text-align: center;
    line-height: 1.5em;
    outline: 10px solid var(--footer-bg);
    background-size: contain;
    background-position: 10% center;
    padding-top: 1rem;
    /* border-top: 4px dotted #e2e2e2; */
    background-repeat: no-repeat;
    padding-bottom: 1rem;
}
.footer a {
    color: var(--footer-color);
}
.cssinfo {display: none;grid-area: footer; align-self: end; justify-self: end;}

blockquote {
    border-left: double #d3d3d3;
    padding-left: 1em;
    margin-left: 3em;
    font-style: italic;
}
section.comments {
    width: 100%;
}

p, .p, ul, ol, h1, h2, h3 {
    padding-left: 1rem;
    padding-right: 1rem;
}
#bx-panel {
    grid-area: bx-panel;
}
.product-item-detail-tabs-container-fixed {
    display: none !important;
}

.bx_sitemap_ul > li > h2 {
    font-weight: 800 !important;
}
