@charset "utf-8";
/* CSS Document by Dinnero - dev: www.3dteapot.com*/
/*------------------------------------------------------------------------Base-*/
html, body{
	scroll-behavior: smooth;
	font-size: 14px;
	animation: 1.0s show ease;
}
/*------------------------------------------------------------------------Font`s-*/
@font-face{
	font-family:Inter-Regular;
	src: url(font/Inter-Regular.ttf);
}
@font-face{
	font-family:Inter-ExtraLight;
	src: url(font/Inter-ExtraLight.ttf);
}
@font-face{
	font-family:Inter-Bold;
	src: url(font/Inter-Bold.ttf);
}
@font-face{
	font-family:Inter-Medium;
	src: url(font/Inter-Medium.ttf);
}
@font-face{
	font-family:Inter-ExtraBold;
	src: url(font/Inter-ExtraBold.ttf);
}
/*------------------------------------------------------------------------Styles-page-*/
.link{text-decoration: none; color:#000000; transition:0.5s;}
.link:hover{text-decoration: underline; color:#49B78F; transition:0.5s;}
.link-green{text-decoration: none; color:#49B78F; transition:0.5s;}
.link-green:hover{text-decoration: underline; color:#000000; transition:0.5s;}
.menu-left{margin-left: 6%;}
@media (max-width: 1400px){
  .menu-left{
	margin-left: 4%;
}}
@media (max-width: 992px){
  .hide-992{
	  display: none;
}}
@media (max-width: 768px){
  .hide-786{
	  display: none;
}}
@media (max-width: 576px){
  .hide-576{
	  display: none;
}}
@media (min-width: 576px){
  .show-576{
	  display: none;
}}
@media (min-width: 992px){
  .show-992{
	  display: none;
}}
/*------------------------------------------------------------------------*/
.title-h1{
	font-size: 38px;
	font-family:Inter-Bold;
}
@media (max-width: 576px){
  .title-h1{
	font-size: 28px;
}}
.title-h2{
	font-size: 14px;
	line-height: 1.2;
	font-family:Inter-Bold;
}
.title-h3{
	font-size: 32px;
	line-height: 1.1;
	font-family:Inter-Regular;
}
@media (max-width: 576px){
  .title-h3{
	font-size: 24px;
}}
.title-h4{
	font-size: 32px;
	font-family:Inter-Bold;
	color: white;
	line-height: 1.1;
	margin-bottom: 20px;
}
@media (max-width: 576px){
  .title-h4{
	font-size: 24px;
}}
.title-h5{
	line-height: 1.2;
	font-size: 21px;
	font-family:Inter-Bold;
	margin-bottom: 30px;
}
@media (max-width: 576px){
  .title-h5{
	margin-right: 60px;
}}
.title-h6{
	font-size: 28px;
	font-family:Inter-Regular;
}
@media (max-width: 576px){
  .title-h6{
	font-size: 21px;
}}
.title-h7{
	color: black;
	font-size: 21px;
	font-family:Inter-Bold;
	margin-bottom: 5px;
	margin-top: 5px;
}
@media (max-width: 576px){
  .title-h7{
	font-size: 18px;
}}
/*------------------------------------------------------------------------*/
.green{color:#46B88F;}
.underline{text-decoration: underline;}
.bold{font-family:Inter-Bold;}
.regular{font-family:Inter-ExtraLight;}
/*------------------------------------------------------------------------*/
.top-oferta{margin-top:20px;}
.img-phone{margin-top:-5px;margin-right:5px;}
.img-client{margin-bottom: 10px;}
.img-work{margin-bottom:12px;margin-left:15px;}
.img-work-two{margin-bottom:12px;}
.img-pad-work{margin-left:10px;}
.img-plus{position: absolute; margin-top:-40px;}
.img-footer{margin-bottom:35px;}
.img-diagramm{margin-bottom:50px;}
.img-connect{margin-right: 15px;margin-top:-3px;}
.img-plus-block{margin-bottom:10px;}
.img-code{margin-top:-40px;margin-bottom:40px;}
.img-dialog{margin-top:-50px;margin-bottom:10px;}
.img-arrow{position: absolute;margin-top:-120px;margin-left: -50px;animation-duration: 2s;animation-iteration-count: infinite;}
/*------------------------------------------------------------------------*/
@media (max-width: 1200px){
  .img-arrow{
	display: none;
}}
.text-diagramm{
	margin-bottom: 20px;
	margin-top: -10px;
	width: 70%;
	font-size: 16px;
	line-height: 1.3;
}
@media (max-width: 1200px){
  .text-diagramm{
	width: 100%;
}}
/*------------------------------------------------------------------------*/
.text-head{margin-bottom: 20px; margin-top: 5px;}
.text-privacy{margin-top: 28px;line-height: 1.8;}
.text-mail{margin-top: 27px;}
.text-mail-left{margin-right: 20px;}
.text-oferta{
	position: absolute;
	margin-left: 30px;
	margin-top: -4px;
	line-height: 1.3;
	font-size: 13px;
}
/*------------------------------------------------------------------------*/
.text-social{margin-right: 5px;}
.text-slider{
	font-size: 13px; 
	margin-right: 25px;
	font-family:Inter-Regular;
}
@media (max-width: 1400px){
  .text-slider{
	display: block;
	margin-right:0px;
	margin-bottom: 20px;
}}
@media (max-width: 1200px){
  .text-slider{
	display: none;
}}
@media (min-width: 1200px){
  .text-slider-show{
	display: none;
}}
.text-slider-show{
	font-size: 13px; 
	margin-top: 25px;
	font-family:Inter-Regular;
}
@media (max-width: 992px){
  .text-social{
	margin-bottom: 30px;
}}
.back-lines{
	background-image: url(images/lines.svg);
	background-size: cover;
	background-repeat: no-repeat;
}
@media (max-width: 1400px){
  .back-lines{
	background-size: cover;
	background-position: left -140px top 0px;
}}
@media (max-width: 1200px){
  .back-lines{
	background-size: cover;
    background-position: left;
}}
.back-lines-two{
	background-image: url(images/lines-two.svg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: left bottom;	
}
.pad-mail{margin-top: 5px;}
.icons{transition:0.5s;}
.icons:hover{
	transform: scale(1.2);
	transition:0.5s;
}
/*------------------------------------------------------------------------Styles-head-*/
.head-logo{
	padding-top: 100px;
	height: 265px;
}
@media (max-width: 576px){
  .head-logo{
	padding-top: 80px;
	height: 190px;
}}
.head-menu{
	padding-top: 59px;
	text-align: center;	
	padding-left: 6%;
}
.head-cabinet{
	padding-top: 110px;
	text-align: right;
}
@media (max-width: 576px){
  .head-cabinet{
	padding-top: 82px;
	height: 190px;
}}
/*------------------------------------------------------------------------Styles-slider-*/
.slider-left{	
	text-align: right;
	font-size: 18px;
	line-height: 1.4;
}
@media (max-width: 1200px){
  .slider-left{
	text-align: center;
}}
@media (max-width: 576px){
  .slider-left{
	font-size: 16px;
}}
.slider-right{
	background-image:url(images/hand.svg);
	background-repeat: no-repeat;
	background-size: contain;
    background-position: left;
	min-height: 480px;    
	transition:0.5s;
	z-index: 100;
}
.slider-right:hover{
	transform: scale(1.15);
	transition:0.5s;
}
@media (max-width: 1200px){
  .slider-right{
	 background-position: center;
}}
@media (max-width: 1200px){
  .slider-right{
	  margin-top: 50px;	 
	  min-height: 400px;  
}}
@media (max-width: 768px){
  .slider-right:hover{
	  transform: scale(1.07);
}}
@media (max-width: 576px){
  .slider-right{
	  margin-top: 30px;	 
	  min-height: 270px;
}}
/*------------------------------------------------------------------------Styles-client-*/
.green-01{
	background-color: #169869;
	text-align: center;
	height: 135px;
	color: white;
	transition:0.45s;
	font-size: 14px;
	font-family:Inter-Medium;
	padding-top: 48px;
	line-height: 1.3;
	border-radius: 25px 0px 0px 25px;
	z-index: 900;
}
.green-01:hover{
	background-color: #24AD7C;
	transition:0.5s;
}
@media (max-width: 1200px){
  .green-01{
	border-radius: 25px 0px 0px 0px;
}}
.green-02{
	background-color: #219F72;
	text-align: center;
	height: 135px;
	color: white;
	transition:0.5s;
	font-size: 12px;
	font-family:Inter-Medium;
	padding-top: 28px;
	z-index: 900;
}
.green-02:hover{
	background-color: #24B984;
	transition:0.5s;
}
@media (max-width: 768px){
  .green-02{
	border-radius: 0px 25px 0px 0px;
}}
.green-03{
	background-color: #24AD7C;
	text-align: center;
	height: 135px;
	color: white;
	transition:0.3s;
	font-size: 12px;
	font-family:Inter-Medium;
	padding-top: 28px;
	z-index: 900;
}
.green-03:hover{
	background-color: #169869;
	transition:0.3s;
}
@media (max-width: 1200px){
  .green-03{
	border-radius: 0px 25px 0px 0px;
}}
@media (max-width: 992px){
  .green-03{
	border-radius: 0px 25px 0px 0px;
}}
@media (max-width: 768px){
  .green-03{
	border-radius: 0px 0px 0px 0px;
}}
.green-04{
	background-color: #24B984;
	text-align: center;
	height: 135px;
	color: white;
	transition:0.3s;
	font-size: 12px;
	font-family:Inter-Medium;
	padding-top: 28px;
	z-index: 900;
}
.green-04:hover{
	transition:0.3s;
	background-color: #219F72;
}
@media (max-width: 1200px){
  .green-04{
	border-radius: 0px 0px 0px 25px;
}}
@media (max-width: 768px){
  .green-04{
	border-radius: 0px 0px 0px 0px;
}}
.green-05{
	background-color: #21BF87;
	text-align: center;
	height: 135px;
	color: white;
	transition:0.3s;
	font-size: 12px;
	font-family:Inter-Medium;
	padding-top: 28px;
	z-index: 900;
}
.green-05:hover{
	transition:0.3s;
	background-color: #24AD7C;
}
@media (max-width: 768px){
  .green-05{
	border-radius: 0px 0px 0px 25px;
}}
.green-06{
	z-index: 900;
	background-color: #22C98E;
	text-align: center;
	height: 135px;
	color: white;
	transition:0.3s;
	font-size: 12px;
	font-family:Inter-Medium;
	padding-top: 28px;
	border-radius: 0px 25px 25px 0px;
}
.green-06:hover{
	background-color: #07BD7D;
	transition:0.3s;
}
@media (max-width: 1200px){
  .green-06{
	border-radius: 0px 0px 25px 0px;
}}
/*------------------------------------------------------------------------Styles-work-*/
.work-title{
	margin-top: 130px;
	padding-bottom: 30px;
	text-align: left;
}
/*------------------------------------------------------------------------Work-style-*/
.slider-block{
	padding-top:30px;
	height: 255px;
	max-width: 100%;	
	background-color: #F9F9F9;
	border-radius: 25px;
	text-align: center;
	color: #5E6674;
	font-size: 13px;
	transition: 0.5s;	
	line-height: 1.2;
}
.slider-block:hover{
	background-color: #F0F0F0;
	transition: 0.5s;
}
/*------------------------------------------------------------------------*/
.work-01{
	margin-top: 25px;
	margin-bottom: 25px;
	width: auto;
	height: 80px;
	background-image:url(images/work-01.svg);
	background-repeat: no-repeat;
	background-position: center;
}
.work-02{
	margin-top: 25px;
	margin-bottom: 25px;
	width: auto;
	height: 80px;
	background-image:url(images/work-02.svg);
	background-position: center;
	background-repeat: no-repeat;
}
.work-03{
	margin-top: 25px;
	margin-bottom: 25px;
	width: auto;
	height: 80px;
	background-image:url(images/work-03.svg);
	background-position: center;
	background-repeat: no-repeat;
}
.work-04{
	margin-top: 25px;
	margin-bottom: 25px;
	width: auto;
	height: 80px;
	background-image:url(images/work-04.svg);
	background-position: center;
	background-repeat: no-repeat;
}
.work-05{
	margin-top: 25px;
	margin-bottom: 25px;
	width: auto;
	height: 80px;
	background-image:url(images/work-05.svg);
	background-position: center;
	background-repeat: no-repeat;
}
/*------------------------------------------------------------------------Plus-style-*/
.plus{
	margin-top: 140px;
}
@media (max-width: 992px){
  .plus{
	  margin-top: 50px;	  
}}
.plus-left{
	background-color: #28A276;
	padding-left: 10%;
	padding-right: 10%;
	color: white;
	height: 300px;
	border-radius: 35px 0px 0px 35px;
	text-align: center;
	font-size: 14px;
	line-height: 1.4;
	font-family:Inter-ExtraLight;
	padding-top: 75px;
	background-image:url(images/back-plus.png);
	background-repeat: no-repeat;
	background-size: cover;
}
@media (max-width: 1200px){
  .plus-left{
	border-radius: 35px 35px 0px 0px;
	height: auto;
	padding-bottom: 65px;
}}
@media (max-width: 576px){
  .plus-left{
	padding-bottom: 55px;
}}
.plus-right{
	padding-top: 30px;
	background-color: #F9F9F9;
	color: black;
	height: 300px;
	border-radius: 0px 35px 35px 0px;
	font-size: 13px;
	line-height: 1.2;
	text-align: center;
}
@media (max-width: 992px){
  .plus-right{
	height: auto;
	padding-top: 40px;
	padding-bottom: 30px;
	border-radius: 0px 0px 35px 35px;
}}
.plus-icon{ 
	margin-top: -400px;
	align-self: flex-end;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    background-color:none;
    height: 98px;
	background-repeat: no-repeat;
    margin: 0 auto 0 auto;
    width: 100px;
	background-image:url(images/plus.png);
}
.plus-icon-animation {
    animation-name: bounce-1;
    animation-timing-function: linear;
 }
.pos-plus{
	margin-top: -115px;
	margin-bottom: 15px;
}
/*------------------------------------------------------------------------Footer-style*/
.footer{
	margin-top: 100px;
}
.footer-left{
	height: 220px;
	font-size: 13px;
	line-height: 1.5;
}
@media (max-width: 992px){
  .footer{
	padding-bottom: 20px;
}}
@media (max-width: 992px){
  .footer-left{
	text-align: center;
}}
.footer-right{
	padding-top: 10px;
	height: 220px;
	text-align: right;
	font-size: 13px;
	line-height: 1.5;
}
@media (max-width: 992px){
  .footer-right{
	text-align: center;
}}
/*------------------------------------------------------------------------Pay-style*/
.pay-title{
	margin-bottom: 30px;
	margin-top: 150px;
}
@media (max-width: 992px){
  .pay-title{
	margin-top: 110px;
}}
.pay{
	border: 2px dashed #CECECE;
	text-align: center;
	border-radius: 15px;
	padding-top: 30px;
	padding-bottom: 20px;
	transition:0.5s;
	line-height: 1.2;
}
.pay:hover{
	transition:0.5s;
	transform: scale(1.15);
}
/*------------------------------------------------------------------------Diagramm-style*/
.diagramm{	
	padding-top: 130px;
	padding-bottom: 130px;	
	margin-top: 100px;
	margin-bottom: 100px;
	background-image:url(images/diagramm.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}
@media (max-width: 992px){
  .diagramm{
	margin-bottom: 0px;
	background-image: none;
	padding-top: 0px;
	padding-bottom: 0px;
}}
.diagramm-left{
	text-align: right;
	padding-right: 6%;
}
@media (max-width: 992px){
  .diagramm-left{
	text-align: center;
	padding-right: 0%;
	padding-top:50px;
	padding-bottom: 50px;
	background-image:url(images/diagramm.svg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}}
.diagramm-right{
	text-align: left;
	padding-right: 6%;
}
@media (max-width: 992px){
  .diagramm-right{
	font-size: 14px;
	text-align: center;
	margin-bottom: 30px; 
	padding-right: 0%;
}}
/*------------------------------------------------------------------------Code-style*/
.code{
	margin-top: 170px;
	margin-bottom: 170px;
}
.code-banner{
	width: 100%;
	height: 590px;
	background-color: #F8F8F8;
	border-radius: 45px;
	text-align: center;
	font-size: 16px;
	line-height: 1.3;
	padding-left: 10%;
	padding-right: 10%;
}
@media (max-width: 1200px){
  .code-banner{
	padding-left: 2%;
	padding-right: 2%;
}}
@media (max-width: 992px){
  .code-banner{
	padding-left: 7%;
	padding-right: 7%;
}}
@media (max-width: 768px){
  .code-banner{
	height: auto;
	padding-bottom: 60px;
}}
@media (max-width: 576px){
  .code-banner{
	height: auto;
	padding-bottom: 50px;
}}
.code-banner img{
	width:100%;
	max-width:370px;
}
.text-code{
	margin-top: 10px;
	margin-bottom: 20px;
}
.code-left{
	text-align: center;
	font-size: 14px;
	line-height: 1.3;
}
/*------------------------------------------------------------------------Work-style-*/
.dialoge-block{
	padding-left: 10%;
	padding-right: 10%;
	max-width: 100%;	
	border: 3px solid #EBEBEB;
	border-radius: 25px;
	text-align: center;
	color: #5E6674;
	font-size: 16px;
	transition: 0.5s;	
	line-height: 1.6;
	height: 440px;
	margin-bottom: 47px;
}
.dialoge-block:hover{
	cursor: grab;
	transition: 0.5s;
}
@media (max-width: 992px){
  .dialoge-block{
	height: 500px;
	margin-bottom: 35px;
}}
@media (max-width: 768px){
  .dialoge-block{
	height: 450px;
	margin-bottom: 35px;
}}
@media (max-width: 576px){
  .dialoge-block{
	height: 100%;
	padding-left: 7%;
	padding-right: 7%;
	font-size: 14px;
	margin-bottom: -5px;
	padding-bottom: 20px;
	border: 2px solid #EBEBEB;
	min-height: 480px;
}}
.avatar-01{
	height: 134px;
	width: 134px;
	margin: 0 auto;
	background-color: white;
	background-image:url(images/avatar-01.png);
	background-repeat: no-repeat;
	background-size: cover;
	margin-top: -65px;
}
.avatar-02{
	height: 134px;
	width: 134px;
	margin: 0 auto;
	background-color: white;
	background-image:url(images/avatar-02.png);
	background-repeat: no-repeat;
	background-size: cover;
	margin-top: -65px;
}
.avatar-03{
	height: 134px;
	width: 134px;
	margin: 0 auto;
	background-color: white;
	background-image:url(images/avatar-03.png);
	background-repeat: no-repeat;
	background-size: cover;
	margin-top: -65px;
}
.star{
	background-image:url(images/stars.svg);
	background-repeat: no-repeat;
	background-size: cover;
	width: 120px;
	height: 20px;
	margin: 0 auto;
	margin-bottom: 20px;
}
.star-all{
	background-image:url(images/stars-all.svg);
	background-repeat: no-repeat;
	background-size: cover;
	width: 120px;
	height: 20px;
	margin: 0 auto;
	margin-bottom: 20px;
}
.signature{
	background-image:url(images/signature.png);
	background-repeat: no-repeat;
	background-size: cover;
	width: 174px;
	height: 156px;
	margin: 0 auto;
	margin-top: 50px;
}
.signature-01{
	background-image:url(images/signature-01.png);
	background-repeat: no-repeat;
	background-size: cover;
	width: 174px;
	height: 156px;
	margin: 0 auto;
	margin-top: 50px;
}
.signature-02{
	background-image:url(images/signature-02.png);
	background-repeat: no-repeat;
	background-size: cover;
	width: 174px;
	height: 156px;
	margin: 0 auto;
	margin-top: 50px;
}
/*-------------------------------------------------------------------------*/
@media (max-width: 1400px){
  .signature{
	margin-top: 20px;
}}
@media (max-width: 1200px){
  .signature{
	width: 144px;
	height: 126px;
	margin-top: 0px;
}}
@media (max-width: 992px){
  .signature{
	width: 144px;
	height: 126px;
	margin-top: 50px;
}}
@media (max-width: 768px){
  .signature{
	margin-top: 50px;
}}
@media (max-width: 576px){
  .signature{
	width: 124px;
	height: 106px;
	margin-top: 10px;
}}
/*-------------------------------------------------------------------------*/
@media (max-width: 1400px){
  .signature-01{
	margin-top: 20px;
}}
@media (max-width: 1200px){
  .signature-01{
	width: 144px;
	height: 126px;
	margin-top: 0px;
}}
@media (max-width: 992px){
  .signature-01{
	width: 144px;
	height: 126px;
	margin-top: 30px;
}}
@media (max-width: 768px){
  .signature-01{
	margin-top: 50px;
}}
@media (max-width: 576px){
  .signature-01{
	width: 124px;
	height: 106px;
	margin-top: 10px;
}}
/*-------------------------------------------------------------------------*/
@media (max-width: 1400px){
  .signature-02{
	margin-top: 20px;
}}
@media (max-width: 1200px){
  .signature-02{
	width: 144px;
	height: 126px;
	margin-top: 0px;
}}
@media (max-width: 992px){
  .signature-02{
	width: 144px;
	height: 126px;
	margin-top: 50px;
}}
@media (max-width: 768px){
  .signature-02{
	margin-top: 50px;
}}
@media (max-width: 576px){
  .signature-02{
	width: 124px;
	height: 106px;
	margin-top: 10px;
}}
/*-------------------------------------------------------------------------*/
.swing-img:hover {
  -webkit-animation: swing 0.6s ease;
   animation: swing 1.2s ease;
   -webkit-animation-iteration-count: 0;
   animation-iteration-count: 1;
}
/*------------------------------------------------------------------------Button-*/
.button-enter{
	font-family:Inter-Medium;
	border-radius:60px;
	background-color:#46B88F;
	text-align: center;
	color:#FFF;
	width:auto;
	font-size:12px;
	height:41px;
	padding-left: 47px;
	padding-right: 30px;
	transition-property: all;
	transition: all ease 0.5s;	
	line-height:0.0;
	border: 0px solid black;
	margin-right: 18px;
	margin-left: 18px;
	background-image:url(images/enter.svg);
	background-repeat: no-repeat;
	background-position: left 26px top 13px;
}
.button-enter:hover{
	color: white;
	transition:0.5s;
	cursor:pointer;
	background-color: #000;
}
@media (max-width: 576px){
  .button-enter{
	margin-right: 10px;
}}
/*------------------------------------------------------------------------Button-*/
.button-enter-footer{
	font-family:Inter-Medium;
	border-radius:60px;
	background-color:#46B88F;
	text-align: center;
	color:#FFF;
	width:auto;
	font-size:12px;
	height:41px;
	padding-left: 47px;
	padding-right: 30px;
	transition-property: all;
	transition: all ease 0.5s;	
	line-height:0.0;
	border: 0px solid black;
	margin-right: 0px;
	margin-left: 18px;
	background-image:url(images/enter.svg);
	background-repeat: no-repeat;
	background-position: left 26px top 13px;
}
.button-enter-footer:hover{
	color: white;
	transition:0.5s;
	cursor:pointer;
	background-color: #000;
}
@media (max-width: 576px){
  .button-enter-footer{
	margin-right: 10px;
}}
/*------------------------------------------------------------------------Button-*/
.button-connect{
	font-family:Inter-Medium;
	border-radius:60px;
	background-color:#46B88F;
	text-align: center;
	color:#FFF;
	width:auto;
	font-size:16px;
	height:75px;
	padding-left: 85px;
	padding-right: 45px;
	transition-property: all;
	transition: all ease 0.5s;	
	line-height:0.0;
	border: 0px solid black;
	background-image:url(images/connect.svg);
	background-repeat: no-repeat;
	background-position: left 45px top 24px;
}
.button-connect:hover{
	color: white;
	transition:0.5s;
	cursor:pointer;
	background-color: #000;
}
@media (max-width: 576px){
  .button-connect{
	height:60px;
	font-size:12px;
	background-position: left 40px top 16px;
	padding-left: 80px;
	padding-right: 40px;
}}
/*------------------------------------------------------------------------Button-*/
.button-modal{
	font-family:Inter-Medium;
	border-radius:60px;
	background-color:#46B88F;
	text-align: center;
	color:#FFF;
	width:100%;
	font-size:16px;
	height:85px;
	transition-property: all;
	transition: all ease 0.5s;	
	line-height:0.0;
	border: 0px solid black;
	margin-top: 70px;
}
.button-modal:hover{
	color: white;
	transition:0.5s;
	cursor:pointer;
	background-color: #000;
}
/*------------------------------------------------------------------------Button-*/
.button-diagramm-01{
	font-family:Inter-Medium;
	border-radius:60px;
	background-color:#007370;
	text-align: center;
	color:#FFF;
	width:auto;
	font-size:16px;
	height:60px;
	padding-left: 30px;
	padding-right: 30px;
	transition-property: all;
	transition: all ease 0.9s;	
	line-height:0.0;
	border: 0px solid black;
}
.button-diagramm-01:hover{
	transition:0.5s;
	transform: scale(1.35);
}
@media (max-width: 576px){
  .button-diagramm-01{
	font-size:14px;
	height:45px;
}}
/*------------------------------------------------------------------------Button-*/
.button-diagramm-02{
	font-family:Inter-Medium;
	border-radius:60px;
	background-color:#3652C6;
	text-align: center;
	color:#FFF;
	width:auto;
	font-size:16px;
	height:60px;
	padding-left: 30px;
	padding-right: 30px;
	transition-property: all;
	transition: all ease 0.9s;	
	line-height:0.0;
	border: 0px solid black;
}
.button-diagramm-02:hover{
	transition:0.5s;
	transform: scale(1.35);
}
@media (max-width: 576px){
  .button-diagramm-02{
	font-size:14px;
	height:45px;
}}
/*------------------------------------------------------------------------Button-*/
.button-diagramm-03{
	font-family:Inter-Medium;
	border-radius:60px;
	background-color:#FE8947;
	text-align: center;
	color:#FFF;
	width:auto;
	font-size:16px;
	height:60px;
	padding-left: 30px;
	padding-right: 30px;
	transition-property: all;
	transition: all ease 0.9s;	
	line-height:0.0;
	border: 0px solid black;
}
.button-diagramm-03:hover{
	transition:0.5s;
	transform: scale(1.35);
}
@media (max-width: 576px){
  .button-diagramm-03{
	font-size:14px;
	height:45px;
}}
/*------------------------------------------------------------------------Button-*/
.button-diagramm-04{
	font-family:Inter-Medium;
	border-radius:60px;
	background-color:#112A90;
	text-align: center;
	color:#FFF;
	width:auto;
	font-size:16px;
	height:60px;
	padding-left: 30px;
	padding-right: 30px;
	transition-property: all;
	transition: all ease 0.9s;	
	line-height:0.0;
	border: 0px solid black;
}
.button-diagramm-04:hover{
	transition:0.5s;
	transform: scale(1.35);
}
@media (max-width: 576px){
  .button-diagramm-04{
	font-size:14px;
	height:45px;
}}
/*------------------------------------------------------------------------Button-*/
.button-diagramm-05{
	font-family:Inter-Medium;
	border-radius:60px;
	background-color:#A12ABF;
	text-align: center;
	color:#FFF;
	width:auto;
	font-size:16px;
	height:60px;
	padding-left: 30px;
	padding-right: 30px;
	transition-property: all;
	transition: all ease 0.9s;	
	line-height:0.0;
	border: 0px solid black;
}
.button-diagramm-05:hover{
	transition:0.5s;
	transform: scale(1.35);
}
@media (max-width: 576px){
  .button-diagramm-05{
	font-size:14px;
	height:45px;
}}
/*-------------------------------------------------------------------------Modal-window*/
.modalDialogs {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
 	background: rgba(0,0,0,0.8);
	backdrop-filter: blur(5px);
	z-index: 900;
	-webkit-transition: opacity 600ms ease-in;
	-moz-transition: opacity 600ms ease-in;
 	transition: opacity 600ms ease-in;
	display: none;
	pointer-events: none;
	text-align:right;
	overflow-y: scroll;   
}
.modalDialogs::-webkit-scrollbar {
  width: 0;
}
.modalDialogs:target {
	display: block;
	pointer-events:auto;
}
.modalDialogs > div {
	width:100%;
	max-width:550px;
	height:auto;
	text-align: left;
	position:relative;
	margin:7% auto;
	padding: 50px 40px 50px 40px;
	background:#FFF;  
	border-radius:40px;
    -webkit-box-shadow: 3px 2px 167px 0px rgba(34, 60, 80, 0.6);
    -moz-box-shadow: 3px 2px 167px 0px rgba(34, 60, 80, 0.6);
    box-shadow: 3px 2px 67px 0px rgba(0, 0,0, 0.6);
	 animation-duration:0.6s; 
    animation-fill-mode:both;  
    animation-name:fadeInDown-II;
}
@media (max-width: 768px){
	.modalDialogs > div {
	border-radius:0px;
	max-width:100%;
	height:100%;
	width:100%;
	margin:0 auto;
	padding: 50px 20px 50px 20px;
}}
/*-------------------------------------------------------------------------Modal-window*/
.close {
  	position:absolute;
  	top:13px;
  	right:33px;
  	font-size:58px;
  	font-weight:400;
  	text-decoration:none;
  	color:#46B88F;
	transition:0.6s;
}
.close:hover {
	transform: scale(1.2);
	transition:0.6s;	
	color:#000;
}
@media (max-width: 768px){
  .close{
	right:15px;
}}
/*------------------------------------------------------------------------Animation`s*/
@keyframes fadeInDown-II { 
    0% {                
       opacity: 0;
       filter: blur(20px);
	   transform: scale(2.0);
    }
    100% {              
        opacity: 1;
        transform: none;
    }
}
@-webkit-keyframes swing {
  15% {
    -webkit-transform: translateX(9px);
    transform: translateX(9px);
  }
  30% {
    -webkit-transform: translateX(-9px);
    transform: translateX(-9px);
  }
  40% {
    -webkit-transform: translateX(6px);
    transform: translateX(6px);
  }
  50% {
    -webkit-transform: translateX(-6px);
    transform: translateX(-6px);
  }
  65% {
    -webkit-transform: translateX(3px);
    transform: translateX(3px);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
@keyframes show {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes bounce-1 {
   0%   { transform: translateY(0); }
   50%  { transform: translateY(-18px); }
   100% { transform: translateY(0); }
}
/*------------------------------------------------------------------------Input`s*/
.input{
	height:60px;
	width:100%;
	border:none;
	background-color:#F5F7F9;
	padding-left:25px;
	margin-right:7px;
	font-size:13px;
	border-radius:20px;
	margin-top:13px;
	color:#757575;
	-moz-appearance:none;
 	-webkit-appearance:none;
	appearance:none;
	transition:0.6s;
}
.input:hover{
	border-color:#34237c;	
	transition:0.6s;
} 
.input:focus{
	transition:0.6s;
	border-color:#0681FF; 
	box-shadow:0 0 12px 2px rgba(70, 184, 143, 0.8);
	box-shadow:0 0 0 3px -moz-mac-focusring; 
	color:#515050;
	outline:none; 
}
/*------------------------------------------------------------------------Checkbox*/
.checkbox.style-c {
  	display: inline-block;
  	position: relative;
  	cursor: pointer;
  	-webkit-user-select: none;
  	-moz-user-select: none;
  	-ms-user-select: none;
  	user-select: none;
}
.checkbox.style-c input {
  	position: absolute;
  	opacity: 0;
  	cursor: pointer;
  	height: 0;
  	width: 0;
}
.checkbox.style-c input:checked ~ .checkbox__checkmark {
  	background-color: #46B88F;
}
.checkbox.style-c input:checked ~ .checkbox__checkmark:after {
  	opacity: 1;
}
.checkbox.style-c:hover input ~ .checkbox__checkmark {
  	background-color: #46B88F;
}
.checkbox.style-c:hover input:checked ~ .checkbox__checkmark {
  	background-color: #46B88F;
}
.checkbox.style-c .checkbox__checkmark {
  	position: absolute;
  	top:0;
  	left:0;
  	height:20px;
 	width: 20px;
  	background-color: #d9d9d9;
  	transition: background-color 0.25s ease;
  	border-radius: 5px;
}
.checkbox.style-c .checkbox__checkmark:after {
    content: "";
    position: absolute;
    left: 8px;
    top: 4px;
    width: 5px;
    height: 10px;
 	border: solid #FFF;
  	border-width: 0 2px 2px 0;
  	transform: rotate(45deg);
  	opacity: 0;
  	transition: opacity 0.25s ease;
}
.checkbox.style-c .checkbox__body {
 	color: #333;
 	line-height: 1.2;
  	font-size: 12px;
}
/*------------------------------------------------------------------------Paginator*/
#testimonials-list-01 .shadow-effect p {
  font-family: inherit;
  font-size: 16px;
  line-height: 1.3;
}
#testimonials-list-01 .items {
  text-align: center;
  padding: 0px;
  -webkit-transform: scale3d(0.8, 0.8, 1);
  transform: scale3d(0.8, 0.8, 1);
  transition: all 0.3s ease-in-out;
}
#testimonials-list-01 .owl-item.active.center .items {
  opacity: 1;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
}
.owl-carousel .owl-item img {
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  border-radius: 50%;
}
#testimonials-list-01.owl-carousel .owl-dots .owl-dot.active span,
#testimonials-list-01.owl-carousel .owl-dots .owl-dot:hover span {
  background: #46B88F;
  -webkit-transform: translate3d(0px, -50%, 0px) scale(0.7);
  transform: translate3d(0px, -50%, 0px) scale(0.7);
	width: 45px;
}
#testimonials-list-01.owl-carousel .owl-dots {
  display: inline-block;
  width: 100%;
  text-align: center;
}
@media (max-width: 992px){
  .owl-carousel .owl-dots {
	margin-bottom: 100px;
}}
/*------------------------------------------------------------------------*/
#testimonials-list-01.owl-carousel .owl-dots .owl-dot {
  display: inline-block;
}
#testimonials-list-01.owl-carousel .owl-dots .owl-dot span {
  background: #CECECE;
  display: inline-block;
  height: 15px;
  margin: 0 0px 5px;
  -webkit-transform: translate3d(0px, -50%, 0px) scale(0.3);
  transform: translate3d(0px, -50%, 0px) scale(0.3);
  -webkit-transform-origin: 50% 50% 0;
  transform-origin: 50% 50% 0;
  transition: all 250ms ease-out 0s;
  width: 25px;
  border-radius: 100px;
}
/*------------------------------------------------------------------------Styles-brand*/
.back-brand{
	width: 100%;
	height: 100px;
	margin-top: -70px;
}
/*------------------------------------------------------------------------Styles-brand-animation*/
@-webkit-keyframes scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(-50px * 1));
  }
}
@keyframes scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(-250px * 5));
  }
}
.slider {
  height: 100px;
  margin: auto;
  overflow: hidden;
  position: relative;
  width: auto;
}
.slider::before, .slider::after {
  background: linear-gradient(to right, white 0%, rgba(255, 255, 255, 0) 100%);
  content: "";
  height: 100px;
  position: absolute;
  width: 200px;
  z-index: 2;
}
.slider::after {
  right: 0;
  top: 0;
  transform: rotateZ(180deg);
}
.slider::before {
  left: 0;
  top: 0;
}
.slider .slide-track {
  -webkit-animation: scroll 35s linear infinite;
          animation: scroll 35s linear infinite;
  display: flex;
  width: calc(150px * 14);
}
.slider .slide {
	padding-top: 20px;
	padding-left: 50px;
}
/*------------------------------------------------------------------------Animation-start*/
@keyframes singl {
    0% {
        transform: translateY(-100%);
		filter: blur(15px);
    }

    100% {
        transform: translateY(0);
    }
}
.singl {
    animation-duration: 1.2s;
    animation-name: singl;
}
/*------------------------------------------------------------------------Animation-start*/
@keyframes singls {
    0% {
        transform: translateX(100%);
		filter: blur(15px);
    }

    100% {
        transform: translateX(0);
    }
}
.singls {
    animation-duration: 1.2s;
    animation-name: singls;
}
/*------------------------------------------------------------------------Animation-start*/
@keyframes singlsy {
    0% {
        transform: translateX(-100%);
		filter: blur(15px);
    }

    100% {
        transform: translateX(0);
    }
}
.singlsy {
    animation-duration: 1.2s;
    animation-name: singlsy;
}
/*------------------------------------------------------------------------Loader-*/
#preloader {
      left: 0;
      top: 0;
      z-index: 9999;
      width: 100%;
      height: 100%;
      background: rgb(10,117,79);
	  background: linear-gradient(29deg, rgba(10,117,79,1) 0%, rgba(15,161,109,1) 100%); 
	  position: absolute;
	  overflow: none;
}  
.visible {
  visibility: visible;
  opacity: 1;
  transition: opacity 1.5s linear;
}
.hidden {
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s 0.7s, opacity 0.7s linear;
}
/*------------------------------------------------------------------------Loader-animation*/
.loader {
  width: 112px;
  height: 112px;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
}
.box1,
.box2,
.box3 {
  border: 16px solid #f5f5f5;
  box-sizing: border-box;
  position: absolute;
  display: block;
}
.box1 {
  width: 112px;
  height: 48px;
  margin-top: 64px;
  margin-left: 0px;
  animation: abox1 3s 0.3s forwards ease-in-out infinite;
}
.box2 {
  width: 48px;
  height: 48px;
  margin-top: 0px;
  margin-left: 0px;
  animation: abox2 3s 0.3s forwards ease-in-out infinite;
}
.box3 {
  width: 48px;
  height: 48px;
  margin-top: 0px;
  margin-left: 64px;
  animation: abox3 3s 0.3s forwards ease-in-out infinite;
}
@keyframes abox1 {
  0% {
    width: 112px;
    height: 48px;
    margin-top: 64px;
    margin-left: 0px;
  }

  12.5% {
    width: 48px;
    height: 48px;
    margin-top: 64px;
    margin-left: 0px;
  }

  25% {
    width: 48px;
    height: 48px;
    margin-top: 64px;
    margin-left: 0px;
  }

  37.5% {
    width: 48px;
    height: 48px;
    margin-top: 64px;
    margin-left: 0px;
  }

  50% {
    width: 48px;
    height: 48px;
    margin-top: 64px;
    margin-left: 0px;
  }

  62.5% {
    width: 48px;
    height: 48px;
    margin-top: 64px;
    margin-left: 0px;
  }

  75% {
    width: 48px;
    height: 112px;
    margin-top: 0px;
    margin-left: 0px;
  }

  87.5% {
    width: 48px;
    height: 48px;
    margin-top: 0px;
    margin-left: 0px;
  }

  100% {
    width: 48px;
    height: 48px;
    margin-top: 0px;
    margin-left: 0px;
  }
}
/*------------------------------------------------------------------------Loader-animation*/
@keyframes abox2 {
  0% {
    width: 48px;
    height: 48px;
    margin-top: 0px;
    margin-left: 0px;
  }

  12.5% {
    width: 48px;
    height: 48px;
    margin-top: 0px;
    margin-left: 0px;
  }

  25% {
    width: 48px;
    height: 48px;
    margin-top: 0px;
    margin-left: 0px;
  }

  37.5% {
    width: 48px;
    height: 48px;
    margin-top: 0px;
    margin-left: 0px;
  }

  50% {
    width: 112px;
    height: 48px;
    margin-top: 0px;
    margin-left: 0px;
  }

  62.5% {
    width: 48px;
    height: 48px;
    margin-top: 0px;
    margin-left: 64px;
  }

  75% {
    width: 48px;
    height: 48px;
    margin-top: 0px;
    margin-left: 64px;
  }

  87.5% {
    width: 48px;
    height: 48px;
    margin-top: 0px;
    margin-left: 64px;
  }

  100% {
    width: 48px;
    height: 48px;
    margin-top: 0px;
    margin-left: 64px;
  }
}
/*------------------------------------------------------------------------Loader-animation*/
@keyframes abox3 {
  0% {
    width: 48px;
    height: 48px;
    margin-top: 0px;
    margin-left: 64px;
  }

  12.5% {
    width: 48px;
    height: 48px;
    margin-top: 0px;
    margin-left: 64px;
  }

  25% {
    width: 48px;
    height: 112px;
    margin-top: 0px;
    margin-left: 64px;
  }

  37.5% {
    width: 48px;
    height: 48px;
    margin-top: 64px;
    margin-left: 64px;
  }

  50% {
    width: 48px;
    height: 48px;
    margin-top: 64px;
    margin-left: 64px;
  }

  62.5% {
    width: 48px;
    height: 48px;
    margin-top: 64px;
    margin-left: 64px;
  }

  75% {
    width: 48px;
    height: 48px;
    margin-top: 64px;
    margin-left: 64px;
  }

  87.5% {
    width: 48px;
    height: 48px;
    margin-top: 64px;
    margin-left: 64px;
  }

  100% {
    width: 112px;
    height: 48px;
    margin-top: 64px;
    margin-left: 0px;
  }
}
/*------------------------------------------------------------------------Dropdown-world*/
.dropbtn {
    padding: 0px;
    cursor: pointer;
}
.dropdown {
    position: relative;
    display: inline-block;
}
.dropdown-content {
    display: none;
    position: absolute;
    width: 20px;
	padding-top: 15px;
	z-index: 9999;
}
.dropbtn
{
  padding-left: 0px;
  width: 20px;
}
.dropbtn::after { 
    content: "";
    height: 16px;
    position: absolute;
    right: 0;
    width: 20px;
}
.dropdown-content a {
    color: black;
    padding: 5px 0 5px 0px;
    text-decoration: none;
    display: block;
}
.dropdown-content a:hover {
	background-color: none;
	color: #46B88F;
	text-decoration: underline;
	transition:0.5s;
}
.dropdown:hover .dropdown-content {
    display: block;
}
/*------------------------------------------------------------------------Production-version*/
.send-img{
	margin-top: 70px;
	margin-bottom: 10px;
}
.send-center{
	text-align: center;
	line-height:1.3;
	font-size: 16px;
	margin-bottom: -10px;
}
/*------------------------------------------------------------------------Terms-*/
.terms{
	margin-top: 0px;
	padding-bottom: 30px;
	text-align: left;
}
/*-------------------------------------------------------------------------*/
.fixedbut { 
	position: fixed; 
	bottom: 24px;
	margin-left: 26px;
	display: block; 
	background: #000;  
	color: #fff; 
	text-decoration: none; 
	padding: 16px 30px 30px 30px; 
	z-index: 999999;
	height: 60px;
	font-size: 16px;
	width: auto;
	border-radius: 100px;	
	transition:all ease 0.8s;
}
.fixedbut:hover{ 
	background: #222;
	cursor: pointer;	
	transition:all ease 0.8s;  
	transform: scale(1.1); 
}
.fixedbut-left{
	margin-left: 160px;
}
@media (max-width: 576px){
  .fixedbut-left{
	  margin-bottom: 75px;
	  margin-left: 26px;
}}