h1, h2 {
  font-weight: 700;
  color: #000;
}

/* Эффект при наведении на картинку с текстом CSS
Общие стили */
*, *:after, *:before { 
	border-box; 
	box-sizing: border-box; 
}
.clearfix:before, .clearfix:after { 
	content: ''; 
	display: table; 
}
.clearfix:after { 
	clear: both; 
}
.hover-text-one {
	overflow: hidden;
	margin: 0;
	width: 100%;
	list-style: none;
	text-align: center;

}
.hover-text-one figure {
	position: relative;
	z-index: 1;
	display: inline-block;
	overflow: hidden;
	/*background: #527c82;*/
	text-align: center;
	cursor: pointer;
}
.hover-text-one figure img {
	position: relative;
	display: block;
	min-height: 100%;
	opacity: 0.8;
}
.hover-text-one figure figcaption {
	padding: 2em;
	color: #fff;
	text-transform: uppercase;
	font-size: 1.25em;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
.hover-text-one figure figcaption::before,
.hover-text-one figure figcaption::after {
	pointer-events: none;
}
.hover-text-one figure figcaption{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.hover-text-one figure h3 {
font-size: 18px;
	word-spacing: -0.15em;
	font-weight: 300;
padding: 10px!important;
margin: 10px!important;
background: #D7B369;
	color: #000 !important;
}
.hover-text-one figure h3 span {
	font-weight: 800;
}
.hover-text-one figure h3,
.hover-text-one figure p {
	margin: 0;
}
.hover-text-one figure p {
	letter-spacing: 1px;
	font-size: 68.5%;
}

/* Эффект при наведении */

figure {
border: 4px solid #474a51;
}

figure.effect-text-three {
	background: #527c82;
}
figure.effect-text-three img {
	width: -webkit-calc(100% + 20px);
	width: calc(100% + 20px);
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	transform: scale(1.1);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
figure.effect-text-three:hover img {
	opacity: 0.4;
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}
figure.effect-text-three figcaption {
	text-align: left;
}
figure.effect-text-three h3 {
	position: relative;
	overflow: hidden;
	padding: 0.5em 0;
}
figure.effect-text-three h3::after {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 3px;
	background: #fff;
	content: '';
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
	-webkit-transform: translate3d(-100%,0,0);
	transform: translate3d(-100%,0,0);
}
figure.effect-text-three:hover h3::after {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}
figure.effect-text-three p {
	padding: 1em 0;
	opacity: 0;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: translate3d(100%,0,0);
	transform: translate3d(100%,0,0);
}
figure.effect-text-three:hover p {
	opacity: 1;
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}
     
/*-- =============== Списки border ===================== --*/

.border {
list-style: none;
padding: 0;
margin-bottom: 30px;
}
.border li {
/*-- font-family: "Trebuchet MS", "Lucida Sans"; --*/
padding: 7px 20px;
margin-bottom: 10px;
border-radius: 5px;
border-left: 10px solid #f05d22; 
box-shadow: 2px -2px 5px 0 rgba(0,0,0,.1),
     -2px -2px 5px 0 rgba(0,0,0,.1),
    2px 2px 5px 0 rgba(0,0,0,.1),
    -2px 2px 5px 0 rgba(0,0,0,.1);
font-size: 16px;
letter-spacing: 2px;
transition: 0.3s all linear;
}
.border li:nth-child(2){border-color: #8bc63e;}
.border li:nth-child(3){border-color: #fcba30;}
.border li:nth-child(4){border-color: #1ccfc9;}
.border li:nth-child(5){border-color: #493224;}
.border li:hover {border-left: 10px solid transparent;}
.border li:nth-child(1):hover {border-right: 10px solid #f05d22;}
.border li:nth-child(2):hover {border-right: 10px solid #8bc63e;}
.border li:nth-child(3):hover {border-right: 10px solid #fcba30;}
.border li:nth-child(4):hover {border-right: 10px solid #1ccfc9;}
.border li:nth-child(5):hover {border-right: 10px solid #493224;}

/* call button animated / Анимированная кнопка звонка */

.btn-call {
 background: #e61400;
 border: 2px solid #fff;
 border-radius: 50%;
 box-shadow: 0 8px 10px rgba(56, 163, 253, 0.3);
 cursor: pointer;
 height: 60px;
 width: 60px;
 text-align: center;
 position: fixed;
 left: 50px;
 bottom: 50px;
 z-index: 999;
 transition: .3s;
 -webkit-animation: hoverWave linear 1s infinite;
 animation: hoverWave linear 1s infinite;
 display: flex;
 justify-content: center;
 align-items: center;
 text-decoration: none;
}

.btn-call__ico {
 display: flex;
 justify-content: center;
 align-items: center;
 animation: 1200ms ease 0s normal none 1 running shake;
 animation-iteration-count: infinite;
 -webkit-animation: 1200ms ease 0s normal none 1 running shake;
 -webkit-animation-iteration-count: infinite;
 color: white;
 font-size: 30px;
 padding-top: 5px;
 transition: .3s all;
}

.btn-call:hover {
 background-color: #0c2a5c;
}

.btn-call:hover .btn-call__ico {
 color: #ffc400;
}

@-webkit-keyframes hoverWave {
 0% {
 box-shadow: 0 8px 10px rgba(56, 163, 253, 0.3), 0 0 0 0 rgba(56, 163, 253, 0.2), 0 0 0 0 rgba(56, 163, 253, 0.2)
 }

 40% {
 box-shadow: 0 8px 10px rgba(56, 163, 253, 0.3), 0 0 0 15px rgba(56, 163, 253, 0.2), 0 0 0 0 rgba(56, 163, 253, 0.2)
 }

 80% {
 box-shadow: 0 8px 10px rgba(56, 163, 253, 0.3), 0 0 0 30px rgba(56, 163, 253, 0), 0 0 0 26.7px rgba(56, 163, 253, 0.067)
 }

 100% {
 box-shadow: 0 8px 10px rgba(56, 163, 253, 0.3), 0 0 0 30px rgba(56, 163, 253, 0), 0 0 0 40px rgba(56, 163, 253, 0.0)
 }
}

@keyframes hoverWave {
 0% {
 box-shadow: 0 8px 10px rgba(56, 163, 253, 0.3), 0 0 0 0 rgba(56, 163, 253, 0.2), 0 0 0 0 rgba(56, 163, 253, 0.2)
 }

 40% {
 box-shadow: 0 8px 10px rgba(56, 163, 253, 0.3), 0 0 0 15px rgba(56, 163, 253, 0.2), 0 0 0 0 rgba(56, 163, 253, 0.2)
 }

 80% {
 box-shadow: 0 8px 10px rgba(56, 163, 253, 0.3), 0 0 0 30px rgba(56, 163, 253, 0), 0 0 0 26.7px rgba(56, 163, 253, 0.067)
 }

 100% {
 box-shadow: 0 8px 10px rgba(56, 163, 253, 0.3), 0 0 0 30px rgba(56, 163, 253, 0), 0 0 0 40px rgba(56, 163, 253, 0.0)
 }
}

/* animations icon */

@keyframes shake {
 0% {
 transform: rotateZ(0deg);
 -ms-transform: rotateZ(0deg);
 -webkit-transform: rotateZ(0deg);
 }

 10% {
 transform: rotateZ(-30deg);
 -ms-transform: rotateZ(-30deg);
 -webkit-transform: rotateZ(-30deg);
 }

 20% {
 transform: rotateZ(15deg);
 -ms-transform: rotateZ(15deg);
 -webkit-transform: rotateZ(15deg);
 }

 30% {
 transform: rotateZ(-10deg);
 -ms-transform: rotateZ(-10deg);
 -webkit-transform: rotateZ(-10deg);
 }

 40% {
 transform: rotateZ(7.5deg);
 -ms-transform: rotateZ(7.5deg);
 -webkit-transform: rotateZ(7.5deg);
 }

 50% {
 transform: rotateZ(-6deg);
 -ms-transform: rotateZ(-6deg);
 -webkit-transform: rotateZ(-6deg);
 }

 60% {
 transform: rotateZ(5deg);
 -ms-transform: rotateZ(5deg);
 -webkit-transform: rotateZ(5deg);
 }

 70% {
 transform: rotateZ(-4.28571deg);
 -ms-transform: rotateZ(-4.28571deg);
 -webkit-transform: rotateZ(-4.28571deg);
 }

 80% {
 transform: rotateZ(3.75deg);
 -ms-transform: rotateZ(3.75deg);
 -webkit-transform: rotateZ(3.75deg);
 }

 90% {
 transform: rotateZ(-3.33333deg);
 -ms-transform: rotateZ(-3.33333deg);
 -webkit-transform: rotateZ(-3.33333deg);
 }

 100% {
 transform: rotateZ(0deg);
 -ms-transform: rotateZ(0deg);
 -webkit-transform: rotateZ(0deg);
 }
}

@-webkit-keyframes shake {
 0% {
 transform: rotateZ(0deg);
 -ms-transform: rotateZ(0deg);
 -webkit-transform: rotateZ(0deg);
 }

 10% {
 transform: rotateZ(-30deg);
 -ms-transform: rotateZ(-30deg);
 -webkit-transform: rotateZ(-30deg);
 }

 20% {
 transform: rotateZ(15deg);
 -ms-transform: rotateZ(15deg);
 -webkit-transform: rotateZ(15deg);
 }

 30% {
 transform: rotateZ(-10deg);
 -ms-transform: rotateZ(-10deg);
 -webkit-transform: rotateZ(-10deg);
 }

 40% {
 transform: rotateZ(7.5deg);
 -ms-transform: rotateZ(7.5deg);
 -webkit-transform: rotateZ(7.5deg);
 }

 50% {
 transform: rotateZ(-6deg);
 -ms-transform: rotateZ(-6deg);
 -webkit-transform: rotateZ(-6deg);
 }

 60% {
 transform: rotateZ(5deg);
 -ms-transform: rotateZ(5deg);
 -webkit-transform: rotateZ(5deg);
 }

 70% {
 transform: rotateZ(-4.28571deg);
 -ms-transform: rotateZ(-4.28571deg);
 -webkit-transform: rotateZ(-4.28571deg);
 }

 80% {
 transform: rotateZ(3.75deg);
 -ms-transform: rotateZ(3.75deg);
 -webkit-transform: rotateZ(3.75deg);
 }

 90% {
 transform: rotateZ(-3.33333deg);
 -ms-transform: rotateZ(-3.33333deg);
 -webkit-transform: rotateZ(-3.33333deg);
 }

 100% {
 transform: rotateZ(0deg);
 -ms-transform: rotateZ(0deg);
 -webkit-transform: rotateZ(0deg);
 }
}
