:root {
  /* öâåò  */
  --blue: rgba(36, 50, 74, 1); /*  */
  --red: #f14200; 
  --green: #91c81d;
  
  --grad: linear-gradient(to right,var(--blue) 0%,var(--red) 51%, var(--blue) 100%);  
  --grad2: linear-gradient(to right,var(--blue) 0%,var(--red) 100%);
  
  --grad_reverse: linear-gradient(to right,var(--blue) 0%,var(--blue) 51%, var(--red) 100%); 
  
}

.text_grad {
	background: -webkit-linear-gradient(var(--blue), var(--red));
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}


.border_grad {
	background: -webkit-linear-gradient(var(--blue), var(--red));
	padding: 3px;
}

.red {
	color: var(--red);
}

.decor_textline {
	display: inline-block; 
	background-image: linear-gradient(transparent 50%, rgba(241,66,0,0.8) 10%);
	background-repeat: repeat-x;
	background-size: 200% 100%;
}
.decor_textline2 {
	display: inline-block; 
	background-image: linear-gradient(transparent 50%, rgba(241,66,0,0.5) 10%);
	background-repeat: repeat-x;
	background-size: 200% 100%;
	-moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px;
}

/* BUTTONS */

.btn {
	display: inline-block; position: relative;
	-webkit-appearance: none;
	color: #fff; 
	padding: 15px 25px 15px 45px; 
	font-size: 14px;
	line-height: 130%;
	font-family: 'l_r'; cursor: pointer; 
	text-decoration: none !important; text-transform: uppercase;
	/*border-radius: 25px;	-webkit-border-radius: 25px;*/
	-webkit-transition: all 0.4s ease-in-out 0s;-moz-transition: all 0.4s ease-in-out 0s;-o-transition: all 0.4s ease-in-out 0s;
}

.btn:before {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 30px;
  content: "";
  background: #222;
  transition: .5s;
  opacity: 0;
  border-top-right-radius: 33px;
  border-bottom-right-radius: 33px;
  z-index: -1;
  border-top-left-radius: 33px;
}
.btn:hover:before {
	width: 100%;
	border-radius: 0;
	opacity: 1;
}

.btn span {
	position: absolute; left: 13px; top: 13px;
	font-size: 20px;
}


.btn_trans {
	background: transparent;
	background: rgba(0,0,0,0.2);
	border: 1px solid #fff;
	color: #fff;
}
.btn.btn_trans:before {
	background: #fff;
}
.btn_trans:hover {
  background-position: right center;
  background: none;
  color: var(--blue);
}



.btn_red {
/*	border: 1px solid var(--red);*/
	color: #fff;
	background: var(--red);
}
.btn_red:hover {
	color: #fff;
	background: transparent;
}

.btn.btn_big {
	font-family: 'l_h'; font-size: 22px;
}
.btn.btn_nolink {
	cursor:inherit;
}


/* Wave effect */
.wave-effect { position: absolute; z-index: 1; left: 0; right: 0; bottom: 0; margin: auto; height: 150px; overflow: hidden; z-index: 99; }
.waves-shape.shape-one { z-index: 15; opacity: 0.5; }
.waves-shape.shape-two { z-index: 10; opacity: 0.75; }
.waves-shape.shape-three { z-index: 5; }
.wave { position: absolute; left: 0; width: 200%; height: 100%; background-repeat: repeat no-repeat; 
	background-position: 0 bottom; transform-origin: center bottom; }
.waves-shape { position: absolute; bottom: -1px; width: 100%; height: 100%; overflow: hidden; }
.wave-one { background-image: url('../images/wave-1.png'); background-size: 50% 100px; }
.wave-two { background-image: url('../images/wave-2.png'); background-size: 50% 120px; }
.wave-anim .wave-two {
    -webkit-animation:move-wave 15s linear infinite;
	   -moz-animation:move-wave 15s linear infinite;
			animation:move-wave 15s linear infinite;
}
.wave-three {background-image:url('../images/wave-3.png'); background-size:50% 100px;}
.wave-anim .wave-three {
    -webkit-animation:move-wave 20s linear infinite;
	   -moz-animation:move-wave 20s linear infinite;
			animation:move-wave 20s linear infinite;
}
@keyframes move-wave {
    0% {
        transform:translateX(0) translateZ(0) scaleY(1);
    }
	
    50% {
        transform:translateX(-25%) translateZ(0) scaleY(0.55);
    }
	
    100% {
        transform:translateX(-50%) translateZ(0) scaleY(1);
    }
}


