.particles {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

::-webkit-input-placeholder { /* Chrome */
  color: #666;
  transition: opacity 250ms ease-in-out;
}
:focus::-webkit-input-placeholder {
  opacity: 0.5;
}
:-ms-input-placeholder { /* IE 10+ */
  color: #666;
  transition: opacity 250ms ease-in-out;
}
:focus:-ms-input-placeholder {
  opacity: 0.5;
}
::-moz-placeholder { /* Firefox 19+ */
  color: #666;
  opacity: 1;
  transition: opacity 250ms ease-in-out;
}
:focus::-moz-placeholder {
  opacity: 0.5;
}
:-moz-placeholder { /* Firefox 4 - 18 */
  color: #666;
  opacity: 1;
  transition: opacity 250ms ease-in-out;
}
:focus:-moz-placeholder {
  opacity: 0.5;
}

.particles div {
    position: absolute;
    text-align: center;
    font-size: 30px;
    font-weight: bold;
    line-height: 40px;
    color: #FFF;
    font-family: 'Roboto Condensed', sans-serif;
    text-transform: uppercase;
    animation: neon-1 .1s ease-in-out infinite alternate;
}
@keyframes neon-1 {
    from {
        text-shadow: 0 0 6px rgba(202, 228, 225, 0.92), 0 0 30px rgba(202, 228, 225, 0.34), 0 0 12px rgba(191, 226, 255, 0.52), 0 0 21px rgba(191, 226, 255, 0.92), 0 0 34px rgba(191, 226, 255, 0.78), 0 0 54px rgba(191, 226, 255, 0.92);
    }
    to {
        text-shadow: 0 0 6px rgba(202, 228, 225, 0.98), 0 0 30px rgba(202, 228, 225, 0.42), 0 0 12px rgba(191, 226, 255, 0.58), 0 0 22px rgba(191, 226, 255, 0.84), 0 0 38px rgba(191, 226, 255, 0.88), 0 0 60px #FFF;
    }
}
.particles canvas {
    width: 100%;
    height: 500px;
    background-image: url('home-vid-img.jpg');
    background-position: center center;
    background-size: cover;
}




   @font-face {
	font-family: 'Bahnschrift';
	src: url('fonts/Bahnschrift.eot');
	src: url('fonts/Bahnschrift.woff') format('woff'), url('fonts/Bahnschrift.ttf') format('truetype'), url('fonts/Bahnschrift.svg') format('svg');
}





@font-face {
    font-family: 'Montserrat';
    src: url('fonts/bender.eot');
    src: url('fonts/bender.eot?#iefix') format('embedded-opentype'),
        url('fonts/bender.woff') format('woff'),
        url('fonts/bender.ttf') format('truetype');
    font-weight: normal;
    font-style: nformal;
}

.rotate-shadows {
  width: 220px;
  height: 220px;
  position: relative;
}
.rotate-shadows:after,
.rotate-shadows:before {
  content: "";
  border-radius: 50%;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform-origin: center center;
}
.rotate-shadows:before {
  box-shadow: inset 0 20px 0 rgba(0, 250, 250, 0.6), inset 20px 0 0 rgba(0, 200, 200, 0.6), inset 0 -20px 0 rgba(0, 150, 200, 0.6), inset -20px 0 0 rgba(0, 200, 250, 0.6);
  animation: rotate-before 2s -0.5s linear infinite;
}
.rotate-shadows:after {
  box-shadow: inset 0 20px 0 rgba(250, 250, 0, 0.6), inset 20px 0 0 rgba(250, 200, 0, 0.6), inset 0 -20px 0 rgba(250, 150, 0, 0.6), inset -20px 0 0 rgba(250, 100, 0, 0.6);
  animation: rotate-after 2s -0.5s linear infinite;
}
@keyframes rotate-after {
  0% {transform: rotateZ(0deg) scaleX(1) scaleY(1);}
  50% {transform: rotateZ(180deg) scaleX(0.82) scaleY(0.95);}
  100% {transform: rotateZ(360deg) scaleX(1) scaleY(1);}
}
@keyframes rotate-before {
  0% {transform: rotateZ(0deg) scaleX(1) scaleY(1);}
  50% {transform: rotateZ(-180deg) scaleX(0.95) scaleY(0.85);}
  100% {transform: rotateZ(-360deg) scaleX(1) scaleY(1);}
}

.asap {  line-height: 1.5em; font-family: Arial; font-size: 10px; font-weight: bold; text-decoration: none; color: #00a5e4; -webkit-transition: color 500ms linear;    -moz-transition: color 500ms linear;    -o-transition: color 500ms linear;    -ms-transition: color 500ms linear;    transition: color 500ms linear; }
.asap:hover {  line-height: 1.5em; text-decoration: none; font-weight: bold;  color: #999; -webkit-transition: color 500ms linear;    -moz-transition: color 500ms linear;    -o-transition: color 500ms linear;    -ms-transition: color 500ms linear;    transition: color 500ms linear; }

.asapp {   box-shadow: 0 0 15px rgba(0,0,0,0.2);   -ms-user-select: none; -moz-user-select: none;  -khtml-user-select: none; -webkit-user-select: none;  background-color: #f5f5f5; 
 -webkit-transition : box-shadow 300ms ease-out;
  -moz-transition : box-shadow 300ms ease-out; 
  -o-transition : box-shadow 300ms ease-out;
  transition : box-shadow 300ms ease-out;
   }
.asapp:hover {  box-shadow: 0 0 25px rgba(0,0,0,0.4);    -ms-user-select: none; -moz-user-select: none;  -khtml-user-select: none; -webkit-user-select: none;  
 background-color: #fff; 
 -webkit-transition : box-shadow 300ms ease-out;
  -moz-transition : box-shadow 300ms ease-out; 
  -o-transition : box-shadow 300ms ease-out;
  transition : box-shadow 300ms ease-out;
 

 }







.btno { font-family: Play; color: #fff; font-size: 23px; width: 300px; background-color: #025bd4;   -moz-border-radius: 27px;   border: 0px #008aff solid; border-radius: 27px;  cursor: pointer; height: 72px; padding-top: 20px; -webkit-transition : background-color 300ms ease-out;  -moz-transition : background-color 300ms ease-out;  -o-transition : background-color 300ms ease-out;  transition : background-color 300ms ease-out;vertical-align: middle; text-align: center;}
.btno:hover { font-family: Play; color: #d4dfec; font-size: 23px; width: 300px; background-color: #113f7e;  -moz-border-radius: 27px;   border: 0px #ff0089 solid; border-radius: 27px; cursor: pointer; height: 72px; vertical-align: middle; text-align: center; -webkit-transition : background-color 300ms ease-out;  -moz-transition : background-color 300ms ease-out;  padding-top: 20px;   -o-transition : background-color 300ms ease-out;  transition : background-color 300ms ease-out;}

.button-blue {   -webkit-transition: background 0.3s ease-out;  
    -moz-transition: background 0.3s ease-out;  
    -o-transition: background 0.3s ease-out; 
    transition: background 0.3s ease-out;
box-shadow: inset 0px 1px 0px 0px #80c7e8;	margin: 0 auto;
background: -webkit-linear-gradient(to bottom, #3389e0 5%, #2889b2 50%);	
background: linear-gradient(to bottom, #3389e0 5%, #2889b2 50%); 
background: -moz-linear-gradient(to bottom, #3389e0 5%, #2889b2 50%);	
background: -o-gradient(to bottom, #3389e0 5%, #2889b2 50%);
background-size:1px 100px; 
border-radius: 6px;    
border:1px solid #2b5aa8;   -ms-user-select: none; -moz-user-select: none;  -khtml-user-select: none; -webkit-user-select: none;  
display:inline-block;    color:#ffffff;    
font-family: Montserrat;    font-size:16px;    font-weight:bold;       
 text-decoration:none;    text-shadow:1px 1px 0px #528009;    text-align: center;
height: 20px; width: 175px; padding:12px 9px; cursor: pointer;}

 



.button-blue:hover { border:1px solid #2b5aa8;  background-position:70px; text-decoration:none; cursor: pointer; color: #fff; }
.button-blue:active {    position:relative;    top:1px;}


.button-vel  {   -webkit-transition: background 1s ease-out;  
    -moz-transition: background 1s ease-out;  
    -o-transition: background 1s ease-out; 
    transition: background 1s ease-out;
box-shadow: inset 0px 1px 0px 0px #80c7e8;	
background: -webkit-linear-gradient(to bottom, #ec4a57 5%, #e44855 50%);	
background: linear-gradient(to bottom, #ec4a57 5%, #e44855 50%); 
background: -moz-linear-gradient(to bottom, #ec4a57 5%, #e44855 50%);	
background: -o-gradient(to bottom, #ec4a57 5%, #e44855 50%); 
background-size:1px 100px; 
border-radius: 6px;    
border:1px solid #e44855;    
display:inline-block;    color:#ffffff;    
font-family: Montserrat;    font-size:16px;    font-weight:bold;       
 text-decoration:none;    text-shadow:1px 1px 0px #528009;    text-align: center;
height: 15px; width: 145px; padding:12px 9px; cursor: pointer;}

.button-vel:hover { border:1px solid #e44855;  background-position:70px; text-decoration:none; cursor: pointer; color: #fff; }
.button-vel:active {    position:relative;    top:1px;}


@media (max-width: 1000px)  { .eff { content: "";  background:  url('../inv.jpg')  no-repeat;  background-size:  auto 100%;  background-position:0; -webkit-transition:all 1s ease; -moz-transition:all 1s ease; -o-transition:all 1s ease; transition:all 1s ease;} .eff:hover{ background-position: -50px;   background-size:  auto 110%;   }    }
@media (min-width: 1000px)  {   .eff { content: "";  background:  url('../inv.jpg')  no-repeat;  background-size:  100% auto;  background-position:0; -webkit-transition:all 1s ease; -moz-transition:all 1s ease; -o-transition:all 1s ease; transition:all 1s ease;} .eff:hover{ background-position: -50px;   background-size:  110% auto;  }  }
 
 
 .eff2 {
 content: ""; 
background:  url('../cnt.jpg') center center no-repeat; 
background-position:0;
    -webkit-transition:all 1s ease;
    -moz-transition:all 1s ease;
    -o-transition:all 1s ease;
    transition:all 1s ease;
}
 .eff2:hover{
      background-position: -50px;
    }
 
 
 

.eff1 {
 content: ""; 
background:  url('../ev.jpg') center center no-repeat; 
background-position:0;
    -webkit-transition:all 1s ease;
    -moz-transition:all 1s ease;
    -o-transition:all 1s ease;
    transition:all 1s ease;
}
 .eff1:hover{
      background-position: -50px;
    }
	video {
  object-fit: cover;
}
 
  .b-video {
      width: 100%;
      min-height:645px;
      
      position: relative;
      overflow: hidden;
      z-index: 1;
}
.viedeo__file{
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
}


@media (max-width: 768px) and (min-width: 300px) { .immg{ width:360px; } .scte{width: 360px;   margin-left: -180px; margin-top: 50px; }}
@media (max-width: 1000px) and (min-width: 768px) { .immg{ width: 500px; } .scte{width: 500px;   margin-left: -250px; }}
@media (max-width: 1200px) and (min-width: 1000px) {.immg{ width: 600px; } .scte{width: 600px;   margin-left: -300px; }}
@media (max-width: 1500px) and (min-width: 1200px) { .immg{ width: 600px; } .scte{width: 600px;   margin-left: -300px; }}
@media (max-width: 1800px) and (min-width: 1500px)  { .immg{ width: 700px; } .scte{width: 700px;   margin-left: -350px; }}
@media (min-width: 1800px) { .immg{ width: 700px; } .scte{width: 700px;   margin-left: -350px; }}

.ssli  {
font-size: 12px;   color: #0042ff;     cursor: pointer;
 font-family: 'Arial';    text-decoration: none;
 -webkit-transition : color 300ms ease-out;
  -moz-transition : color 300ms ease-out; 
  -o-transition : color 300ms ease-out;
  transition : color 300ms ease-out;
}
.ssli:hover {
font-size: 12px;   color: #4e4e4e;   cursor: pointer;
 font-family: 'Arial';     text-decoration: none;
 -webkit-transition : color 300ms ease-out;
  -moz-transition : color 300ms ease-out; 
  -o-transition : color 300ms ease-out;
  transition : color 300ms ease-out;
}

.ss  {
font-size: 15px;   color: #fff;   border-bottom: 2px dashed  #ff008a; height: 25px; cursor: pointer;
 font-family: 'Verdana'; line-height: 26px; font-weight: bold; text-decoration: none; white-space:nowrap;
 -webkit-transition : color 300ms ease-out;
  -moz-transition : color 300ms ease-out; 
  -o-transition : color 300ms ease-out;
  transition : color 300ms ease-out;
}

.ss:hover {
font-size: 15px;   color: #ccc;  border-bottom: none;   height: 25px; cursor: pointer;
 font-family: 'Verdana';  line-height: 26px;  font-weight: bold; text-decoration: none;
 -webkit-transition : color 300ms ease-out;
  -moz-transition : color 300ms ease-out; 
  -o-transition : color 300ms ease-out;
  transition : color 300ms ease-out;
}



.cl {
  color: #fff; font-size: 15px; width: 30px; background-color: #3a67c5; height: 30px;
 -moz-border-radius: 17px;    border-radius: 17px; line-height: 30px;  
cursor: pointer; text-align: center;
 -webkit-transition : background-color 300ms ease-out;
  -moz-transition : background-color 300ms ease-out; 
  -o-transition : background-color 300ms ease-out;
  transition : background-color 300ms ease-out;
box-shadow: 0 0 15px rgba(0,0,0,0.5);
}
.cl:hover {
  color: #fff; font-size: 15px; width: 30px; background-color: #3e454c; height: 30px; -moz-border-radius: 17px;  border-radius: 17px; line-height: 30px;  
cursor: pointer; text-align: center;
 -webkit-transition : background-color 300ms ease-out;
  -moz-transition : background-color 300ms ease-out; 
  -o-transition : background-color 300ms ease-out;
  transition : background-color 300ms ease-out; box-shadow: 0 0 15px rgba(0,0,0,0.5);
}
.asa {  line-height: 1.5em; font-family: Arial; font-size: 13px; font-weight: bold; text-decoration: none; color: #7e8996; -webkit-transition: color 500ms linear;    -moz-transition: color 500ms linear;    -o-transition: color 500ms linear;    -ms-transition: color 500ms linear;    transition: color 500ms linear; }
.asa:hover {  line-height: 1.5em; text-decoration: none; font-weight: bold;  color: #00a5e4; -webkit-transition: color 500ms linear;    -moz-transition: color 500ms linear;    -o-transition: color 500ms linear;    -ms-transition: color 500ms linear;    transition: color 500ms linear; }

.sh1 {  opacity=0; display: none }
.sh {   opacity=1; display: block }

body,html,div {   
margin: 0px;  padding: 0px;  box-sizing: border-box; 
font-family: Montserrat;
}
.bgf1 {
text-indent: 0.2em;
    text-align: justify;
font-family: 'Montserrat'; font-size: 14px; color: #000; border: 1px #c4c4c4 solid;  
 background-color: #ffffff; text-align: left; cursor: pointer; 
  -moz-border-radius: 5px; border-radius: 5px; padding: 0px; 
 height: 46px;  box-sizing: border-box;   outline: 0px;
 padding-left: 7px;   transition: border 0.05s;
}
.bgf1:focus {
font-family: 'Montserrat'; font-size: 14px; color: #000;  
  -moz-border-radius: 5px; border-radius: 5px;
 text-align: left; cursor: pointer;  outline: 0px;
 padding: 0px;  transition: border 0.05s;
height: 46px;   
  border: double 2px transparent;
  background-image: linear-gradient(white, white), radial-gradient(circle at top left, #377fca,#d801ff);
  background-origin: border-box;
  background-clip: content-box, border-box;
  box-sizing: border-box;
text-indent: 0.7em;
    text-align: justify;
 
  
}
.bh {
  border: 0px #dfe0e2 solid;  
}

.bh:hover {
 cursor: pointer;    border: 0px #c5c7cb solid;  border-radius: 1px;  
}

 .m1 {
position:absolute; display: none; z-index: 7234;
}

.m2 {
position:absolute; display: block; z-index: 7234;
}

.menus {
font-size: 19px;   color: #fff;   border-bottom: 1px solid #555; height: 100%; cursor: pointer;
background-color: #222; -webkit-transition: background-color 500ms linear; -moz-transition: background-color 500ms linear; -o-transition: background-color 500ms linear; -ms-transition: background-color 500ms linear; transition: background-color 500ms linear;
font-family: 'Hermes'; padding-left: 17px;
}

.menus:hover {
font-size: 19px; cursor: pointer;  color: #0075ff;   border-bottom: 1px solid #555; 
    background-color: #333; -webkit-transition: background-color 500ms linear; -moz-transition: background-color 500ms linear; -o-transition: background-color 500ms linear; -ms-transition: background-color 500ms linear; transition: background-color 500ms linear;
font-family: 'Hermes'; padding-left: 17px;  
}
.menn {
font-family: 'Hermes'; 
height: 35px; 
font-size: 18px;
padding-top: 12px;
color: #c4c4c4;
 white-space: nowrap;
display: inline-block;
background-color: #0b0b0c;
cursor: pointer;
-webkit-transition: background-color 250ms linear;    -moz-transition: background-color 250ms linear;    -o-transition: background-color 250ms linear;    -ms-transition: background-color 250ms linear;    transition: background-color 250ms linear;
vertical-align: middle;}

.menn:hover {
font-family: 'Hermes';  
font-size: 18px;
height: 35px; 
padding-top: 12px;
 white-space: nowrap;
display: inline-block;
color: #ffffff;
background-color: #61b300;
cursor: pointer;
-webkit-transition: background-color 250ms linear;    -moz-transition: background-color 250ms linear;    -o-transition: background-color 250ms linear;    -ms-transition: background-color 250ms linear;    transition: background-color 250ms linear;
vertical-align: middle;
}
 
@font-face {
	font-family: 'Hermes';
	src: url('fonts/ofont.ru_Hermes.eot');
	src: url('fonts/ofont.ru_Hermes.woff') format('woff'), url('fonts/ofont.ru_Hermes.ttf') format('truetype'), url('fonts/ofont.ru_Hermes.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}


@font-face {
    font-family: 'Montserrat';
    src: url('fonts/bender_light.eot');
    src: url('fonts/bender_light.eot?#iefix') format('embedded-opentype'),
        url('fonts/bender_light.woff') format('woff'),
        url('fonts/bender_light.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}


.mmn {  font-family: Arial; font-size: 13px; font-weight: normal;  line-height: 25px;  color: #b6b6b6; text-decoration: none; }
.mmn:hover {  font-family: Arial; font-weight: normal;  font-size:  13px; line-height: 25px; color: #fff; text-decoration: none;  }

td {  font-family: Montserrat;  font-size:13px;  text-decoration: none;  color: #000000 }
 
 

input:active, textarea:active {
    outline: none;
} 
:focus {
    outline: none;
}



}


::-webkit-input-placeholder {color:#ccc;   }
::-moz-placeholder          {color:#ccc;  }/* Firefox 19+ */
:-moz-placeholder           {color:#ccc; }/* Firefox 18- */
:-ms-input-placeholder      {color:#ccc;  }
.alpha60 {
    /* Fallback for web browsers that don't support RGBa */
    background-color: rgb(0, 0, 0);
    /* RGBa with 0.6 opacity */
    background-color: rgba(0, 0, 0, 0.6);
    /* For IE 5.5 - 7*/
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
    /* For IE 8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
}
body {
background-color: #eaecf0;
}


.fre {  left: 0px; top: 200px; outline: none; z-index: 3423235; }
.fres { position: fixed; left: 0px; top: 0px; z-index: 3423235; outline: none;  border-color: #00a5e4 #00a5e4 #00a5e4 #00a5e4; border-style: solid; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 3px; border-left-width: 0px;}

.fld {
  color: #383838; font-size: 15px; width: 100px; background-color: #000; height: 30px; -moz-border-radius: 17px;   border: 2px #ff0000 solid; border-radius: 17px; line-height: 30px;   text-align: center;
 padding-left: 0px; font-family: Verdana;
 -webkit-transition : background-color 300ms ease-out;
  -moz-transition : background-color 300ms ease-out; 
  -o-transition : background-color 300ms ease-out;
  transition : background-color 300ms ease-out;
}

.fld:focus {
 color: #ccc; font-size: 15px; width: 100px; background-color: #171717; height: 30px; -moz-border-radius: 17px;   border: 2px #e0012e solid; border-radius: 17px; line-height: 30px;   text-align: center;
 padding-left: 0px; font-family: Verdana;
 -webkit-transition : background-color 300ms ease-out;
  -moz-transition : background-color 300ms ease-out; 
  -o-transition : background-color 300ms ease-out;
  transition : background-color 300ms ease-out;
}

 
input:active, textarea:active {
    outline: none;
} 
:focus {
    outline: none;
}

.red {
font-size: 12px;  
font-family: Verdana;  font-weight:bold;
color: #ff0000; text-decoration:none; text-transform:uppercase;
}
.black {
font-size: 12px;  
font-family: Verdana; 
color: #000; text-decoration:none;
font-weight:bold;
}
.grey {
font-size: 12px;  
font-family: Verdana; 
color: #ccc; text-decoration:none;
}

.menu {
font-size: 19px; top: 20px;
font-family: 'Hermes'; 
color: #fff; text-decoration:none; -webkit-transition: color 200ms linear;
    -moz-transition: color 200ms linear;
    -o-transition: color 200ms linear;
    -ms-transition: color 200ms linear;
    transition: color 200ms linear;
}
.menu:hover {
font-size: 19px; text-decoration:none
font-family: Verdana;  top: 20px;
color: #0000ff;
text-decoration:none; -webkit-transition: color 200ms linear;
    -moz-transition: color 200ms linear;
    -o-transition: color 200ms linear;
    -ms-transition: color 200ms linear;
    transition: color 200ms linear;
}
.lnk {
font-size: 11px;
font-family: 'Hermes'; 
color: #003399; -webkit-transition: color 200ms linear;
    -moz-transition: color 200ms linear;
    -o-transition: color 200ms linear;
    -ms-transition: color 200ms linear;
    transition: color 200ms linear;
}
.lnk:hover {
font-size: 11px;
font-family: Verdana; 
color: #ff0000; 
text-decoration:none; -webkit-transition: color 200ms linear;
    -moz-transition: color 200ms linear;
    -o-transition: color 200ms linear;
    -ms-transition: color 200ms linear;
    transition: color 200ms linear;
}
 .modal {  opacity=0; display: none; position:absolute; left:0; top:0; width:100%; height:100%; z-index:1000;  position:fixed; bottom: expression( document.getElementsByTagName( 'body' )[0].scrollBottom+ "px"); }
.modal_open {   opacity=1; display: block; position:absolute; left:0; top:0; width:100%; height:100%; z-index:1000; position:fixed; bottom: expression( document.getElementsByTagName( 'body' )[0].scrollBottom+ "px"); }
.sh1 {  opacity=0; display: none }
.sh {   opacity=1; display: inline-block;  }
.sh1 {  opacity=0; display: none }
.sh {   opacity=1; display: block }

h1 { margin: 0px; padding: 0x; font-size: 25px; text-decoration: uppercase;
font-family: Arial; 
color: #65767e;  }

.footer_block{float:left;margin:0 70px 0 0}.footer_block.soc_links{margin:0}


 .circle_link,.circle_link:before{position:relative;width:30px;height:30px;font-size:16px;color:#fff}.f_right_margin{margin:0 17px 0 0}.circle_link{background:rgba(255,255,255,.1);-webkit-transition:-webkit-transform ease-out .1s,background .2s;-moz-transition:-moz-transform ease-out .1s,background .2s;transition:transform ease-out .1s,background .2s;display:inline-block;cursor:pointer;border-radius:50%;text-align:center;z-index:1}.circle_link:before{top:6px;left:0;content:" ";speak:none;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;display:block;-webkit-font-smoothing:antialiased}#mysite_renew_list ol li,.toggle-resp{font-weight:700}.circle_link:after{pointer-events:none;position:absolute;width:100%;height:100%;border-radius:50%;content:'';-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;top:0;left:0;padding:0;z-index:-1;box-shadow:0 0 0 2px rgba(255,255,255,.1);opacity:0;-webkit-transform:scale(.9);-moz-transform:scale(.9);-ms-transform:scale(.9);transform:scale(.9)}.circle_link:hover{background:rgba(255,255,255,.05);-webkit-transform:scale(.93);-moz-transform:scale(.93);-ms-transform:scale(.93);transform:scale(.93);color:#fff}.circle_link:hover:after{-webkit-animation:sonarEffect 1.3s ease-out 75ms;-moz-animation:sonarEffect 1.3s ease-out 75ms;animation:sonarEffect 1.3s ease-out 75ms}.vk_link:before{ background:url(../vk.png);  background-size: 20px 18px; background-position: center top; background-repeat: no-repeat; }.fb_link:before{left:-1px; background:url(../fb.png); background-size: 20px 18px; background-position: center top; background-repeat: no-repeat; }.tw_link:before{background:url(../tw.png); background-position: center top; background-repeat: no-repeat;}.fl_left{float:right;margin:0 10px}.footer_right{float:right}#footer_logo{position:relative;left:-17px}

.inst_link:before{background:url(../inst.png);  background-size: 20px 18px; background-position: center top; background-repeat: no-repeat;} 

.bdn{border:none}.file_ico{color:#5c5c5c;font-size:21px}@-webkit-keyframes sonarEffect{0%{opacity:.3}40%{opacity:.5;box-shadow:0 0 0 2px rgba(255,255,255,.1),0 0 5px 5px #3C5059,0 0 0 5px rgba(255,255,255,.5)}100%{box-shadow:0 0 0 2px rgba(255,255,255,.1),0 0 5px 5px #3C5059,0 0 0 5px rgba(255,255,255,.5);-webkit-transform:scale(1.5);opacity:0}}@-moz-keyframes sonarEffect{0%{opacity:.3}40%{opacity:.5;box-shadow:0 0 0 2px rgba(255,255,255,.1),0 0 5px 5px #3C5059,0 0 0 5px rgba(255,255,255,.5)}100%{box-shadow:0 0 0 2px rgba(255,255,255,.1),0 0 5px 5px #3C5059,0 0 0 5px rgba(255,255,255,.5);-moz-transform:scale(1.5);opacity:0}}@keyframes sonarEffect{0%{opacity:.3}40%{opacity:.5;box-shadow:0 0 0 2px rgba(255,255,255,.1),0 0 5px 5px #3C5059,0 0 0 5px rgba(255,255,255,.5)}100%{box-shadow:0 0 0 2px rgba(255,255,255,.1),0 0 5px 5px #3C5059,0 0 0 5px rgba(255,255,255,.5);transform:scale(1.5);opacity:0}}


.boxHidded{
   visibility: hidden; /*  Делаем иконки полностью прозрачными  */
}
.fadeInUp, .fadeOutDown{
   visibility: visible;  /*  Делаем иконки полностью не прозрачными  */
}



.slide-scroll {
  position: absolute;
  top: 50%;
  right: 2%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  z-index: 20;
}

.slide-scroll-up,
.slide-scroll-down {
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  background: rgba(136, 140, 142, 0.62);
  border-radius: 50%;
  -webkit-animation: button-fade 4s infinite;
          animation: button-fade 4s infinite;
-webkit-transition: opacity 500ms linear;
    -moz-transition: opacity 500ms linear;
    -o-transition: opacity 500ms linear;
    -ms-transition: opacity 500ms linear;
    transition: opacity 500ms linear;
}

.slide-scroll-up:before,
.slide-scroll-down:before {
  position: absolute;
  content: "";
  width: 22px;
  height: 22px;
  background: transparent;
  border: 2px solid #dfdfdf;
  border-bottom-width: 0;
  border-right-width: 0;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  margin-top: 20px;
  -webkit-transform: scaleX(0.8) rotate(45deg);
      -ms-transform: scaleX(0.8) rotate(45deg);
          transform: scaleX(0.8) rotate(45deg);
}

.slide-scroll-up:hover,
.slide-scroll-down:hover {
opacity: 0.4;
filter: alpha(opacity=40);
-webkit-transition: opacity 500ms linear;
    -moz-transition: opacity 500ms linear;
    -o-transition: opacity 500ms linear;
    -ms-transition: opacity 500ms linear;
    transition: opacity 500ms linear;
}

.slide-scroll-down {
  margin-top: 35px;
}

.slide-scroll-down:before {
  -webkit-transform: scaleX(0.8) rotate(225deg);
      -ms-transform: scaleX(0.8) rotate(225deg);
          transform: scaleX(0.8) rotate(225deg);
  margin-top: 10px;
}

.scrollto {
font-size: 17px; top: 20px;
font-family: 'Bahnschrift'; 
color: #fff; text-decoration:none; -webkit-transition: color 200ms linear;
    -moz-transition: color 200ms linear;
    -o-transition: color 200ms linear;
    -ms-transition: color 200ms linear;
    transition: color 200ms linear;
}
.scrollto:hover {
font-size: 17px; text-decoration:none
   top: 20px;
color: #95b4d3;
text-decoration:none; -webkit-transition: color 200ms linear;
    -moz-transition: color 200ms linear;
    -o-transition: color 200ms linear;
    -ms-transition: color 200ms linear;
    transition: color 200ms linear;
}

.proto {
font-size: 15px; top: 20px; font-weight:bold;
font-family: 'Arial'; 
color: #fff; text-decoration:none; -webkit-transition: color 200ms linear;
    -moz-transition: color 200ms linear;
    -o-transition: color 200ms linear;
    -ms-transition: color 200ms linear;
    transition: color 200ms linear;
}
.proto:hover {
font-size: 15px; text-decoration:none
font-family: Arial;  top: 20px; font-weight:bold;
color: #419fff;
text-decoration:none; -webkit-transition: color 200ms linear;
    -moz-transition: color 200ms linear;
    -o-transition: color 200ms linear;
    -ms-transition: color 200ms linear;
    transition: color 200ms linear;
}

