
/* Базовые стили слоя, затемнения и модального окна */
.overlay {
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 10;
display: none;
/* фон затемнения */
background-color: rgba(0, 0, 0, 0.65);
position: fixed; /* фиксированное позиционирование */
cursor: default; /* тип курсора */
}
 
/* активируем слой затемнения */
.overlay:target {
display: block;
}
 
/* стили модального окна */
.popup {
top: -100%;
right: 0;
left: 50%;
font-size: 14px;
z-index: 20;
margin: 0;
width: 85%;
min-width: 320px;
max-width: 900px;
/* фиксированное позиционирование, окно стабильно при прокрутке */
position: fixed;
padding: 15px;
border: 1px solid #383838;
background: #fefefe;
/* скругление углов */
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
border-radius: 4px;
font: 14px/18px 'Tahoma', Arial, sans-serif;
/* внешняя тень */
-webkit-box-shadow: 0 15px 20px rgba(0,0,0,.22),0 19px 60px rgba(0,0,0,.3);
-moz-box-shadow: 0 15px 20px rgba(0,0,0,.22),0 19px 60px rgba(0,0,0,.3);
-ms-box-shadow: 0 15px 20px rgba(0,0,0,.22),0 19px 60px rgba(0,0,0,.3);
box-shadow: 0 15px 20px rgba(0,0,0,.22),0 19px 60px rgba(0,0,0,.3);
-webkit-transform: translate(-50%, -500%);
-ms-transform: translate(-50%, -500%);
-o-transform: translate(-50%, -500%);
transform: translate(-50%, -500%);
-webkit-transition: -webkit-transform 0.6s ease-out;
-moz-transition: -moz-transform 0.6s ease-out;
-o-transition: -o-transform 0.6s ease-out;
transition: transform 0.6s ease-out;
}
 
/* активируем модальный блок */
.overlay:target+.popup {
-webkit-transform: translate(-50%, 0);
-ms-transform: translate(-50%, 0);
-o-transform: translate(-50%, 0);
transform: translate(-50%, 0);
top: 75px;
}
 
/* формируем кнопку закрытия */
.close {
top: -10px;
right: -10px;
width: 20px;
height: 20px;
position: absolute;
padding: 0;
border: 2px solid #ccc;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
-ms-border-radius: 15px;
-o-border-radius: 15px;
border-radius: 15px;
background-color: rgba(61, 61, 61, 0.8);
-webkit-box-shadow: 0px 0px 10px #000;
-moz-box-shadow: 0px 0px 10px #000;
box-shadow: 0px 0px 10px #000;
text-align: center;
text-decoration: none;
font: 13px/20px 'Tahoma', Arial, sans-serif;
font-weight: bold;
-webkit-transition: all ease .8s;
-moz-transition: all ease .8s;
-ms-transition: all ease .8s;
-o-transition: all ease .8s;
transition: all ease .8s;
}
 
.close:before {
color: rgba(255, 255, 255, 0.9);
content: "X";
text-shadow: 0 -1px rgba(0, 0, 0, 0.9);
font-size: 20px;
}
 
.close:hover {
background-color: rgba(252, 20, 0, 0.8);
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-ms-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}

   .menu {
    position: fixed; /* Фиксированное положение */
    left: 0px; /* Расстояние от правого края окна браузера */
    width: 15%;
    height: 100%;
    top: 0%; /* Расстояние сверху */
    color: #fff;
    padding: 10px; /* Поля вокруг текста */ 
    background: #424f63; /* Цвет фона */ 
    border: 0px solid #757575; /* Параметры рамки */ 
   }

   .menu1024 {
    position: fixed; /* Фиксированное положение */
    left: 0px; /* Расстояние от правого края окна браузера */
    width: 50px;
    height: 100%;
    top: 0%; /* Расстояние сверху */
    color: #fff;
    padding: 10px; /* Поля вокруг текста */ 
    background: #424f63; /* Цвет фона */ 
    border: 0px solid #757575; /* Параметры рамки */ 
   }


   .text {
    height: 10px;
   }

.link-test {
  display: block;
  border: 0px solid #424f63;
}

.link-test:hover {
  display: block;
  border: 0px solid #353f4f;
  cursor: pointer;
}


.link-test p {
  face="WESTERN";
  text-indent: 0px;
  color: #ffffff;
  font-family: arial;
}
.txt-test-show {
  display: none;
}

/* Exchange content */
.link-test:hover div.img-test {
}
.link-test:hover p.txt-test {
  display: none;
}
.link-test:hover p.txt-test-show {
    face="WESTERN";
    color: #65cea7;    
    display: block;
}

	.table tr:hover
	{
		background: #eee;
	}

	.table 
	{
		font-size: 14px;
	}

.tabs { width: 100%; text-align: padding: 10px; margin: 0 auto;}
.tabs>input { display: none; }
.tabs>div { 
    height: 70%;
    width: 100%;
    text-align: center;
    display: none;
    padding: 15px;
    border: 0px solid #C0C0C0;
    background: #FFFFFF;
}
.tabs>label {
    display: inline-block;
    padding: 7px;
    margin: 0 -5px -1px 0;
    text-align: center;
    color: #666666;
    border: 1px dashed #C0C0C0;
    background: #FFFAFA;
    cursor: pointer;
}
.tabs>input:checked + label {
    color: #000000;
    border: 1px solid #C0C0C0;
    border-bottom: 1px solid #FFFFFF;
    background: #FFFFFF;
}
#tab_1:checked ~ #txt_1,
#tab_2:checked ~ #txt_2,
#tab_3:checked ~ #txt_3,
#tab_4:checked ~ #txt_4 { display: block; }

   p {
    text-indent: 45px;
   }

      #col1, #col2 {
    vertical-align: middle;
   }

div.fix_block {
position: fixed;
top: 100px;
left: 30px;
padding: 20px;
border: 1px solid #000;
}

   a {
    text-decoration: none;
   }
   a:hover {
    color: #0a81ff;
    text-decoration: none;
   }

   a.link1 {
    color: #9d9d9d;
    text-decoration: none;
   }
   a.link1:hover {
    color: #ffffff;
    text-decoration: none;
   }

   a.menu1 {
    size=3;
    face="WESTERN";
    color: #ffffff;
    text-decoration: none;
   }
   a.menu1:hover {
    size=3;
    face="WESTERN";
    color: #ffffff;
    text-decoration: none;
   }

   a.link2 {
    color: #3d3d3d;
    text-decoration: none;
   }
   a.link2:hover {
    color: #3d3d3d;
    text-decoration: none;
   }

   a.linkPR {
    color: #cccccc;
    text-decoration: none;
   }
   a.linkPR:hover {
    color: #cccccc;
    text-decoration: none;
   }

a.line {
     color: #096b91;
    text-decoration: none;
    background-image: linear-gradient(currentColor, currentColor);
    background-position: 0% 100%;
    background-repeat: no-repeat;
    background-size: 0% 2px;
    transition: background-size .3s;
}

a.line:hover {
     color: #096b91;
    background-size: 100% 2px;
}


a.linereg {
     color: #096b91;
    text-decoration: none;
    background-image: linear-gradient(currentColor, currentColor);
    background-position: 0% 100%;
    background-repeat: no-repeat;
    background-size: 0% 2px;
    transition: background-size .3s;
}

a.linereg:hover {
     color: #096b91;
    background-size: 100% 2px;
}



img.rot {
  animation: 8s linear 0s normal none infinite running rot;
  -webkit-animation: 8s linear 0s normal none infinite running rot;
}
@keyframes rot {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-webkit-keyframes rot {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

       .border1
        {
            

            
            width:145px;
            height:145px;
            
            color:#fff;
            
            font-family:Roboto;
            font-size:3.3em;


            
            transition:all 0.3s ease;
            
        }
        
        .border1:hover
        {
            box-shadow: inset 0 0 0 12px #545454;
        }
        
        .border2
        {
            
            height:100%;


          
            color:#fff;
            
            font-family:Roboto;
            font-weight:700;
            font-size:3.3em;          
            text-align:center;

            
            transition:all 0.3s ease;
            
        }
        
        .border2:hover
        {
            box-shadow: inset 0 0 0 12px #545454;
        }

        .border21
        {
            
            width:195px;
            height:190px;



          
            color:#fff;
            
            font-family:Roboto;
            font-weight:700;
            font-size:1.3em;          
            text-align:center;

            
            transition:all 0.3s ease;
            
        }
        
        .border21:hover
        {
            box-shadow: inset 0 0 0 12px #545454;
        }



   /* Slider (https://github.com/itchief/how-to/tree/master/slider)
        Copyright 2019 Alexander Maltsev
        Licensed under MIT (https://github.com/itchief/how-to/blob/master/LICENSE) */

    /* стили для элемента body */

    ol,
    ul,
    dl {
      margin-top: 0;
      margin-bottom: 1rem;
    }

    /* стили основного контейнера слайдера */
    .slider {
      position: relative;
      overflow: hidden;
      max-width: 960px;
      margin-left: auto;
      margin-right: auto;
    }

    /* стили для обёртки, в которой заключены слайды */
    .slider__wrapper {
      position: relative;
      overflow: hidden;
    }

    /* стили для контейнера слайдов */
    .slider__items {
      display: flex;
      transition: transform 0.6s ease;
    }

    /* стили для слайдов */
    .slider__item {
      flex: 0 0 100%;
      max-width: 100%;
    }

    /* стили для кнопок "вперед" и "назад" */
    .slider__control {
      position: absolute;
      top: 50%;
      display: none;
      align-items: center;
      justify-content: center;
      width: 40px;
      color: #000000;
      text-align: center;
      opacity: 0.5;
      height: 50px;
      transform: translateY(-50%);
    }

    .slider__control_show {
      display: flex;
    }

    .slider__control:hover,
    .slider__control:focus {
      color: #000000;
      text-decoration: none;
      outline: 0;
      opacity: 0.9;
    }

    .slider__control_prev {
      left: 0;
    }

    .slider__control_next {
      right: 0;
    }

    .slider__control::before {
      content: '';
      display: inline-block;
      width: 20px;
      height: 20px;
      background: transparent no-repeat center center;
      background-size: 100% 100%;
    }

    .slider__control_prev::before {
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E");
    }

    .slider__control_next::before {
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E");
    }

    /* стили для индикаторов */
    .slider__indicators {
      position: absolute;
      right: 0;
      bottom: 10px;
      left: 0;
      z-index: 15;
      display: flex;
      justify-content: center;
      padding-left: 0;
      margin-right: 15%;
      margin-left: 15%;
      list-style: none;
      margin-top: 0;
      margin-bottom: 0;
    }

    .slider__indicators li {
      box-sizing: content-box;
      flex: 0 1 auto;
      width: 30px;
      height: 4px;
      margin-right: 3px;
      margin-left: 3px;
      text-indent: -999px;
      cursor: pointer;
      background-color: rgba(255, 255, 255, 0.5);
      background-clip: padding-box;
      border-top: 10px solid transparent;
      border-bottom: 10px solid transparent;
    }

    .slider__indicators li.active {
      background-color: #fff;
    }

    img.SL {
      display: inline-block;
      height: auto;
      max-width: 100%;
      border-radius: 50%;
    }

    .slider__item_1 {
      background: linear-gradient(45deg, #b3b3b3 10%, #dbdbdb 90%);
    }

    .slider__item_2 {
      background: linear-gradient(to right, #dbdbdb, #b3b3b3);
    }

    .slider__item_3 {
      background: linear-gradient(to right, #b3b3b3, #dbdbdb);
    }

    .slider__item_4 {
      background: linear-gradient(to right, #dbdbdb, #b3b3b3);
    }

    .slider__item {
      height: 320px;
      overflow: hidden;
      position: relative;
    }

    .slider__item_inner {
      position: absolute;
      left: 15%;
      right: 15%;
      top: 36px;
      bottom: 36px;
      overflow: hidden;
      color: #fff;
      text-align: center;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-direction: column;
    }

    .slider__item_img {
      flex: 0 0 80px;
      max-width: 80px;
    }

    .slider__item_testimonial {
      flex: 1 0 0;
      display: flex;
      flex-direction: column;
      text-align: center;

    }

    @media (min-width: 576px) {
      .slider__item {
        height: 270px;
      }

      .slider__item_inner {
        flex-direction: row;
      }

      .slider__item_testimonial {
        margin-left: 15px;
      }

      .slider__item_img {
        flex: 0 0 150px;
        max-width: 150px;
      }

      .slider__item_testimonial {
        text-align: left;
      }
    }

    .slider__item_name {
      font-size: 20px;
      margin-bottom: 8px;
      color: rgba(0, 0, 0);
    }

    .slider__item_post {
      font-size: 14px;
      margin-bottom: 8px;
      color: rgba(26, 26, 26);
    }

    .slider__item_text {
      font-size: 16px;
      color: rgba(59, 59, 59);
    }




    .mslider__item_name {
      font-size: 30px;
      margin-bottom: 8px;
      color: rgba(0, 0, 0);
    }

    .mslider__item_post {
      font-size: 25px;
      margin-bottom: 8px;
      color: rgba(26, 26, 26);
    }

    .mslider__item_text {
      font-size: 25px;
      color: rgba(59, 59, 59);
    }






    tbody td.menu2 {
    color: #FFFFFF;
    size=3;
    face="WESTERN";
    text-decoration: none;
   }
    tbody td.menu2:hover {
    color: #65cea7;
    size=3;
    face="WESTERN";
    text-decoration: none;
   }  

   div.BG {
    width: 100%;
    background: #eff0f4; 
   }

.tbl td
{
	border: 1px solid #ccc;
	padding: 5px;
}



   .blockmain {
    left: 16%; /* Расстояние от правого края окна браузера */
    top: 0%; /* Расстояние сверху */
    padding: 10px; /* Поля вокруг текста */ 
    background: #fff; /* Цвет фона */ 
   }

   button.mess {
   height: 35px;
   width: 200px;
   border-radius: 5px;
   border: 1px solid #f17c1e;
   background-color: #f17c1e;
   color: white;
   }

   button.mess:hover {
   background-color: #f18c3b;
   }
   button.messMobile {
   height: 70px;
   width: 270%;
   border-radius: 5px;
   border: 1px solid #f17c1e;
   background-color: #f17c1e;
   color: white;
   }

   button.messMobile:hover {
   background-color: #f18c3b;
   }





   button.begin {
   height: 45px;
   width: 200px;
   border-radius: 5px;
   border: 2px solid #fff;
   background-color: transparent;
   color: #fff;
   }
   button.begin:hover {
   height: 45px;
   width: 200px;
   border-radius: 5px;
   border: 2px solid #f17c1e;
   background-color: transparent;
   color: #fff;
   }
   button.beginMob {
   height: 70px;
   width: 270%;
   border-radius: 5px;
   border: 2px solid #fff;
   background-color: transparent;
   color: #fff;
   font-size: 35px;
   }
   button.beginMob:hover {
   height: 70px;
   width: 270%;
   border-radius: 5px;
   border: 2px solid #f17c1e;
   background-color: transparent;
   color: #fff;
   font-size: 35px;
   }

   div.mobilecalc {
   border-radius: 5px;
   width: 400px;
   border: 1px solid #fff;
   background-color: rgba(66,79,99, 0.9);
   color: #fff;
   }

   div.calc {
   border-radius: 5px;
   width: 400px;
   border: 1px solid #fff;
   background-color: rgba(66,79,99, 0.7);
   color: #fff;
   }


   div.calc:hover {
   border-radius: 5px;
   width: 400px;
   border: 1px solid #f17c1e;
   background-color: rgba(66,79,99, 0.7);
   color: #fff;
   }


   button.calc {
   height: 30px;
   width: 100%;
   border-radius: 5px;
   border: 1px solid #fff;
   background-color: transparent;
   color: #fff;
   }
   button.calc:hover {
   height: 30px;
   width: 100%;
   border-radius: 5px;
   border: 1px solid #f17c1e;
   background-color: transparent;
   color: #fff;
   }

	a.calc{
   color: #fff;
}
	a.calc:hover{
   color: #fff;
}

   div.calcPC {
   border-radius: 5px;
   width: 400px;
   border: 1px solid #fff;
   background-color: rgba(66,79,99, 0.9);
   color: #fff;
   }


   div.calcPC:hover {
   border-radius: 5px;
   width: 400px;
   border: 1px solid #f17c1e;
   background-color: rgba(66,79,99, 0.9);
   color: #fff;
   }


   button.calcPC {
   height: 30px;
   width: 100%;
   border-radius: 5px;
   border: 1px solid #fff;
   background-color: transparent;
   color: #fff;
   }
   button.calcPC:hover {
   height: 30px;
   width: 100%;
   border-radius: 5px;
   border: 1px solid #f17c1e;
   background-color: transparent;
   color: #fff;
   }

	a.calcPC{
   color: #fff;
}
	a.calcPC:hover{
   color: #fff;
}


.anim-show1{
background:#fff;
font-size:25px;
border:3px solid #2BA2DB;
padding:20px;
margin:left;
margin-bottom:20px;
text-align:left;
opacity:0; /*Элемент полностью прозрачный (невидимый)*/
transition: 1s; /*Скорость перехода состояния элемента*/
animation: show 3s 1; /* Указываем название анимации, её время и количество повторов*/
animation-fill-mode: forwards; /* Чтобы элемент оставался в конечном состоянии анимации */
animation-delay: 1s; /* Задержка перед началом */
}
.anim-show2{
background:#fff;
font-size:25px;
border:3px solid #2BA2DB;
padding:20px;
margin:left;
margin-bottom:20px;
text-align:left;
opacity:0; /*Элемент полностью прозрачный (невидимый)*/
transition: 1s; /*Скорость перехода состояния элемента*/
animation: show 3s 1; /* Указываем название анимации, её время и количество повторов*/
animation-fill-mode: forwards; /* Чтобы элемент оставался в конечном состоянии анимации */
animation-delay: 2s; /* Задержка перед началом */
}
.anim-show3{
background:#fff;
font-size:25px;
border:3px solid #2BA2DB;
padding:20px;
margin:left;
margin-bottom:20px;
text-align:left;
opacity:0; /*Элемент полностью прозрачный (невидимый)*/
transition: 1s; /*Скорость перехода состояния элемента*/
animation: show 3s 1; /* Указываем название анимации, её время и количество повторов*/
animation-fill-mode: forwards; /* Чтобы элемент оставался в конечном состоянии анимации */
animation-delay: 3s; /* Задержка перед началом */
}
@keyframes show{
0%{
opacity:0;
}
100% {
opacity:1;
}
}

 
div.headerM {
  width:100%;
  max-height: 15%;
  height: 155px;
  background: #fff;
  position: fixed;
    z-index: 9999;
}
.headerM2 {
  max-height: 100%;
}

button.dropbtn {
    background: none;
    max-height: 100%;
    height: 155px;
    border: none;
    cursor: pointer;
    outline: none;
}

.dropdown {
    position: relative;
    display: inline-block;
    z-index: 9999;

}

.dropdown-content {
    display: none;
    position: absolute;
    right: 0;
    background-color: rgba(66,79,99, 1);
    min-width: 500px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

.dropdown-content a {
    color: #fff;
    padding: 15px 50px;
    text-decoration: none;
    display: block;
}

.dropdown-content a:hover {background-color: none;}
.dropdown:hover .dropdown-content {display: block;}
.dropdown:hover .dropbtn {background-color: rgba(66,79,99, 0.1);}

.otstup {
  width:100%;
  max-height: 15%;
  height: 190px;
}


