@import url("../webfonts/HelveticaNeue_Light/stylesheet.css");
@import url("../webfonts/MyriadPro_Cond/stylesheet.css");
@import url("../webfonts/MyriadPro_Semibold/stylesheet.css");




html { height: 100%; margin: 0; padding: 0; }

body {height: 100%; margin: 0; padding:0; font:15px trebuchet ms;color: #000;}

img {
	border: 0;
	display: block;
	font-family: "trebuchet ms";
}

*{margin:0;padding:0;}

td{vertical-align:top;}

a{outline: none;}

a:hover{text-decoration:none;}



.clear {

       	clear:both;

       	line-height:1%;

       	margin-bottom:-1px;

       	height:1px;

       	overflow:hidden;

       	font-size:0px}



#conteiner {

        position:relative;

	min-height: 100%;

	width:940px;

        margin:0  auto;

        padding:0 0 80px 0;}



* html #conteiner {height: 100%;}



#header {height:250px;padding:33px 0 0 0;margin:0;}



#logo{margin:0;float:left;}



.contact {

      text-align:right;

      margin:0;

      padding:0;

      float:right;}



p.namber {margin:0; padding:0;font:21px  Trebuchet MS;color: #929191;}

p.namber_smal {
    font: 14px  Trebuchet MS;
    color: #3F3F3F;
    line-height: 20px;
}

p.namber_smal span{color: #3F3F3F;}

p.namber_smal a{color: #3F3F3F;}
#telefone a {color: #3F3F3F;text-decoration: none;}



#wrapper{width:940px; margin:-40px 0 0 0;padding:0;}



#left_bar{width:213px; margin:0;padding:0;}



ul.menu_left {list-style: none;margin:0;padding:0;}



.menu_left li{

         background: url('../images/li.gif') left bottom no-repeat;

         width: 213px;

         height: 23px;

         margin:0;

         padding:7px 0 0 0;}



.menu_left a {

      margin:0;

      padding:3px 8px 2px 8px;

      font:14px  Trebuchet MS;

      color: #3E6C9C;

      letter-spacing:-0.5px;

      font-weight: bold;

      text-decoration:none;}



.menu_left li#active {
    background: none;
    text-align: center;
}



.menu_left li#active a{
    background-color: #3E4461;
    margin: 0;
    padding: 3px 8px 2px 8px;
    color: #fff;
}



.menu_left li.in_li{background: url('../images/in_li.gif') left no-repeat;margin:0 0 0 8px;padding:0 0 0 10px;}



.menu_left li.in_li a {
    letter-spacing: 0;
    margin: 0;
    padding: 7px 0;
    font: 14px  Trebuchet MS;
    color: #878686;
    text-decoration: none;
    text-align: left;
}



a.news {

      display: block;

      width: 205px;

      letter-spacing:-0.5px;

      background: #81be18;

      margin:10px 0;

      padding:3px 0 2px 8px;

      color: #fff;

      font:14px  Trebuchet MS;

      font-weight: bold;

      text-decoration:none;}



#content {
    width: 710px;
    margin: 0;
    padding: 0 0 30px 17px;
    font-size: 16px;
    font-weight: normal;
}
#content a{
    font-size: 16px;
    text-decoration: none;
    color: #005EA3;
    font-family: "MyriadPro Semibold";
    text-align: center;
    font-weight: normal;
    font-style: normal;
}


.Title {margin:0px 0 0 0;}



.box_l  {background: url('style.css') left top repeat-y;width: 309px; margin:10px 2px;padding:0;float: left;}

.box_r  {background: url('style.css') left top repeat-y;width: 309px;margin:10px 7px;padding:0;float: left;}

.box_c  {background: url('style.css') left top repeat-y;width: 309px;margin:10px 0;padding:0;float: right;}



h6  {

         margin:;

         padding:5px;

         font:12px  trebuchet ms;

         color: #707070;

         line-height: 13px;}



.box_top  {

         background: url('') left top no-repeat;

         width: 309px;

         height: 26px;

         margin:0 0 10px 0;

         padding:10px 0 0 0;

         text-align:center;

         font-style: italic;

         font:18px  trebuchet ms;

         color: #77b709;}



.box_bottom  {

         background: url('') left bottom no-repeat;

         width: 309px;

         height: 17px;

         margin: -10px 0 0 0;

         padding:0;

         float:left;}



.img {width: 108px; margin:4px 10px 0 4px;padding:0;float:left;}

.img img{margin:0px 0px 10px 0px;padding:0;}



.thumbnails{display: block;width:960px;margin:30px 0;padding:20px 0;border-top:1px solid #b7b7b7;}



h5 {

      float:left;

      letter-spacing:-0.5px;

      background: #81be18;

      margin:10px 0;

      padding:3px 12px 2px 12px;

      color: #fff;

      font:14px  Trebuchet MS;

      font-weight: bold;}



ul.stranica {list-style: none;margin:0;padding:10px 0 30px 0;}



.stranica li{

         font:13px Trebuchet MS;

         color: #4d4d4d;

         margin:0;

         padding:0 2px;

         float:left;}



.stranica a {

      margin:0;

      padding:0;

      font:13px Trebuchet MS;

      color: #4d4d4d;}



.foto{width:100%; padding:20px 0; text-align:center;}



.foto img{margin:0 auto; text-align:center;}



p.smal {

      margin:0;

      padding:2px 0;

      font:12px  trebuchet ms;

      color: #4d4d4d;}

p {
    margin: 0;
    padding: 7px 0;
    font: 14px  trebuchet ms;
    color: #1F1F1F;
    font-size: 16px;
    font-weight: normal;
    font-family: "HelveticaNeue Light";
    text-align: left;
}



.textes{

      background: url('') top left no-repeat;

      border:none;

      width:216px;

      height:23px;

      margin:0 5px;

      padding:4px 0 0 5px;

      font:13px   trebuchet ms;

      color: #4d4d4d;

      float:left;}



.but {

      background: url('') top left  no-repeat;

      width:29px;

      height:27px;

      cursor:pointer;

      border:none;

      margin:0;

      padding:0;

      float:left;}



p.form{ margin:0;padding: 0;font:14px  trebuchet ms;color: #4d4d4d;float:left;}



p.form span{margin:0;padding:0;float:left; line-height:23px;}

















#footer {
	border-top:1px solid #b7b7b7;
	width:950px;
	padding:10px 0 0 0;
	position: relative;
	margin: -54px auto 0 auto;
	height: 44px;
	background-color: #FFFFFF;
}



p.copy {font:14px  trebuchet ms;color: #727272;float:left;}



p.dra {font:14px  trebuchet ms;color: #727272;float:right;}



#footer a {color: #6caa02;}





/* �� ������������ */







.bl-scroll {
	width: 690px;
	max-height: 400px; /*Высота блока после которой начнется прокрутка*/
	display: inline-block;
	overflow-x: hidden; /*непосредственно прокрутка*/
	margin: 0 -3px;
	padding-top: 1px;
	font-size: 16px;
}

#body{}::-webkit-scrollbar{width: 5px;height: 5px;}::-webkit-scrollbar-track-piece{background-color: #ffffff;}::-webkit-scrollbar-thumb:vertical{height: 5px;background-color: #4682B4;}::-webkit-scrollbar-thumb:horizontal{width: 5px;background-color: #4682B4;}

















body {
	background: #ffffff;
	font-weight: normal;
	font-style: normal;
}
a.button9 {
  position: relative;
  display: inline-block;
  color: #777674;
  font-weight: bold;
  text-decoration: none;
  text-shadow: rgba(255,255,255,.5) 1px 1px, rgba(100,100,100,.3) 3px 7px 3px;
  user-select: none;
  padding: 1em 2em;
  outline: none;
  border-radius: 3px / 100%;
  background-image:
   linear-gradient(45deg, rgba(255,255,255,.0) 30%, rgba(255,255,255,.8), rgba(255,255,255,.0) 70%),
   linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,0) 20%, rgba(255,255,255,0) 90%, rgba(255,255,255,.3)),
   linear-gradient(to right, rgba(125,125,125,1), rgba(255,255,255,.9) 45%, rgba(125,125,125,.5)),
   linear-gradient(to right, rgba(125,125,125,1), rgba(255,255,255,.9) 45%, rgba(125,125,125,.5)),
   linear-gradient(to right, rgba(223,190,170,1), rgba(255,255,255,.9) 45%, rgba(223,190,170,.5)),
   linear-gradient(to right, rgba(223,190,170,1), rgba(255,255,255,.9) 45%, rgba(223,190,170,.5));
  background-repeat: no-repeat;
  background-size: 200% 100%, auto, 100% 2px, 100% 2px, 100% 1px, 100% 1px;
  background-position: 200% 0, 0 0, 0 0, 0 100%, 0 4px, 0 calc(100% - 4px);
  box-shadow: rgba(0,0,0,.5) 3px 10px 10px -10px;
}
a.button9:hover {
  transition: .5s linear;
  background-position: -200% 0, 0 0, 0 0, 0 100%, 0 4px, 0 calc(100% - 4px);
}
a.button9:active {
    top: 1px;
    color: #3E6C9C;
    font-size: 24px;
}


<style type="text/css">

.hovergallery img{
-webkit-transform:scale(0.8); /*Webkit: уменьшаем размер до 0.8*/
-moz-transform:scale(0.8); /*Mozilla: масштабирование*/
-o-transform:scale(0.8); /*Opera: масштабирование*/
-webkit-transition-duration: 0.5s; /*Webkit: длительность анимации*/
-moz-transition-duration: 0.5s; /*Mozilla: длительность анимации*/
-o-transition-duration: 0.5s; /*Opera: длительность анимации*/
opacity: 0.7; /*Начальная прозрачность изображений*/
margin: 0 10px 5px 0; /*Интервалы между изображениями*/
}

.hovergallery img:hover{
-webkit-transform:scale(1.0); /*Webkit: увеличиваем размер до 1.2x*/
-moz-transform:scale(1.1); /*Mozilla: масштабирование*/
-o-transform:scale(1.1); /*Opera: масштабирование*/
box-shadow:0px 0px 30px 
#4682B4; /*CSS3 тени: 30px размытая тень вокруг всего изображения*/
-webkit-box-shadow:0px 0px 30px 
#4682B4; /*Webkit: тени*/
-moz-box-shadow:0px 0px 30px 
#4682B4; /*Mozilla: тени*/
opacity: 1;
}

</style>









/* Текст по центру */
.gain-center{
  transition: 1s; /* Время эффекта */
  text-align: center; 
}
.gain-center:hover {
  transform: scale(1.2); /* Увеличиваем масштаб */
}


.table_blur {
  background: #f5ffff;
  border-collapse: collapse;
  text-align: left;
}
.table_blur th {
  border-top: 1px solid #777777;	
  border-bottom: 1px solid #777777; 
  box-shadow: inset 0 1px 0 #999999, inset 0 -1px 0 #999999;
  background: linear-gradient(#9595b6, #5a567f);
  color: white;
  padding: 10px 15px;
  position: relative;
}
.table_blur th:after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 25%;
  height: 25%;
  width: 100%;
  background: linear-gradient(rgba(255, 255, 255, 0), rgba(255,255,255,.08));
}
.table_blur tr:nth-child(odd) {
  background: #ebf3f9;
}
.table_blur th:first-child {
  border-left: 1px solid #777777;	
  border-bottom:  1px solid #777777;
  box-shadow: inset 1px 1px 0 #999999, inset 0 -1px 0 #999999;
}
.table_blur th:last-child {
  border-right: 1px solid #777777;
  border-bottom:  1px solid #777777;
  box-shadow: inset -1px 1px 0 #999999, inset 0 -1px 0 #999999;
}
.table_blur td {
  border: 1px solid #e3eef7;
  padding: 10px 15px;
  position: relative;
  transition: all 0.5s ease;
}
.table_blur tbody:hover td {
  color: transparent;
  text-shadow: 0 0 3px #a09f9d;
}
.table_blur tbody:hover tr:hover td {
  color: #444444;
  text-shadow: none;
}


.table_price {
  border-collapse: collapse;
  border-left: 3px solid #3E6C9C;
  border-right: 3px solid #3E6C9C;
  border-bottom: 3px solid #3E6C9C;
  font-family: "Lucida Grande", sans-serif;
 }
.table_price caption {
    background: #3E6C9C;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    padding: 10px;
    box-shadow: 0 2px  4px 0 rgba(0,0,0,.3);
    color: white;
    font-family: "Roboto Slab", serif;
    font-style: normal;
    font-size: 26px;
    text-align: center;
    margin: 0;
}
.table_price td, .table_price th {
  padding: 10px;
}
.table_price th {
    text-align: left;
    font-size: 18px;
    font-family: "Lucida Grande", sans-serif;
}
.table_price tr:nth-child(2n) {
  background: #E5E5E5;
}
.table_price td:last-of-type {
  text-align: center;
}
.table_price a {
  display: inline-block;
  padding: 5px 10px;
  background: #87CEFA;
  box-shadow: 2px 2px 0 0 #4682B4;
  position: relative;
}
.table_price a:hover {
  box-shadow: none;
  top: 2px;
  left: 2px;
}
</script>

 

 
 
<style>
.block {margin: 3rem;}
 
/* Стили для текстового поля с кнопкой "Развернуть" */
.limiter {
  max-height: 350px;
  overflow: hidden;
  position: relative;
}
.limiter .bottom {
    position: absolute;
    bottom: -1px;
    background: linear-gradient(
    to bottom,
    rgb(255 217 29 / 0%),
    rgb(255 255 255)85%);
    width: 100%;
    height: 60px;
    opacity: 1;
    transition: 0.3s;
    left: 1px;
}
 
[data-more-checker^="read-more"] {
  opacity: 0;
  position: absolute;
}
[data-more-checker^="read-more"]:checked ~ .limiter {
  max-height: none;
}
[data-more-checker^="read-more"]:checked ~ .limiter .bottom {
  opacity: 0;
  transition: 0.3s;
}
[data-more-checker^="read-more"] ~ .read-more-button:before  {
  content: "Развернуть »";
}
[data-more-checker^="read-more"]:checked ~ .read-more-button:before {
  content: "Свернуть текст «";
}
 
.read-more-button {
  cursor: pointer;
  display: inline-block;
  color: #0087C9;
  text-decoration: underline;
}

/* оставить заявку на ремонт */

<!-- Вставить в <head> -->
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/aos@2.3.4/dist/aos.css" rel="stylesheet">

<style>
  body {
    background: linear-gradient(120deg, #0f0f0f, #1c1c1e);
    font-family: 'Inter', sans-serif;
    color: #fff;
  }
  .repair-section {
    padding: 4rem 1rem;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .repair-form-container {
    max-width: 500px;
    background: rgba(255,255,255,0.05);
    backdrop-filter: blur(20px);
    border-radius: 16px;
    padding: 2rem;
    text-align: center;
    box-shadow: 0 8px 32px rgba(0,0,0,0.25);
  }
  .repair-form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-top: 1rem;
  }
  .repair-form input,
  .repair-form textarea {
    padding: 0.8rem;
    border: none;
    border-radius: 8px;
    font-size: 1rem;
    font-family: 'Inter', sans-serif;
  }
  .repair-form button {
    background: #3E4461;
    color: #FFFFFF;
    font-weight: bold;
    padding: 0.8rem;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.3s ease;
  }
  .repair-form button:hover {
    background: #3E4461;
  }
  .form-status {
    margin-top: 1rem;
    font-weight: bold;
    font-size: 1rem;
  }
</style>
</style>