/* Шрифты */
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

/* Глобальные переменные */
 
:root {
  /* размеры */

  --max-data-width: 1860px;
  --wrap-data-padding: 0 4rem;
  --base-font-size: 20px;

  /* цвета */
  --red-color: #e50040;
  --green-color: #4fc7b5; 
  --white-color: #fff;
  --black-color: #000;

  --dark-gray-color: #4e4e4e;
  --gray-color: #818181;
  --middle-gray-color: #b0b0b0;
  --light-gray-color: #d9d9d9;
  --thin-gray-color: #f0f0f0;

  --super-thin-gray-color: #f6f6f6;
  --sub-super-thin-gray-color: #eeeff3;

  --thin-gray-op-color: rgba(54, 54, 54, 0.4);
  --thin-gray-oph-color: rgba(54, 54, 54, 0.75);

  --form-input-color: #edeef0;

  --yandex-link-color: #000080;
  --yandex-gray-color: rgba(84, 96, 122, 0.68);

  /* фоны */

  --black-bg-95: rgba(0, 0, 0, 0.95);
  --black-bg-90: rgba(0, 0, 0, 0.9);
  --black-bg-85: rgba(0, 0, 0, 0.85);
  --black-bg-75: rgba(0, 0, 0, 0.75);
  --black-bg-50: rgba(0, 0, 0, 0.5);
  --black-bg-40: rgba(0, 0, 0, 0.4);
  --black-bg-25: rgba(0, 0, 0, 0.25);
  --black-bg-15: rgba(0, 0, 0, 0.15);
  --black-bg-10: rgba(0, 0, 0, 0.10);
  --black-bg-5: rgba(0, 0, 0, 0.05);
  --black-bg-025: rgba(0, 0, 0, 0.025);

  --brown-gradient : linear-gradient(to bottom, rgba(186,165,146,1) 100%, rgba(209,196,187,1) 100%);

  --white-bg-95: rgba(255, 255, 255, 0.95);
  --white-bg-85: rgba(255, 255, 255, 0.85);
  --white-bg-75: rgba(255, 255, 255, 0.75);
  --white-bg-60: rgba(255, 255, 255, 0.6);
  --white-bg-50: rgba(255, 255, 255, 0.5);
  --white-bg-25: rgba(255, 255, 255, 0.25);
  --white-bg-20: rgba(255, 255, 255, 0.2);
  --white-bg-15: rgba(255, 255, 255, 0.15);
  --white-bg-10: rgba(255, 255, 255, 0.1);

  --bg-slider-data: linear-gradient(to top, rgba(0,0,0,0.6), rgba(0,0,0,0.01));
  
  /* --top-bg: url("../graph/topbg.jpg") center top no-repeat; */

  /* размеры фонов */
  --bg-full-height: auto 100%;
  --bg-full-width: 100% auto;

  --bg-height-30: auto 30%;
  --bg-height-40: auto 40%;
  --bg-height-50: auto 50%;
  --bg-height-60: auto 60%;
  --bg-height-70: auto 70%;
  --bg-height-75: auto 75%;
  --bg-height-80: auto 80%;
  --bg-height-85: auto 85%;
  --bg-height-90: auto 90%;
  --bg-height-95: auto 95%;




  /* иконки */

  --callback-icon: url("../graph/icon-callback.png") center center no-repeat;
  --phone-icon: url("../graph/icon-phone.svg") center center no-repeat;
  --menu-icon: url("../graph/icon-menu.svg") center center no-repeat;

  --slider-block: url("../graph/rehau/el7.png") left bottom no-repeat;
  --prof-img-block: url("../graph/rehau/el3.png") left top no-repeat;

  --scroll-arrow-icon : url(../graph/icon-scroll-arrow.svg) center center no-repeat;

  --work-time-bg : url("../graph/work-time-icon.png") left center no-repeat;
  --address-bg : url("../graph/address-icon.png") left center no-repeat;
  --nav-bg : url("../graph/direct-arrow.png") center center no-repeat;

  /*


  --date-icon : url(../graph/icon-date.svg) left center no-repeat;
  --date-icon-w: url(../graph/icon-date-w.svg) left center no-repeat;
  --more-icon : url(../graph/icon-more.svg) left center no-repeat;

  --nav-icon : url(../graph/icon-nav.svg) left center no-repeat;

  --vk-icon : url(../graph/icon-vk.svg) center center no-repeat;
  --tg-icon : url(../graph/icon-tg.svg) center center no-repeat;
  --ig-icon : url(../graph/icon-ig.svg) center center no-repeat;
  --yt-icon : url(../graph/icon-yt.svg) center center no-repeat;
  */

}

/* Сетка */
.flex-columns {position: relative; width:100%; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; align-items:center;}
.flex-columns.top-align {align-items:stretch;}
.flex-columns.end-align {align-items:end;}

.flex-columns.reverse { flex-direction: row-reverse; }

.flex-columns.content-left {justify-content: flex-start;}
.flex-columns.content-right {justify-content: flex-end;}
.flex-columns.content-center {justify-content: center;}
.flex-columns.content-between {justify-content: space-between;}
.flex-columns.content-around {justify-content: space-around;}

.col-1, .col-1x1 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}

.col-1x2 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}

.col-1x3 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 33.33333%; flex: 0 0 33.3%; max-width: 33.3%;}
.col-2x3 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 66.66666%; flex: 0 0 66.6%; max-width: 66.6%;}

.col-1x4 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%;}
.col-3x4 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%;}

.col-1x5 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%;}
.col-2x5 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%;}
.col-3x5 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 60%; flex: 0 0 60%; max-width: 60%;}
.col-4x5 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 80%; flex: 0 0 80%; max-width: 80%;}

.col-1x6 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 16.66666%; flex: 0 0 16.6%; max-width: 16.6%;}
.col-5x6 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 83.33333%; flex: 0 0 83.3%; max-width: 83.3%;}

.col-1x7 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 14.25%; flex: 0 0 14.25%; max-width: 14.25%;}
.col-2x7 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 28.5%; flex: 0 0 28.5%; max-width: 28.5%;}
.col-3x7 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 42.85%; flex: 0 0 42.85%; max-width: 42.85%;}
.col-4x7 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 57.15%; flex: 0 0 57.15%; max-width: 57.15%;}
.col-5x7 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 71.5%; flex: 0 0 71.5%; max-width: 71.5%;}
.col-6x7 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 85.75%; flex: 0 0 85.75%; max-width: 85.75%;}


.col-1x8 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%;}
.col-3x8 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 37.5%; flex: 0 0 37.5%; max-width: 37.5%;}
.col-5x8 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 62.5%; flex: 0 0 62.5%; max-width: 62.5%;}
.col-7x8 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 62.5%; flex: 0 0 62.5%; max-width: 62.5%;}


.col-1x9 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 11.15%; flex: 0 0 11.15%; max-width: 11.15%;}
.col-2x9 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 22.25%; flex: 0 0 22.25%; max-width: 22.25%;}
.col-4x9 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 44.45%; flex: 0 0 44.45%; max-width: 44.45%;}
.col-5x9 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 55.55%; flex: 0 0 55.55%; max-width: 55.55%;}
.col-7x9 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 77.75%; flex: 0 0 77.75%; max-width: 77.75%;}
.col-8x9 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 88.85%; flex: 0 0 85.85%; max-width: 88.85%;}

.col-5x11 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 45.45%; flex: 0 0 45.45%; max-width: 45.45%;}
.col-6x11 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 54.55%; flex: 0 0 54.55%; max-width: 54.55%;}

.col-1x12 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 8.33333%; flex: 0 0 8.33333%; max-width: 8.33333%;}
.col-11x12 {position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 91.66666%; flex: 0 0 91.66666%; max-width: 91.66666%;}

.red-bg { background-color: var(--red-color); }
.green-bg { background-color: var(--green-color); }
.gray-bg { background-color: var(--middle-gray-color); }

/* Тэги */
html {min-height:100%; margin:0; padding:0; font-size:var(--base-font-size); }
body {position:relative; margin:0; padding:0; text-align:center; font-family: 'Inter', sans-serif; font-weight:300;  font-size:1rem; color: var(--black-color); background: var(--thin-brown-color); -webkit-text-size-adjust: 100%;  transition: 0.5s ease-out; -webkit-animation: fade-animation 1s both; animation: fade-animation 1s both}
body.fix { overflow:hidden;height: 100vh; }

form {padding:0; margin: 0;}
p {margin:0; padding: 0 0 0.5rem;}
a {text-decoration: none; cursor: pointer; color:var(--black-color); opacity:1; -webkit-transition: all 0.25s ease; -moz-transition: all 0.25s ease; -o-transition: all 0.25s ease; 	transition: all 0.25s ease; }
a:hover { opacity:1 !important; color:var(--red-color); -webkit-transition: all 0.25s ease; -moz-transition: all 0.25s ease; -o-transition: all 0.25s ease; 	transition: all 0.25s ease; }
b {font-weight:500;}
img,a img {border:0;}

h1,h2,h3,h4,h5,h6 {padding:0; margin:0; font-weight:300; color:var(--black-color); line-height:1.1; text-align:left }

h1 {font-size:2.5rem; font-weight:800; color:var(--black-color); }
  h1 span {display:block; font-size:1.57rem; font-weight:300; opacity:0.6 }

h2 {font-size:2.25rem; font-weight:800; color:var(--black-color); }

h3 {font-size:1.8rem; font-weight:700; color:var(--black-color); }

h4 {font-size:0.9rem;  }

.page-block h1,  h2.block-title { position:relative; display:inline-block; padding-bottom:0.75rem; margin-bottom:2.5rem; min-width:15rem; font-size:3rem; font-weight:600; color:var(--brown-color); text-align:center; }
  .page-block h1:after, h2.block-title:after { content: ''; position: absolute; display:inline-block; bottom:0; left:35%; right:35%; width:30%; height:0.15rem; background-color: var(--sub-brown-color); opacity:0.3 }

iframe { border-width: 0px; }

input[type="text"], input[type="number"], input[type="password"], input[type="file"], textarea, select {border:solid 1px var(--light-gray-color); outline: 0 !important; }
input[type="text"]::-webkit-input-placeholder {color: var (--light-gray-color); font-weight:300 !important;}
input[type="text"]::-moz-placeholder {color: var (--light-gray-color); font-weight:300 !important;}
input[type="number"]::-webkit-input-placeholder {color: var (--light-gray-color); font-weight:300 !important;}
input[type="number"]::-moz-placeholder {color: var (--light-gray-color); font-weight:300 !important;}
input[type="file"]::-webkit-input-placeholder {color: var (--light-gray-color); font-weight:300 !important;}
input[type="file"]::-moz-placeholder {color: var (--light-gray-color); font-weight:300 !important;}
input[type="file"] { background-color: var(--white-color); font-family: 'Roboto', sans-serif; font-size:0.6rem; }
textarea::-webkit-input-placeholder {color: var (--light-gray-color);}
textarea::-moz-placeholder {color: var (--light-gray-color);}

/* input[type="text"].errorinput { border:solid 1px var(--red-color) !important; } */
input.errorinput { border:solid 1px var(--red-color) !important; }
input[type="text"].errorinput::-webkit-input-placeholder {font-weight:300;  color: var(--red-color); }
input[type="text"].errorinput::-moz-placeholder {font-weight:300;  color: var(--red-color); }
input[type="password"].errorinput::-webkit-input-placeholder {font-weight:300;  color: var(--red-color); }
input[type="password"].errorinput::-moz-placeholder {font-weight:300;  color: var(--red-color); }
textarea.errorinput::-webkit-input-placeholder {font-weight:300;  color: var(--red-color);}
textarea.errorinput::-moz-placeholder {font-weight: 300;  color: var(--red-color);}

select:disabled { opacity: 1 !important; border:0 !important; appearance: none; -webkit-appearance: none; -moz-appearance: none;  }
select:disabled::-ms-expand {display: none;}

span.inpass { position: relative; display:block }
span.inpass label { position: absolute; cursor:pointer; display:inline-block; width:1.2rem; height:1.2rem; right:0.5rem; top:0.5rem; background: var(--eye-icon); background-size: var(--bg-height-85); opacity:0.25; }
span.inpass label:hover, span.inpass.active label { opacity:0.5; }


/* Секции */
.wrapper {position:relative; width:100%;  padding:0;  margin:0; text-align:center; }
    .wrapper .wrap {position: relative; display:block; max-width:var(--max-data-width); margin:auto; padding: var(--wrap-data-padding); }

/* Шапка */
.wrtop { position: relative; }
  .wrtop.fixed-menu { position: fixed; top:0; left:0; background-color:var(--white-color); box-shadow: 0 0 0.5rem rgb(17 56 86 / 25%); z-index: 10000; }
  .wrtop .wrap { padding-top:1rem; padding-bottom:1rem; }

  .wrtop .top-line { position: relative; width:100%; }

    .wrtop .top-line .top-logo { position: relative; width:100%; text-align:left; }
      .wrtop .top-line .top-logo a { position: relative; display:inline-block; width:100%; max-width:20rem; }
      .wrtop .top-line .top-logo a span { display:inline-block; width:46%; margin-right: 3%; }
      .wrtop .top-line .top-logo a span:last-child { width:45%; margin-left: 4%; margin-right: 0;  }
      .wrtop .top-line .top-logo a span img { width:100%; } 
      .wrtop .top-line .top-logo a span.mir-logo img { margin-bottom:0.25rem; } 

    .wrtop .top-line .top-contacts { display:inline-block; width:calc(100% - 4.3rem); font-size:0.6rem; text-align:right; padding-right:1rem; border-right:solid 1px var(--black-color);   }
        .wrtop .top-line .top-contacts .top-phone a { display:block; cursor:pointer; margin-top:0.15rem;  font-size:1.35rem; font-weight:700; }
    
    .wrtop .top-line .top-callback { display:inline-block; margin-left:0.8rem; width:2.2rem;}
        .wrtop .top-line .top-callback a { display:inline-block; cursor:pointer; width:2.2rem; height:2.2rem; background: var(--callback-icon); background-size: var(--bg-full-height); }

    .wrtop .top-line .top-menu-link { display:none; }       
        
/* Главное меню */
.top-menu { position:relative; width:100%; text-align:center }

    .top-menu ul { position:relative; display:inline-block; margin:0; padding:0; list-style: none; text-align:left; }
      .top-menu ul li { position:relative; display:inline-block; margin:0; padding:0; list-style: none; }
        .top-menu ul li a { position:relative; display:inline-block; cursor:pointer; margin:0; padding:0.25rem 0.75rem; font-size:0.9rem; font-weight:600; color:var(--black-color); list-style: none; }
          .top-menu ul li a:hover { color:var(--red-color); }
/*        
        .top-menu ul li a.sub { padding-right: 1rem; }
          .top-menu ul li a.sub::after { content: "›"; position: absolute; top: 0.25rem; right: 0.25rem; display: inline-block; transform: rotate(90deg); }
          .top-menu ul li a.sub:hover::after { content: "›"; position: absolute; top: 0.25rem; right: 0.35rem; display: inline-block; transform: rotate(-90deg); }

      .top-menu ul li ul { display:none; }    
      .top-menu ul li:hover ul { position:absolute; display:block; top:100%; left:0; padding:0.75rem 0;  background-color: var(--white-color); border-radius:0 0 0.5rem 0.5rem; box-shadow: 0 0.25rem 0.25rem 0 rgba(0, 0, 0, 0.22); -webkit-box-shadow: 0 0.25rem 0.25rem 0 rgba(0, 0, 0, 0.22); -moz-box-shadow: 0 0.25rem 0.25rem 0 rgba(0, 0, 0, 0.22); }
        .top-menu ul li ul li { display:block; }
         .top-menu ul li ul li a { position:relative; display:block;  cursor:pointer; margin:0; padding:0.25rem 0.75rem; font-size:0.8rem; font-weight:400; white-space: nowrap }
*/



/* Слайдер на главной */
.slider {position: relative; height: 0; padding-top: 31.5%; margin-bottom:2rem;  z-index:4; padding-bottom:2rem; }
  .slider .slider-data {position: absolute; top: 0; left: 0; right: 0; bottom: 0;  }

  .slider .ms-item {position:relative; z-index: 3;}
    .slider .ms-item .ms-container {position:absolute; display:flex; top: unset; left:51%; right: 14%; bottom: -2rem; -ms-flex-wrap: wrap; flex-wrap: wrap; align-items:center; justify-content: left;  background: var(--green-color); z-index: 4; }
      .slider .ms-item .ms-container .ms-data {position:relative; display:inline-block; width:85%; padding:0 7.5%; margin:5% 0; text-align:left; color:var(--white-color); }
        .slider .ms-item .ms-container .ms-data .slide-title { margin-bottom:1rem;  font-size:2.25rem; font-weight:800; line-height:1; color:var(--white-color); }
        .slider .ms-item .ms-container .ms-data p { padding-right:10%; }  

    .slider .ms-item .ms-img {position: relative; display:inline-block; width:100%; height: 0; padding-top: 31.5%; overflow: hidden;  }       
      .slider .ms-item .ms-img img { position: absolute; width:100% !important; height: auto; top: 50%; left: 50%; transform: translate(-50%, -50%); }
    .slider .ms-item .ms-img img.mob-pic {display: none;}

  .slider .owl-carousel {position: unset;}

  .slider .owl-carousel .owl-nav {position: absolute; top:calc(47% - 2rem); left:5%; right:5%; width:90%; z-index:12; }
    .slider .owl-carousel .owl-nav div {position:relative; display: inline-block; width:6rem; height:4rem; margin:0 0.25rem; background:var(--nav-bg); background-size: auto 50%; overflow: hidden; opacity:0.5;}
      .slider .owl-nav div:hover {opacity: 1; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease;}
      .slider .owl-nav div.owl-prev {float:left; }
      .slider .owl-nav div.owl-next {float:right; transform:rotate(180deg)}

  .slider .owl-carousel .owl-dots {position: absolute; bottom:0; right:50%; left:2%; text-align:left; }
    .slider .owl-carousel .owl-dots .owl-dot {position: relative; display: inline-block; width:2rem; height: 0.4rem; margin:0 0.4rem; background-color: var(--green-color);  -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; }
      .slider .owl-carousel .owl-dots .owl-dot.active {height: 0.4rem; background-color: var(--red-color); -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease;  opacity:0.8;  }
      .slider .owl-carousel .owl-dots .owl-dot::hover {-webkit-transition: all 1s ease;-moz-transition: all 1s ease;-o-transition: all 1s ease; transition: all 1s ease;    opacity:1;  }

  .slider .owl-carousel .owl-stage-outer { overflow:unset; overflow-x: clip; }


/* Каталог */
.wrwhy { padding-bottom:3.5rem;   }
  .wrwhy .wrap { text-align:left; }

  .right-title { position: absolute; right:4rem ; top:2rem; font-size:2.7rem; font-weight:700; color:var(--light-gray-color);  } 

  .why-list { position:relative; padding-top:2rem;  }
    .why-list .flex-columns { gap:1.5rem; }
    .why-list .why-item { position:relative; display:inline-block;  padding:1.5rem; flex-grow: 1; width:10%; font-size:0.8rem;  color:var(--white-color); background-color: var(--green-color); }
      .why-list .why-item:nth-child(2n) { background-color: var(--red-color); }
      .why-list .why-item .why-title { font-size: 1.25rem; font-weight: 800; margin-bottom:1rem; margin-right:28% }
      .why-list .why-item span { position: absolute; display:inline-block; top:1rem; right:1.5rem; font-size: 3.2rem; font-weight: 800; opacity: 0.5;}


/* Каталог */
.wrcatalog { padding:3rem 0;  }

  .wrcatalog  .right-title { position: absolute; right:4rem ; top:1.25rem; font-size:1.75rem; font-weight:700; color:var(--light-gray-color);  } 

   .catalog-list { position: relative; margin-top:2rem; margin-bottom:1rem; }
     .catalog-list .catalog-item { position: relative; width:calc(100% - 1.8rem); margin:0.9rem; margin-bottom:2rem;  background-color: var(--white-color);}
       .catalog-list .col-1x3:nth-child(3n+1) .catalog-item { margin-left:0; margin-right:1.8rem;}
       .catalog-list .col-1x3:nth-child(3n) .catalog-item { margin-left:1.8rem; margin-right:0;}

    .catalog-item h3 { margin:0; padding:0;  padding-bottom:0.75rem }

    .catalog-list .catalog-item-img { position: relative; width:100%; z-index:4;}
      .catalog-list .catalog-item-img h3 { position:absolute; top:1rem; left:0; padding:0.75rem; color:var(--white-color); background-color: var(--red-color); z-index:5; }
      .catalog-list .catalog-item-img .main-img { position: relative; width:100%; height:0; padding-top:60%; overflow:hidden;}      
      .catalog-list .catalog-item-img .add-img { position: absolute; width:40%; right:5%; bottom:-1.25rem; box-shadow: 0 0 0.25rem 0 rgba(0, 0, 0, 0.22); -webkit-box-shadow: 0 0 0.25rem 0 rgba(0, 0, 0, 0.22); -moz-box-shadow: 0 0 0.25rem 0 rgba(0, 0, 0, 0.22);   } 
        .catalog-list .catalog-item-img .add-img span { position: relative; display:block; width:100%; height:0; padding-top:100%; overflow:hidden; } 

    .catalog-list .catalog-item .catalog-item-data { position: relative; padding:1rem; }
      .catalog-list .catalog-item .catalog-item-data .catalog-item-info { position: relative; padding:1rem 0;  }
        .catalog-list .catalog-item .catalog-item-data .catalog-item-info .flex-columns { gap:0.5rem; }
        .catalog-list .catalog-item .catalog-item-data .catalog-item-info .square { flex-grow: 1; padding:0.75rem; font-size:0.65rem; line-height:1.1; color:var(--white-color);  }
          .catalog-list .catalog-item .catalog-item-data .catalog-item-info .square span { display: block; font-size:1.25rem; font-weight: 700;    }
        .catalog-list .catalog-item .catalog-item-data .catalog-item-info .catalog-item-price { flex-grow: 2; font-size: 0.9rem; font-weight:500;}
          .catalog-list .catalog-item .catalog-item-data .catalog-item-info .catalog-item-price span { font-size: 2.6rem; font-weight:700; }
          .catalog-list .catalog-item .catalog-item-data .catalog-item-info .catalog-item-price sup { font-size: 0.5rem;}
          .catalog-list .catalog-item .catalog-item-data .catalog-item-info .catalog-item-price .noprice { font-size: 0.9rem; font-weight:600;}
            .catalog-list .catalog-item .catalog-item-data .catalog-item-info .catalog-item-price .noprice b { display:block; font-weight:600; }
      .catalog-list .catalog-item .catalog-item-data .catalog-item-desc { font-size:0.7rem; color:var(--dark-gray-color); text-align: justify; }
     .catalog-list .catalog-item .catalog-item-data .catalog-item-buttons { position: relative; margin-top:1.5rem; }  
      .catalog-list .catalog-item .catalog-item-buttons a { display:inline-block; width:100%; padding:0.75rem 0; font-size:0.9rem;  font-weight:400; color:var(--white-color); text-align:center;  }
        .catalog-list .catalog-item .catalog-item-buttons a.red-bg {padding:1.15rem 0; font-size:1.1rem;}


/* Данные профиля */
.profile-data { position:relative; width:100%; }

  .profile-data .profile-gallery { position: sticky; top: calc(100vh / 250); width: 95%; margin-right: 5%; }
    .profile-data .profile-gallery .profile-img { position: relative; display:block; width:100%; height:0; padding-top:100%; overflow:hidden; }
      .profile-data .profile-gallery .profile-img span { position: absolute; display:inline-block; top:0; left:0; width:25%; height:30%; background: var(--prof-img-block); background-size:var(--bg-full-width); overflow:hidden;  }
    .profile-data .profile-gallery .profile-colors {position: relative; margin-top:1rem; width:100%; text-align:center}
      .profile-data .profile-gallery .profile-colors img {width:100%; max-width:15rem;}

  .profile-data .profile-info { position: relative; width:95%; padding-right:5%;  }      
    .profile-data .profile-order { position: absolute; right:5%; top:0; } 
    .profile-data .profile-order a { display:inline-block; font-size:0.9rem;  font-weight:400; color:var(--white-color); text-align:center;  }
    .profile-data .profile-order a.red-bg {padding:1.15rem; font-size:1.1rem;}
    .profile-data .profile-info h2 span { display:block; margin-top:0.25rem; margin-bottom:0.75rem; font-size:1.2rem; font-weight:300; color:var(--green-color);  }      
    .profile-data .profile-info h4 { font-size:1.1rem; padding-top:0.5rem; padding-bottom:1rem; }      
    .profile-data .profile-info .profile-text { font-size:0.8rem; }
    .profile-data .profile-info .profile-text table tr:nth-child(2n+1) td { font-size:0.75rem; background-color: var(--thin-gray-color); }
    .profile-data .profile-info .profile-text table tr td:nth-child(2n+1) { width:55% }
    .profile-data .profile-info .profile-text ul { margin-top:0; margin-bottom:1rem }


/* Аксессуары */
.wraccess { padding:3rem 0;  }

  .wraccess  .right-title { position: absolute; right:4rem ; top:1.25rem; font-size:1.75rem; font-weight:700; color:var(--light-gray-color);  } 

  .wraccess .acc-list { position: relative; margin-top:3rem; margin-bottom:1rem; }
    .wraccess .acc-list .flex-columns.top-align { gap:2rem; }

    .wraccess .acc-list .acc-item { position: relative; display:inline-block; flex-grow: 1; width:48%; background-color: var(--thin-gray-color);  }
      .wraccess .acc-list .acc-item .acc-img { position: relative; width:100%; height:0; padding-bottom:100%; overflow:hidden; }   
      .wraccess .acc-list .acc-item .acc-data { position: relative; padding:0.5rem 1.5rem; font-size:0.75rem; text-align:justify; }
        .wraccess .acc-list .acc-item .acc-data .acc-button a { display:inline-block; cursor: pointer; margin:0.25rem 0; padding:0.75rem 1.25rem; font-size: 0.9rem; font-weight: 400;  color:var(--white-color);  } 

  /*  .wraccess .acc-list .acc-item .acc-data h3 { position:relative; padding-bottom:0.75rem; font-size:1.5rem; text-align:left; } */
      .wraccess .acc-list .acc-item .acc-data h3 { position:relative; display:inline-block;  left:-6rem; padding:0.75rem 1rem; margin-bottom:1rem; white-space: nowrap;  color:var(--white-color); background-color: var(--green-color); z-index:5; }
        .wraccess .acc-list .acc-item .acc-data h3:after { content: ''; position:absolute; display: inline-block; top:0; left:105%; width:4.25rem; height:3.5rem; background: url(../graph/rehau/el5.png) left center no-repeat; background-size: 100% auto; overflow: hidden;  }


/* Сертифкат партнера */
.wrsert { padding:3rem 0;  }

  .wrsert  .right-title { position: absolute; right:4rem ; top:1.25rem; font-size:1.75rem; font-weight:700; color:var(--light-gray-color);  } 

  .wrsert .sertificat { position: relative; margin-top:3rem; margin-bottom:1rem;  }
    .wrsert .sertificat .sert-video { position: relative; margin-right:5%; }
    .wrsert .sertificat .sert-qr { position: absolute; top:0; left:0; right:0; bottom:0; color:var(--white-color); font-size:0.85rem; font-weight:300;  text-align:center; background: var(--green-color); }
      .wrsert .sertificat .sert-qr h4 { position:relative; padding:1.25rem; line-height:1.25; color:var(--white-color); font-size:1.25rem; font-weight:600; text-align:center; }
      .wrsert .sertificat .sert-qr .rehau-qr { margin:auto; width:100%; max-width:17rem; }
        .wrsert .sertificat .sert-qr .rehau-qr img { max-width:100%;  }


/* Услуги */
.wrservices { padding:3rem 0;  }

  .wrservices  .right-title { position: absolute; right:4rem ; top:1.25rem; font-size:1.75rem; font-weight:700; color:var(--light-gray-color);  } 

  .wrservices .service-list { position: relative; margin-top:2.5rem; margin-bottom:1rem }
    .wrservices .service-list .flex-columns { gap:1rem; }

    .wrservices .service-list .service-item { position: relative; display:inline-block; flex-grow: 1; width:18%; margin-bottom:1.5rem; background-color: var(--red-color);  }
      .wrservices .service-list .service-item:nth-child(2n) { background-color: var(--green-color);}

    .wrservices .service-list .service-img { position: relative; width:100%; height:0; padding-top:60%; overflow:hidden; z-index:4;}
      .wrservices .service-list .service-img:after { content:''; position:absolute; display:inline-block; right:0.75rem; top:0.25rem; width:4rem; height:3rem; background: url(../graph/rehau/el2.png) right bottom no-repeat; background-size: 100% auto; z-index:5; }

    .wrservices .service-list .service-desc { padding: 1.5rem; color:var(--white-color); font-size:0.8rem;  text-align: left;  } 
      .wrservices .service-list .service-desc  h3 { position:relative; padding-bottom:0.75rem; font-size:1.5rem; color:var(--white-color);  }



/* Фоны wrapper */
.wrgraybg { background-color: var(--super-thin-gray-color); }
.wrdarkgraybg { background-color: var(--dark-gray-color); }


/*  Отзывы */
.wrreviews { padding-top: 3rem; padding-bottom: 1rem; text-align:left; background-color: var(--super-thin-gray-color);}

  .wrreviews .wrtitle h2 {display:inline-block;  text-align: left; }

  .wrreviews .wrap:after { content:''; position:absolute; display:inline-block; right:20%; top:-2rem; width:15%; height:0; padding-top:14%; background: url(../graph/rehau/el4.png) right bottom no-repeat; background-size: 100% auto; z-index:4; }

  .wrreviews .reviews-list {position: relative; padding: 1.5rem 0; z-index:5}
    .wrreviews .reviews-list .review-item {position: relative;margin: 1rem 5%; min-height: 9rem; background-color: var(--white-color);  box-shadow: 0.15rem 0.15rem 0.3rem rgba(0, 0, 0, 0.1); }
    .wrreviews .reviews-list .review-item .review-item-data { position: relative; padding: 0.75rem; }
      .wrreviews .reviews-list .review-item .review-author {position: relative; display: flex; align-items: center; padding-bottom: 0.5rem;}
        .wrreviews .reviews-list .review-item .review-author .review-avatar {position: relative; display: flex; width: 2.5rem;}
          .wrreviews .reviews-list .review-item .review-author .review-avatar img {position: relative; border-radius: 50%; max-width: 2.1rem;}
        .wrreviews .reviews-list .review-item .review-author .review-name {display: flex; width: calc(100% - 2.5rem);  font-size: 0.75rem;  font-weight: 600;  color: var(--yandex-link-color);}
      .wrreviews .reviews-list .review-item .review-date-stars {position: relative; display: flex; align-items: center;  padding-bottom: 0.25rem;}
        .wrreviews .reviews-list .review-item .review-date { position: relative; display: flex; font-size: 0.7rem; color: var(----yandex-gray-color);  line-height: 0.8rem;}
        .wrreviews .reviews-list .review-item .review-stars { position: relative; padding-right: 0.25rem;}
          .wrreviews .reviews-list .review-item .review-stars span {display: inline-block; width: 0.75rem; height: 0.75rem; margin-right: 0.05rem; background: url(../graph/yandex_star.svg) center center no-repeat;  background-size: auto 100%;}
        .wrreviews .reviews-list .review-item .review-text {position: relative; padding-right: 0.25rem; font-size: 0.7rem; font-weight:300; color:var(--dark-gray-color); max-height: 4rem; line-height: 1.2; text-align:left;  overflow: auto;}
          .wrreviews .reviews-list .review-item .review-text::-webkit-scrollbar {  width: 2px; }
          .wrreviews .reviews-list .review-item .review-text::-webkit-scrollbar-track { background-color: var(--white-color);}
          .wrreviews .reviews-list .review-item .review-text::-webkit-scrollbar-thumb { box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.2);}

    .wrreviews .reviews-links {position: relative; display: inline-block; left: 6.5%; top: 0.75rem;}
      .wrreviews .reviews-links span {display: block; margin-bottom: 0.5rem; text-transform: uppercase; opacity: 0.6;}
      .wrreviews .reviews-links .reviews-links-list { display: flex; align-items: flex-start;}
        .wrreviews .reviews-links .reviews-links-list div {margin-right: 0.25rem;}
          .wrreviews .reviews-links .reviews-links-list div img {max-height: 2.25rem;}

    .wrreviews .owl-carousel .owl-nav {position: absolute; top:-4.5rem; right:0;  }
      .wrreviews .owl-carousel .owl-nav div {position:relative; display: inline-block; width:3rem; height:3.5rem; margin:0 0.25rem; background:var(--nav-bg); background-size: auto 60%;  border-radius:0.3rem 0 0 0.3rem; overflow: hidden; opacity:0.25;}
       .wrreviews .owl-nav div:hover {opacity: 1; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease;}
       .wrreviews .owl-nav div.owl-next {transform:rotate(180deg)}


 /* Карта в футере */
.wrmap {margin:0.1rem 0;}
  .wrmap .map {display: block; width:100%; height:25rem;}
  [class*="ymaps-2"][class*="-ground-pane"] {filter: grayscale(1); -ms-filter: grayscale(1); -webkit-filter: grayscale(1);	-moz-filter: grayscale(1);	-o-filter: grayscale(1); }

  .wrmap .map-contacts {position: absolute; display: flex; top:0; bottom:0; left:10%; padding:2rem 4%; align-items:center; background-color: var(--thin-gray-color);}
    .wrmap .map-contacts .map-contacts-data {position: relative; display: inline-block; text-align:left;}

    .wrmap .map-contacts  h3 { position:relative; display:inline-block; font-weight: 600; color:var(--main-blue-color)}
    .wrmap .map-contacts  .map-phone { padding:0.75rem 0; }
    .wrmap .map-contacts  .map-phone span { display:block; }
    .wrmap .map-contacts  .map-phone a { position:relative; display:inline-block; margin:1rem 0; font-size: 1.75rem; line-height:0.5;  color:var(--black-color)}
    .wrmap .map-contacts  .map-address span { position:relative; display: inline-block; margin-bottom:1rem; padding-left:2.5rem; background: var(--address-bg);  background-size: auto 90%;}
    .wrmap .map-contacts  .map-work-time span { position:relative; display: inline-block; padding-left:2.5rem; background: var(--work-time-bg);  background-size: auto 80%; }


/* Фотогалерея страницы */
.page-gallery { position: relative; padding-top:1.5rem; }       

  .page-gallery .gallery-item { position: relative; width:95%; padding-bottom:95%; height:0; margin:0 2.5%; margin-bottom:1.5rem; overflow: hidden; }
    .page-gallery .gallery-item span { position: absolute; left:0; top:0; width: 100%; height: 100%; border-radius: 1.5rem; overflow: hidden;}
      .page-gallery .gallery-item span img  { width: 100%; height: 100%; object-fit: cover; object-position: left top; object-position: 50% 50%;	 }
  
 .page-gallery .col-1x3:nth-child(3n+1) .gallery-item { margin-left:0; margin-right:5%; }
  .page-gallery .col-1x3:nth-child(3n) .gallery-item { margin-left:5%; margin-right:0%; }


/* Галерея видео */
.video-item { position: relative; width: 100%; padding-bottom: 56.25%; height: 0; overflow: hidden; }
   .video-item iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/* Фотоальбом */
.album-list { position: relative; padding: 0 2.5%; }
  .album-item { position: relative; width:95%; margin:0 2.5%; margin-bottom:1rem; }
    .album-item .album-data { position: relative; width:100%; height:0; padding-top:100%; border-radius: 1.5rem; overflow:hidden; }
      .album-item .album-data img { position: absolute; height:100% !important;  width: unset !important; top: 50%; left: 50%; transform: translate(-50%, -50%); }
      .album-item .album-data h3 {position: absolute; bottom: 0; left: 0; right: 0; text-align: center; padding: 2rem 1.5rem; padding-bottom: 1rem; font-size: 1.25rem; color: var(--white-color); background: var(--bg-slider-data); }

/* ссылка показать еще */
.morelink { position: relative; width:100%; padding-top:1.5rem;  text-align:center }
  .morelink:before { content: ''; position: absolute; display:inline-block; top:0; left:40%; right:40%; width:20%; height:0.05rem; background-color: var(--sub-brown-color); opacity:0.3 }
  .morelink a.button { border:solid 1px var(--light-brown-color);  }

/* Вопрос-ответ */
.faq-list .faq-item { position: relative; font-size:0.9rem; text-align:left; border-bottom:solid 1px #eee;  }  
  .faq-list .faq-item:last-child { border-bottom:0;  }  
    .faq-list .faq-item blockquote { position:relative; cursor:pointer; font-size:1.1rem; font-weight:400;   }
      .faq-list .faq-item blockquote:before { content:''; position:absolute; display:inline-block; width:1.1rem; height:1.1rem; left:-2rem; top:0.1rem; background: var(--faq-icon); background-size: var(--bg-full-height);  }
      .faq-list .faq-item blockquote::after { content:'+'; position:absolute; display:inline-block;  right:-2rem; top:-0.15rem; font-size:1.5rem; font-weight:300; width:1.5rem; height:1.5rem; line-height:1.5rem; color:#999; text-align:center; background-color:#f0f0f0; border-radius:50%; }  
      .faq-list .faq-item.active blockquote::after { content:'+'; position:absolute; display:inline-block;  right:-2rem; top:-0.15rem; font-size:1.5rem; font-weight:300; width:1.5rem; height:1.5rem; line-height:1.5rem; color:#999; text-align:center; background-color:#f0f0f0; border-radius:50%; transform: rotate(45deg) }  

/* Футер */
.wrend { padding:2.5rem 0;  }
  .wrend .wrap { margin: 0 auto; }

  .wrend .end-line { position: relative; width:100%; }

    .wrend .end-line .end-logo { position: relative; width:100%; text-align:left; }
      .wrend .end-line .end-logo a { position: relative; display:inline-block; width:75%; max-width:20rem; }
      .wrend .end-line .end-logo a span { display:inline-block; width:46%; margin-right: 3%; }
      .wrend .end-line .end-logo a span:last-child { width:45%; margin-left: 4%; margin-right: 0;  }
      .wrend .end-line .end-logo a span img { width:100%; } 
      .wrend .end-line .end-logo a span.mir-logo img { margin-bottom:0.25rem; } 

    .wrend .end-line .end-contacts { display:inline-block; width:calc(100% - 4.3rem); font-size:0.6rem; text-align:right; }
        .wrend .end-line .end-contacts .end-phone a { display:block; cursor:pointer;  font-size:1.35rem; font-weight:700; color:var(--thin-gray-color); }

.end-menu { position:relative; width:100%; text-align:center }

    .end-menu ul { position:relative; display:inline-block; margin:0; padding:0; list-style: none; text-align:left; }
      .end-menu ul li { position:relative; display:inline-block; margin:0; padding:0; list-style: none; }
        .end-menu ul li a { position:relative; display:inline-block; cursor:pointer; margin:0; padding:0.25rem 0.75rem; font-size:0.9rem; font-weight:300; color:var(--thin-gray-color); list-style: none; }
          .end-menu ul li a:hover { color:var(--green-color); }


/* Обратный звонок */
.callbackform-data { position:relative; }
.callbackform-data h4 { padding-bottom:1rem; font-size:1.25rem; font-weight:600; }
.callbackform-data label { display:inline-block;  font-size:0.6rem; line-height:1.15; }
.callbackform-data label b { font-size:0.7rem; font-weight:300; }
.callbackform-data label a { color:var(--red-color) }
.callbackform-data input[type="text"] { width: calc(100% - 2rem - 8px); padding:0.75rem 1rem; font-size:1rem; } 
.callbackform-data a.red-bg { display:inline-block; margin-top:0.5rem; padding:0.75rem 1.5rem; font-size:1.1rem; font-weight:400; color:var(--white-color); text-align:center;  }


/* Адаптивные изображения */
img.fullw { position: absolute; max-width:100% !important; width:unset !important; height: unset !important; top: 50%; left: 50%; transform: translate(-50%, -50%); }
img.fullh { position: absolute; max-height:100% !important; width: unset !important; height:unset !important  ; top: 50%; left: 50%; transform: translate(-50%, -50%); }
img.fullwh { position: absolute; max-height:135% !important; max-width:135% !important; width: unset !important; height:unset !important  ; top: 50%; left: 50%; transform: translate(-50%, -50%); }

img.fullsmallw { position: absolute; max-width:90% !important; width:unset !important; height: unset !important; top: 50%; left: 50%; transform: translate(-50%, -50%); }
img.hardfullw { position: absolute; width:100% !important; height: unset !important; top: 50%; left: 50%; transform: translate(-50%, -50%); }
img.hardfullh { position: absolute; height:100% !important; width: unset !important; top: 50%; left: 50%; transform: translate(-50%, -50%); }

/* Кнопки */
a.button { position:relative; cursor:pointer; display:inline-block; margin:auto; padding:0.5rem 1rem; font-size:0.7rem; font-weight:600; border-radius: 0.25rem; }
a.white-button { background-color: var(--thin-brown-color); color:var(--brown-color); }

.social { position:relative; }
.social a { position: relative; display:inline-block; cursor:pointer; width:2.1rem; height:2.1rem; margin-left:1rem; opacity:0.6; }
.social a.vk-icon { background: var(--vk-icon); background-size: auto 100%; }
.social a.tg-icon { background: var(--tg-icon); background-size: auto 100%; }
.social a.ig-icon { background: var(--ig-icon); background-size: auto 85%; }
.social a.yt-icon { background: var(--yt-icon); background-size: auto 100%; }


/* Окна magnific */
.mfp-container { z-index:100000 !important; } 
.white-popup-block { padding: 2rem; width:calc(98% - 4rem); margin: 1rem auto; max-width:75rem;  border-radius:0; background-color: var(--white-color);  }
.popup-data {position: relative; max-height:35rem; overflow:auto; }
.white-popup-block.order-block { width:calc(98% - 4rem); max-width:25rem;   }
.white-popup-block.order-block .popup-data {position: relative; max-height:35rem; overflow:hidden; }
.callbackform-data p:nth-child(5) { display:none; }

.popup-result { padding:1.5rem 0; font-size:0.9rem; text-align:center; }
.popup-result h3 { padding-bottom:1rem;  font-size:1.75rem; color:var(--green-color);  text-align: center;  }


/* Прокрутка в началу страницы */
.scrollup { position: fixed; cursor:pointer; display: none; bottom:1.9rem; left:1%; width:3.5rem; height:3.5rem; background: var(--scroll-arrow-icon); background-size: var(--bg-height-50);  background-color: var(--thin-gray-op-color); border-radius: 50%; overflow:hidden; z-index:50; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; 	transition: all 0.5s ease; }
  .scrollup:hover { background-color: var(--thin-gray-oph-color); -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; 	transition: all 0.5s ease; }

/* Прогрессбар */
.loading { position:relative; width:100%; margin:2rem 0; text-align:center; }
.loading img { width:unset !important; }

/* Модификаторы */
.a-left {text-align:left;}
.a-right {text-align:right;}
.a-center {text-align:center;}

/* Прочее */
.hidden {display:none !important;}
.link { cursor: pointer; }
.fixed { position: fixed;  bottom:unset; top:0; z-index:50000; }
.half-line { display: inline-block; width:49.7%; vertical-align: text-top;  zoom: 1;  }

/* FancyBox */
.fancybox-image { border-radius: 1.25rem; }


/* Cookie popup */
.cookiewin { position: fixed; display: none; bottom: 20px; right: 20px; width: 24%; min-width: 280px; padding: 20px; background-color: rgba(255, 255, 255, 1); z-index: 999; box-shadow: 0 0 48px rgb(17 56 86 / 20%);}
.cookiewin .cookiewin-data { position: relative; font-size: 13px; text-align: center; }
.cookiewin .cookiewin-data span { display: block; font-size: 16px; font-weight: normal; }
.cookiewin .cookiewin-data a { text-decoration: none; color: var(--red-color); }
.cookiewin .cookiewin-close a { position: absolute; right: 20px; top: 20px; cursor: pointer; width: 16px; height: 16px; background: url(../graph/close-icon.svg) center center no-repeat; }
.cookiewin .cookiewin-button a {display: inline-block; cursor: pointer; background-color: var(--red-color); margin-top: 10px; padding: 10px 30px; text-transform: uppercase;  text-align: center;  color: white; border-radius:0.35rem }