/* Thin */
@font-face {
  font-family: Roboto;
  src: url("//advert.video/land/fonts/Thin/Roboto-Thin.woff2?v=2.137") format("woff2"), url("./fonts/Thin/Roboto-Thin.woff?v=2.137") format("woff");
  font-weight: 100;
  font-style: normal; }
/* Thin Italic */
@font-face {
  font-family: Roboto;
  src: url("//advert.video/land/fonts/ThinItalic/Roboto-ThinItalic.woff2?v=2.137") format("woff2"), url("./fonts/ThinItalic/Roboto-ThinItalic.woff?v=2.137") format("woff");
  font-weight: 100;
  font-style: italic; }
/* Light */
@font-face {
  font-family: Roboto;
  src: url(".//advert.video/land/fonts/Light/Roboto-Light.woff2?v=2.137") format("woff2"), url("./fonts/Light/Roboto-Light.woff?v=2.137") format("woff");
  font-weight: 300;
  font-style: normal; }
/* Light Italic */
@font-face {
  font-family: Roboto;
  src: url("//advert.video/land/fonts/LightItalic/Roboto-LightItalic.woff2?v=2.137") format("woff2"), url("./fonts/LightItalic/Roboto-LightItalic.woff?v=2.137") format("woff");
  font-weight: 300;
  font-style: italic; }
/* Regular */
@font-face {
  font-family: Roboto;
  src: url("//advert.video/land/fonts/Regular/Roboto-Regular.woff2?v=2.137") format("woff2"), url("./fonts/Regular/Roboto-Regular.woff?v=2.137") format("woff");
  font-weight: 400;
  font-style: normal; }
@font-face {
  font-family: Roboto;
  src: url("//advert.video/land/fonts/Regular/Roboto-Regular.woff2?v=2.137") format("woff2"), url("./fonts/Regular/Roboto-Regular.woff?v=2.137") format("woff");
  font-weight: normal;
  font-style: normal; }
/* Italic */
@font-face {
  font-family: Roboto;
  src: url("//advert.video/land/fonts/Italic/Roboto-Italic.woff2?v=2.137") format("woff2"), url("./fonts/Italic/Roboto-Italic.woff?v=2.137") format("woff");
  font-weight: 400;
  font-style: italic; }
@font-face {
  font-family: Roboto;
  src: url("//advert.video/land/fonts/Italic/Roboto-Italic.woff2?v=2.137") format("woff2"), url("./fonts/Italic/Roboto-Italic.woff?v=2.137") format("woff");
  font-weight: normal;
  font-style: italic; }
/* Medium */
@font-face {
  font-family: Roboto;
  src: url("//advert.video/land/fonts/Medium/Roboto-Medium.woff2?v=2.137") format("woff2"), url("./fonts/Medium/Roboto-Medium.woff?v=2.137") format("woff");
  font-weight: 500;
  font-style: normal; }
/* Medium Italic */
@font-face {
  font-family: Roboto;
  src: url("//advert.video/land/fonts/MediumItalic/Roboto-MediumItalic.woff2?v=2.137") format("woff2"), url("./fonts/MediumItalic/Roboto-MediumItalic.woff?v=2.137") format("woff");
  font-weight: 500;
  font-style: italic; }
/* Bold */
@font-face {
  font-family: Roboto;
  src: url("//advert.video/land/fonts/Bold/Roboto-Bold.woff2?v=2.137") format("woff2"), url("./fonts/Bold/Roboto-Bold.woff?v=2.137") format("woff");
  font-weight: 700;
  font-style: normal; }
@font-face {
  font-family: Roboto;
  src: url("//advert.video/land/fonts/Bold/Roboto-Bold.woff2?v=2.137") format("woff2"), url("./fonts/Bold/Roboto-Bold.woff?v=2.137") format("woff");
  font-weight: bold;
  font-style: normal; }
/* Bold Italic */
@font-face {
  font-family: Roboto;
  src: url("//advert.video/land/fonts/BoldItalic/Roboto-BoldItalic.woff2?v=2.137") format("woff2"), url("./fonts/BoldItalic/Roboto-BoldItalic.woff?v=2.137") format("woff");
  font-weight: 700;
  font-style: italic; }
@font-face {
  font-family: Roboto;
  src: url("//advert.video/land/fonts/BoldItalic/Roboto-BoldItalic.woff2?v=2.137") format("woff2"), url("./fonts/BoldItalic/Roboto-BoldItalic.woff?v=2.137") format("woff");
  font-weight: bold;
  font-style: italic; }
/* Black */
@font-face {
  font-family: Roboto;
  src: url("//advert.video/land/fonts/Black/Roboto-Black.woff2?v=2.137") format("woff2"), url("./fonts/Black/Roboto-Black.woff?v=2.137") format("woff");
  font-weight: 900;
  font-style: normal; }
/* Black Italic */
@font-face {
  font-family: Roboto;
  src: url("//advert.video/land/fonts/BlackItalic/Roboto-BlackItalic.woff2?v=2.137") format("woff2"), url("./fonts/BlackItalic/Roboto-BlackItalic.woff?v=2.137") format("woff");
  font-weight: 900;
  font-style: italic; }
body{
font-family: Roboto;
font-size: 16px;
min-width: 300px;
}
.navbar-header{
height: 84px;
margin: 0;
}
.navbar{
margin: 0;
}
.navbar-inverse .navbar-nav>li>a{
color: #fff;
font-weight: 500;
}
.navbar-blue{
background: #3b4256;
}
@media (min-width: 768px){
.nav>li{
	margin-top: 17px;
	margin-left: 5px;
	margin-right: 5px;
	}
.nav-regis{
border: 1px solid #fff;
border-radius: 3px;
position: relative;
overflow: hidden;
}
.nav-regis:link:after, .nav-regis:visited:after {
  content: "";
  position: absolute;
  background: none repeat scroll 0 0 #fff;
  height: 0%;
  left: 50%;
  top: 50%;
  width: 200%;
  z-index: -1;
  -webkit-transition: all .3s ease 0s;
  -moz-transition: all .3s ease 0s;
  -o-transition: all .3s ease 0s;
  transition: all .3s ease 0s;
}
.nav-regis:link:hover, .nav-regis:visited:hover {
  color: #3b4256!important;
  text-shadow: none;
}
.nav-regis:link:hover:after, .nav-regis:visited:hover:after {
  height: 420%;
}

.nav-regis:after {
  -moz-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
  -ms-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
  -webkit-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
  transform: translateX(-50%) translateY(-50%) rotate(-45deg);
}
.navbar-nav{
float: right;
}
.nav-for-whom span, .nav-instr span, .nav-cont span{
	transform-style: preserve-3d;
	transition: all 300ms ease;
	position: relative;
	display: inline-block;
}
.nav-for-whom span:after, .nav-instr span:after, .nav-cont span:after {
	top: -100%;
    left: 0px;
    padding: 0;
    position: absolute;
    transform-origin: left bottom;
    transform: rotateX(90deg);
}
.nav-for-whom span:after{
	content: 'Для кого это?';
}
.nav-instr span:after{
	content: 'Инструменты';
}
.nav-cont span:after{
	content: 'Контакты';
}
.nav-for-whom span:hover, .nav-instr span:hover, .nav-cont span:hover{
	transform-origin: center bottom;
	transform: rotateX(-90deg) translateY(100%);
}
}
.navbar-inverse .navbar-toggle{
border-color: #fff;
margin-top: 26px;
}
.navbar-inverse .navbar-toggle:focus .icon-bar, .navbar-inverse .navbar-toggle:hover .icon-bar{
background-color: #3b4256;
}
.navbar-inverse .navbar-toggle:focus, .navbar-inverse .navbar-toggle:hover{
background-color: #fff;
}
.hAdvert{
margin-top: 50px;
font-size: 60px;
font-weight: 900;
color: #3b4256;
animation-duration: 1000ms;
}
.hAdvert span{
border-bottom: 5px solid #bd4958;
}
.hAdvert span i{
color: #bd4958;
}
.h2Advert{
margin-top: 30px;
font-size: 46px;
font-weight: 400;
color: #3b4256;
animation-delay: 1000ms;
animation-duration: 1000ms;
}
.textAdvert{
margin-top: 30px;
font-size: 18px;
font-weight: 400;
color: #3b4256;
animation-delay: 1000ms;
animation-duration: 1000ms;
}
@media (max-width: 399px){
	.hAdvert{
		font-size: 36px;
	}
	.h2Advert{
		font-size: 26px;
	}
}
.first-section{
background: #fff;
}
.btn-webmast{
background: #3b4256;
color: #fff;
font-size: 18px;
font-weight: 500;
width: 164px;
margin-top: 30px;
position: relative;
overflow: hidden;
z-index: 1;
/*cursor: not-allowed;*/
/*pointer-events: none;*/
animation-delay: 2000ms;
animation-duration: 1000ms;
}
.btn-webmast:link:after, .btn-webmast:visited:after {
  content: "";
  position: absolute;
  background: none repeat scroll 0 0 #bd4958;
  height: 0%;
  left: 50%;
  top: 50%;
  width: 100%;
  z-index: -1;
  -webkit-transition: all .3s ease 0s;
  -moz-transition: all .3s ease 0s;
  -o-transition: all .3s ease 0s;
  transition: all .3s ease 0s;
}
.btn-webmast:link:hover, .btn-webmast:visited:hover {
  color: #fff!important;
  text-shadow: none;
  box-shadow: 1px 1px 12px rgba(189, 73, 88, 0.5);
  -webkit-box-shadow: 1px 1px 12px rgba(189, 73, 88, 0.5);
-moz-box-shadow: 1px 1px 12px rgba(189, 73, 88, 0.5);
  border-color: #bd4958;
}
.btn-webmast:link:hover:after, .btn-webmast:visited:hover:after {
  height: 420%;
}

.btn-webmast:after {
  -moz-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
  -ms-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
  -webkit-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
  transform: translateX(-50%) translateY(-50%) rotate(-45deg);
}
.bth-sour{
border: solid 1px #3b4256;
background: #fff;
color: #3b4256;
font-size: 18px;
font-weight: 500;
width: 164px;
margin-top: 30px;
position: relative;
overflow: hidden;
z-index: 1;
animation-delay: 2000ms;
animation-duration: 1000ms;
}
.bth-sour:link:after, .bth-sour:visited:after {
  content: "";
  position: absolute;
  background: none repeat scroll 0 0 #3b4256;
  height: 0%;
  left: 50%;
  top: 50%;
  width: 100%;
  z-index: -1;
  -webkit-transition: all .3s ease 0s;
  -moz-transition: all .3s ease 0s;
  -o-transition: all .3s ease 0s;
  transition: all .3s ease 0s;
}
.bth-sour:link:hover, .bth-sour:visited:hover {
  color: #fff!important;
  text-shadow: none;
  box-shadow: 1px 1px 12px rgba(59, 66, 86, 0.50);
    -webkit-box-shadow: 1px 1px 12px rgba(59, 66, 86, 0.50);
-moz-box-shadow: 1px 1px 12px rgba(59, 66, 86, 0.50);
}
.bth-sour:link:hover:after, .bth-sour:visited:hover:after {
  height: 420%;
}

.bth-sour:after {
  -moz-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
  -ms-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
  -webkit-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
  transform: translateX(-50%) translateY(-50%) rotate(-45deg);
}
@media (min-width: 348px){
	.btn-webmast{
		margin-right: 20px;
	}
}
@media (max-width: 347px){
	.btn-webmast{
		margin-right: 5px;
	}
	.bth-sour{
		margin-right: 5px;
	}
}
.mainpc{
	animation-delay: 3000ms;
	animation-duration: 1000ms;
}
/*Анимация элементов*/
.playdiv{
width: 73px;
height: 74px;
cursor: pointer;
position: absolute;
	animation-delay: 3000ms;
	animation-duration: 1000ms;
}
.playdiv:hover .playflipper{
animation-name: playflip;
}
.play, .pause {
position: absolute;
top: 0;
left: 0;
backface-visibility: hidden;
}
.playflipper {
position: relative;
transform-style: preserve-3d;
    animation-duration: 3000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    z-index: 100;
	transform-origin: 100% 35px;
}
.pause {
transform: rotateX(180deg);
visibility: visible;
}
@keyframes playflip {
    0% {
    transform: rotateX(0deg);
	backface-visibility: visible;
    }
	5% {
        transform: rotateX(180deg);
    }
	10%{
        transform: rotateX(0deg);
    }
	15%{
        transform: rotateX(180deg);
    }
	20%{
        transform: rotateX(0deg);
    }
	25%{
        transform: rotateX(180deg);
    }
	30%{
        transform: rotateX(0deg);
    }
}
.watch{
width: 88px;
height: 88px;
cursor: pointer;
position: absolute;
animation-delay: 3000ms;
animation-duration: 1000ms;
}
.watch_str1{
position: absolute;
left: 41px;
top: 18px;
transform-origin: 50% 100%;
    animation-duration: 2000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    z-index: 100;
	transform: rotate(300deg);
}
.watch_str2 {
    position: absolute;
    left: 41px;
    top: 22px;
    transform-origin: 50% 100%;
    animation-duration: 24000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    z-index: 100;
	transform: rotate(50deg);
}
.watch:hover .watch_str1{
animation-name: spinstr1;
}
.watch:hover .watch_str2{
animation-name: spinstr2;
}
@keyframes spinstr1 {
    from {
        transform:rotate(300deg);
    }
    to {
        transform:rotate(660deg);
    }
}
@keyframes spinstr2 {
    from {
        transform:rotate(50deg);
    }
    to {
        transform:rotate(410deg);
    }
}
.watch-right{
width: 88px;
height: 88px;
cursor: pointer;
position: absolute;
animation-delay: 3000ms;
animation-duration: 1000ms;
}
.watch_str1-right{
position: absolute;
left: 41px;
top: 18px;
transform-origin: 50% 100%;
    animation-duration: 2000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    z-index: 100;
	transform: rotate(60deg);
}
.watch_str2-right {
    position: absolute;
    left: 41px;
    top: 22px;
    transform-origin: 50% 100%;
    animation-duration: 24000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    z-index: 100;
	transform: rotate(300deg);
}
.watch-right:hover .watch_str1-right{
animation-name: spinstr1-right;
}
.watch-right:hover .watch_str2-right{
animation-name: spinstr2-right;
}
@keyframes spinstr1-right {
    from {
        transform:rotate(60deg);
    }
    to {
        transform:rotate(420deg);
    }
}
@keyframes spinstr2-right {
    from {
        transform:rotate(300deg);
    }
    to {
        transform:rotate(660deg);
    }
}
.smmoney{
width: 48px;
    height: 45px;
	perspective: 1000;
	cursor: pointer;
	position: absolute;
	animation-delay: 3000ms;
animation-duration: 1000ms;
}
.bgmoney{
width: 60px;
    height: 58px;
	perspective: 1000;
	position: absolute;
	cursor: pointer;
	animation-delay: 3000ms;
animation-duration: 1000ms;
}
.bgmoney:hover .flipper{
animation-name: flip;
}
.smmoney:hover .flipper{
animation-name: flip;
}
.moneyfront, .moneyback {
position: absolute;
top: 0;
left: 0;
backface-visibility: hidden;
}
.flipper {
position: relative;
transform-style: preserve-3d;
    animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    z-index: 100;
}
.moneyback {
transform: rotateY(180deg);
visibility: visible;
}
.videocam{
position: absolute;
width: 176px;
height: 187px;
cursor: pointer;
animation-delay: 3000ms;
animation-duration: 1000ms;
}
.videocam:hover .cam2{
animation-name: cam2;
}
.videocam:hover  .cam4{
animation-name: cam4;
}
.cam1{
    position: absolute;
    right: 0;
    top: 16px;
	z-index: 1;
}
.cam2{
    position: absolute;
    top: 0;
    left: 0px;
	
	animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
@keyframes cam2 {
    0% {
        left: 0px;
		
    }
    50% {
		top: 0;
        left: 0px;
    }
	60% {
        left: 10px;
		top: 5px;
    }
	70% {
        left: 20px;
		top: 10px;
    }
	80% {
        left: 10px;
		top: 5px;
    }
	90% {
        left: 20px;
		top: 10px;
    }
	100%{
		top: 0;
		left: 0px;
	}
}
.cam3{
    position: absolute;
    right: 25px;
    top: 60px;
	z-index: 2;
}
.cam4{
position: absolute;
    right: 44px;
    top: 77px;
    transform-origin: 100% 0%;
    
    animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    z-index: 100;
}
@keyframes cam4 {
    0% {
        transform:rotate(0deg);
		
    }
    50% {
        transform:rotate(-360deg);
    }
	100%{
		transform:rotate(-360deg);
	}
}
.videocam-right{
position: absolute;
width: 176px;
height: 187px;
cursor: pointer;
animation-delay: 3000ms;
animation-duration: 1000ms;
}
.videocam-right:hover .cam2-right{
animation-name: cam2-right;
}
.videocam-right:hover  .cam4-right{
animation-name: cam4-right;
}
.cam1-right{
    position: absolute;
    left: 0;
    top: 16px;
	z-index: 1;
}
.cam2-right{
    position: absolute;
    top: 0;
    right: 0px;
	animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
@keyframes cam2-right {
    0% {
        right: 0px;
    }
    50% {
		top: 0;
        right: 0px;
    }
	60% {
        right: 10px;
		top: 5px;
    }
	70% {
        right: 20px;
		top: 10px;
    }
	80% {
        right: 10px;
		top: 5px;
    }
	90% {
        right: 20px;
		top: 10px;
    }
	100%{
		top: 0;
		right: 0px;
	}
}
.cam3-right{
    position: absolute;
    left: 25px;
    top: 60px;
	z-index: 2;
}
.cam4-right{
position: absolute;
    left: 44px;
    top: 77px;
    transform-origin: 0% 0%;
    animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    z-index: 100;
}
@keyframes cam4-right {
    0% {
        transform:rotate(0deg);
		
    }
    50% {
        transform:rotate(-360deg);
    }
	100%{
		transform:rotate(-360deg);
	}
}



@keyframes spin {
    from {
        transform:rotate(0deg);
    }
    to {
        transform:rotate(360deg);
    }
}
@keyframes spin2 {
    from {
        transform:rotate(0deg);
		
    }
    to {
        transform:rotate(-360deg);
    }
}
@keyframes flip {
    0% {
        transform: rotateY(0deg);
		backface-visibility: visible;
    }
	20% {
        transform: rotateY(180deg);
    }
	60%{
        transform: rotateY(180deg);
    }
	80%{
		transform: rotateY(0deg);
	}
}
.targetdiv{
    width: 138px;
    height: 136px;
	position: absolute;
	cursor: pointer;
	animation-delay: 3000ms;
animation-duration: 1000ms;
}
.targetdiv:hover .strOnTraget{
	animation-name: strOnTarget;
}
.strOnTraget{
    animation-duration: 3000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    z-index: 120;
	position: absolute;
    top: -4px;
    left: -62px;
	transform-origin: 100% 50%;
}
@keyframes strOnTarget {
0% {
	opacity: 0;
    left: -262px;
	top: -204px;
	transform: rotate(0deg);
}
40% {
	opacity: 0;
    left: -262px;
	top: -204px;
	transform: rotate(0deg);
}
45% {
opacity: 1;
	top: -4px;
    left: -62px;
	-webkit-transform: translateY(0px);
    transform: translateY(0px);
	    transform: rotate(0deg);
}
46%{
	transform: rotate(10deg);
}
47%{
	transform: rotate(-9deg);
}
48%{
	transform: rotate(8deg);
}
49%{
	transform: rotate(-7deg);
}
50%{
	transform: rotate(6deg);
}
51%{
	transform: rotate(-5deg);
}
52%{
	transform: rotate(4deg);
}
53%{
	transform: rotate(-3deg);
}
54%{
	transform: rotate(2deg);
}
55%{
	transform: rotate(-1deg);
}
56%{
	transform: rotate(0deg);
}
}
.targetdiv-right{
    width: 138px;
    height: 136px;
	position: absolute;
	cursor: pointer;
	animation-delay: 3000ms;
animation-duration: 1000ms;
}
.targetdiv-right:hover .strOnTraget-right{
	animation-name: strOnTarget-right;
}
.strOnTraget-right{
    animation-duration: 3000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    z-index: 120;
	position: absolute;
    top: -2px;
    right: -64px;
	transform-origin: 100% 50%;
}
@keyframes strOnTarget-right {
0% {
	opacity: 0;
    right: -140px;
	top: -204px;
	transform: rotate(0deg);
}
40% {
	opacity: 0;
    right: -140px;
	top: -204px;
	transform: rotate(0deg);
}
45% {
opacity: 1;
	top: -2px;
    right: -64px;
	-webkit-transform: translateY(0px);
    transform: translateY(0px);
	    transform: rotate(0deg);
}
46%{
	transform: rotate(10deg);
}
47%{
	transform: rotate(-9deg);
}
48%{
	transform: rotate(8deg);
}
49%{
	transform: rotate(-7deg);
}
50%{
	transform: rotate(6deg);
}
51%{
	transform: rotate(-5deg);
}
52%{
	transform: rotate(4deg);
}
53%{
	transform: rotate(-3deg);
}
54%{
	transform: rotate(2deg);
}
55%{
	transform: rotate(-1deg);
}
56%{
	transform: rotate(0deg);
}
}
.graphic{
    width: 91px;
    height: 62px;
	position: absolute;
	cursor: pointer;
	animation-delay: 3000ms;
animation-duration: 1000ms;
}
.graphic:hover .gr5{
animation-name: gr5;
}
.graphic:hover .gr4{
animation-name: gr4;
}
.graphic:hover .gr3{
animation-name: gr3;
}
.graphic:hover .gr2{
animation-name: gr2;
}
.graphic:hover .gr6{
animation-name: gr6;
}
.graphic-right{
    width: 91px;
    height: 62px;
	position: absolute;
	cursor: pointer;
	animation-delay: 3000ms;
animation-duration: 1000ms;
}
.graphic-right:hover .gr5-right{
animation-name: gr5;
}
.graphic-right:hover .gr4-right{
animation-name: gr4;
}
.graphic-right:hover .gr3-right{
animation-name: gr3;
}
.graphic-right:hover .gr2-right{
animation-name: gr2;
}
.graphic-right:hover .gr6-right{
animation-name: gr6;
}
.gr5-right{
	position: absolute;
    bottom: 8px;
    right: 15px;
    animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
.gr4-right{
	position: absolute;
    bottom: 8px;
    right: 31px;
    animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
.gr3-right{
	position: absolute;
    bottom: 8px;
    right: 47px;
    animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
.gr2-right{
	position: absolute;
    bottom: 8px;
    right: 63px;
    animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
.gr6-right{
    position: absolute;
    bottom: 10px;
    left: 6px;
    animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
.gr5{
	position: absolute;
    bottom: 8px;
    left: 15px;
    animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
@keyframes gr5 {
0% {
	height: 0;
	width: 12px;
}
20% {
	height: 31px;
	width: 12px;
}
100%{
	height: 31px;
	width: 12px;
}
}
.gr4{
	position: absolute;
    bottom: 8px;
    left: 31px;
    animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
@keyframes gr4 {
0% {
	height: 0;
}
15% {
	height: 21px;
}
100%{
	height: 21px;
}
}
.gr3{
	position: absolute;
    bottom: 8px;
    left: 47px;
    animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
@keyframes gr3 {
0% {
	height: 0;
}
18% {
	height: 23px;
}
100%{
	height: 23px;
}
}
.gr2{
	position: absolute;
    bottom: 8px;
    left: 63px;
    animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
@keyframes gr2 {
0% {
	height: 0;
}
10%{
	height: 11px;
}
100%{
	height: 11px;
}
}
.gr6{
    position: absolute;
    bottom: 10px;
    right: 6px;
    animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
@keyframes gr6 {
0% {
	height: 0;
}
20% {
	height: 0px;
}
30%{
	height: 45px;
}
100%{
	height: 45px;
}
}
.lamp{
width: 76px;
height: 117px;
    position: absolute;
	cursor: pointer;
	animation-delay: 3000ms;
animation-duration: 1000ms;
}
.lamp .grey{
	width: 76px;
    height: 102px;
background: #9da0aa;
display: block;
}
.lamp:hover .blue{
animation-name: blue;
}
.lamp .blue{
display: block;
position: absolute;
top: 0;
right: 0;
width: 54px;
    height: 54px;
background: #88b0d8;
    
	    border-bottom-left-radius: 39px;
    animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
.lamp-right{
width: 76px;
height: 117px;
    position: absolute;
	cursor: pointer;
	animation-delay: 3000ms;
animation-duration: 1000ms;
}
.lamp-right .grey{
	width: 76px;
    height: 102px;
background: #9da0aa;
display: block;
}
.lamp-right:hover .blue{
animation-name: blue;
}
.lamp-right .blue{
display: block;
position: absolute;
top: 0;
left: 0;
width: 54px;
    height: 54px;
background: #88b0d8;
	    border-bottom-right-radius: 39px;
    animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
.lamp-right .imagelamp{
position: absolute;
top: 0;
}
.lamp-right .imagelamp2{
    left: 23px;
    position: absolute;
    z-index: 0;
    bottom: 0;
}
@keyframes blue {
    0% {
	width: 54px;
    height: 54px;
    }
	16%{
	width: 76px;
    height: 102px;
	}
	32%{
	width: 76px;
    height: 102px;
	}
	82%{
	width: 0px;
	height: 0px;
	}
	100% {
	width: 54px;
    height: 54px;
    }
}
.lamp .imagelamp{
position: absolute;
top: 0;
}
.lamp .imagelamp2{
    left: 23px;
    position: absolute;
    z-index: 0;
    bottom: 0;
}
.gear{
position: absolute;
width: 90px;
height: 102px;
cursor: pointer;
animation-delay: 3000ms;
animation-duration: 1000ms;
}
.gear:hover .sm_gear1, .gear:hover .sm_gear2{
animation-name: spin;
}
.gear:hover .bg_gear{
animation-name: spin2;
}
.sm_gear1{
    position: absolute;
    top: 0;
    left: 0;
    animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    z-index: 100;
}
.bg_gear{
    top: 15px;
    position: absolute;
    left: 26px;
	    
    animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    z-index: 100;
}
.sm_gear2{
    position: absolute;
    bottom: 0;
    left: 12px;
    animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    z-index: 100;
}
.gear-right{
position: absolute;
width: 90px;
height: 102px;
cursor: pointer;
animation-delay: 3000ms;
animation-duration: 1000ms;
}
.gear-right:hover .sm_gear1-right, .gear-right:hover .sm_gear2-right{
animation-name: spin;
}
.gear-right:hover .bg_gear-right{
animation-name: spin2;
}
.sm_gear1-right{
    position: absolute;
    top: 0;
    right: 0;
    animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    z-index: 100;
}
.bg_gear-right{
    top: 15px;
    position: absolute;
    right: 26px;
	    
    animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    z-index: 100;
}
.sm_gear2-right{
    position: absolute;
    bottom: 0;
    right: 12px;
    animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    z-index: 100;
}
.graph{
width: 64px;
height: 33px;
    position: absolute;
	cursor: pointer;
	animation-delay: 3000ms;
animation-duration: 1000ms;
}
.graph:hover .dot2{
animation-name: dot2;
}
.graph:hover .dot3{
animation-name: dot3;
}
.graph:hover .dot4{
animation-name: dot4;
}
.graph:hover .line1{
animation-name: line1;
}
.graph:hover .line2{
animation-name: line2;
}
.graph:hover .line3{
animation-name: line3;
}
.dot1{
position: absolute;
bottom: 0;
left: 0;
}
.dot2{
position: absolute;
top: 9px;
left: 23px;
    animation-duration: 5000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
	/*animation-delay: 2000ms;*/
	/*opacity: 0;*/
}
@keyframes dot2 {
    0% {
        opacity: 0;
		
    }
	10%{
		opacity: 0;
	}
	20%{
		opacity: 1;
	}
    100% {
        opacity: 1;
    }
}
.dot3{
position: absolute;
bottom: 0px;
left: 39px;
    animation-duration: 5000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
	/*animation-delay: 2000ms;*/
	/*opacity: 0;*/
}
@keyframes dot3 {
    0% {
        opacity: 0;
		
    }
	30%{
		opacity: 0;
	}
	40%{
		opacity: 1;
	}
    100% {
        opacity: 1;
    }
}
.dot4{
position: absolute;
top: 0;
right: 0;
    animation-duration: 5000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
	/*animation-delay: 2000ms;*/
	/*opacity: 0;*/
}
@keyframes dot4 {
    0% {
        opacity: 0;
		
    }
	50%{
		opacity: 0;
	}
	60%{
		opacity: 1;
	}
    100% {
        opacity: 1;
    }
}
.line1{
    position: absolute;
    height: 3px;
    width: 26px;
    background: #9da0aa;
    bottom: 5px;
    left: 7px;
    transform-origin: left center;
    transform: rotate(-36deg);
    animation-duration: 5000ms;
    animation-iteration-count: infinite;
}
@keyframes line1 {
	0%{
		opacity: 0;
	}
	20%{
		opacity: 0;
		width: 3px;
	}
	21%{
	opacity: 1;
	}
	30%{
		
		width: 26px;
	}
    100% {
        width: 26px;
    }
}
.line2{
position: absolute;
    width: 30px;
    height: 3px;
    background: #9da0aa;
    top: 10px;
    left: 23px;
    transform-origin: left center;
    transform: rotate(34deg);
    animation-duration: 5000ms;
	animation-iteration-count: infinite;
}
@keyframes line2 {
	0%{
		opacity: 0;
	}
	40%{
		opacity: 0;
		width: 3px;
	}
	41%{
		opacity: 1;
	}
	50%{
		width: 30px;
	}
    100% {
        width: 30px;
    }
}
.line3{
position: absolute;
    width: 31px;
    height: 3px;
    background: #9da0aa;
    bottom: 1px;
    left: 42px;
    transform-origin: left center;
    transform: rotate(-57deg);
    animation-duration: 5000ms;
	animation-iteration-count: infinite;
}
@keyframes line3 {
	0%{
		opacity: 0;
	}
	60%{
		opacity: 0;
		width: 3px;
	}
	61%{
		opacity: 1;
	}
	70%{
		width: 31px;
	}
    100% {
        width: 31px;
    }
}

.graph-right{
width: 64px;
height: 33px;
    position: absolute;
	cursor: pointer;
	animation-delay: 3000ms;
animation-duration: 1000ms;
}
.graph-right:hover .dot2-right{
animation-name: dot2;
}
.graph-right:hover .dot3-right{
animation-name: dot3;
}
.graph-right:hover .dot4-right{
animation-name: dot4;
}
.graph-right:hover .line1-right{
animation-name: line1;
}
.graph-right:hover .line2-right{
animation-name: line2;
}
.graph-right:hover .line3-right{
animation-name: line3;
}
.dot1-right{
position: absolute;
bottom: 0;
right: 0;
}
.dot2-right{
position: absolute;
top: 9px;
right: 23px;
    animation-duration: 5000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
	/*animation-delay: 2000ms;*/
	/*opacity: 0;*/
}
.dot3-right{
position: absolute;
bottom: 0px;
right: 39px;
    animation-duration: 5000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
	/*animation-delay: 2000ms;*/
	/*opacity: 0;*/
}
.dot4-right{
position: absolute;
top: 0;
left: 0;
    animation-duration: 5000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
	/*animation-delay: 2000ms;*/
	/*opacity: 0;*/
}
.line1-right{
    position: absolute;
    height: 3px;
    width: 26px;
    background: #9da0aa;
    bottom: 5px;
    right: 7px;
    transform-origin: right center;
    transform: rotate(34deg);
    animation-duration: 5000ms;
    animation-iteration-count: infinite;
}
.line2-right{
position: absolute;
    width: 30px;
    height: 3px;
    background: #9da0aa;
    top: 10px;
    right: 25px;
    transform-origin: right center;
    transform: rotate(-37deg);
    animation-duration: 5000ms;
	animation-iteration-count: infinite;
}
.line3-right{
position: absolute;
    width: 31px;
    height: 3px;
    background: #9da0aa;
    bottom: 1px;
    right: 42px;
    transform-origin: right center;
    transform: rotate(56deg);
    animation-duration: 5000ms;
	animation-iteration-count: infinite;
}


.cupdiv{
position: absolute;
width: 110px;
height: 90px;
cursor: pointer;
animation-delay: 3000ms;
animation-duration: 1000ms;
}
.cupdiv:hover img{
animation-name: cup;
}
.cupdiv img{
    animation-duration: 4000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    z-index: 100;
}
@keyframes cup {
 
1% {
    -webkit-transform: translateX(12px);
    transform: translateX(12px);
}
2% {
	-webkit-transform: translateX(-12px);
    transform: translateX(-12px);
}
3% {
    -webkit-transform: translateX(9px);
    transform: translateX(9px);
}
4% {
    -webkit-transform: translateX(-9px);
    transform: translateX(-9px);
}
5% {
    -webkit-transform: translateX(6px);
    transform: translateX(6px);
}
6% {
    -webkit-transform: translateX(-6px);
    transform: translateX(-6px);
}
7% {
    -webkit-transform: translateX(3px);
    transform: translateX(3px);
}
8% {
    -webkit-transform: translateX(-3px);
    transform: translateX(-3px);
}
9% {
    -webkit-transform: translateX(3px);
    transform: translateX(3px);
}
10% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}
}
.playdivpos{
top: 190px;
left: 29px;
}
.smmoneypos{
top: 282px;
left: 226px;
}
.watchpos{
top: 316px;
left: 73px;
}
.targetdivpos{
top: 426px;
left: 158px;
}
.graphicpos{
top: 471px;
left: 19px;
}
.lamppos{
top: 360px;
left: 320px;
}
.gearpos{
top: 630px;
left: 19px;
}
.graphpos{
top: 617px;
left: 165px;
}
.bgmoneypos{
top: 673px;
left: 219px;
}
.videocampos{
top: 523px;
left: 328px;
}
.cupdivpos{
top: 640px;
left: 500px;
}



.lamppos-right{
top: 129px;
right: 31px;
}
.graphicpos-right{
top: 284px;
right: 64px;
}
.playdivpos-right{
right: 165px;
top: 410px;
}
.smmoneypos-right{
top: 477px;
right: 37px;
}
.targetdivpos-right{
top: 533px;
right: 146px;
}
.watchpos-right{
right: 22px;
top: 662px;
}
.graphpos-right{
top: 349px;
right: 276px;
}
.videocampos-right{
right: 348px;
top: 409px;
}
.gearpos-right{
right: 313px;
top: 642px;
}
.bgmoneypos-right{
right: 534px;
top: 658px;
}
@media (max-width: 767px){
	.graphicpos{
	display: none;
	}
	.gearpos{
	display: none;
	}
	.graphpos{
	display: none;
	}
	.watchpos-right{
		display: none;
	}
	.smmoneypos-right{
		display: none;
	}
}
@media (max-width: 850px){
	.watchpos{
		display: none;
	}
	.bgmoneypos{
		display: none;
	}
	.playdivpos-right{
		display: none;
	}
}
@media (max-width: 1050px){
	.smmoneypos{
		display: none;
	}
	.playdivpos{
		display: none;
	}
	.gearpos-right{
		display: none;
	}
	.graphpos-right{
		display: none;
	}
	.lamppos-right{
		display: none;
	}
	.graphicpos-right{
		display: none;
	}
		.targetdivpos-right{
		display: none;
	}
}
@media (max-width: 1180px){
		.targetdivpos{
		display: none;
	}
}
@media (max-width: 1300px){
	.videocampos{
		display: none;
	}
	.lamppos{
		display: none;
	}
}
@media (max-width: 1500px){
	.cupdivpos{
		display: none;
	}
	.bgmoneypos-right{
		display: none;
	}
	.videocampos-right{
		display: none;
	}
}
.main-vid{
position: relative;
width: 490px;
margin: 0 auto;
}
.main-left-window{
position: absolute;
    left: 0;
    top: -20px;
	z-index: 2;
			animation-delay: 4000ms;
animation-duration: 1000ms;
}
.main-right-window{
position: absolute;
    right: 4px;
    top: 26px;
	z-index: 2;
					animation-delay: 4500ms;
animation-duration: 1000ms;
}
.left-white{
    position: absolute;
    left: 46px;
    top: 45px;
    width: 81px;
    height: 6px;
	background: #fff;
			animation-delay: 4000ms;
animation-duration: 1000ms;
}
.left-white span{
	background: #3b4256;
	z-index: 1;
	width: 30px;
    position: absolute;
    height: 4px;
    top: 1px;
    left: 1px;
	animation-duration: 3000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
.hover-left{
	cursor: pointer;
}
.hover-left:hover .left-white span{
	animation-name: left-span;
}
.right-white{
    position: absolute;
    right: 24px;
    top: 91px;
    width: 81px;
    height: 6px;
    background: #fff;
				animation-delay: 4500ms;
animation-duration: 1000ms;
}
.right-white span{
	background: #da4758;
	z-index: 1;
	width: 30px;
    position: absolute;
    height: 4px;
    top: 1px;
    left: 1px;
	animation-duration: 3000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}
.hover-right{
	cursor: pointer;
}
.hover-right:hover .right-white span{
	animation-name: left-span;
}
@keyframes left-span {
	0%{
		width: 30px
	}
	48%{
		width: 78px;
	}
	70%{
		width: 78px;
	}
	71%{
		width: 1px;
	}
    100% {
        width: 30px;
    }
}
@media (max-width: 500px){
	.hover-left{
		display: none;
	}
	.hover-right{
		display: none;
	}
	.main-vid{
	width: 296px;
	}
}
.second-section{
background: #f2f4f7;
}
.second-section h2{
margin-top: 70px;
font-size: 48px;
font-weight: 700;
color: #3b4256;
}
.second-section h2 span{
color: #bd4958;
}
.second-p{
margin-top: 70px;
font-size: 24px;
font-weight: 400;
color: #bd4958;
}
.table{
	font-size: 18px;
	font-weight: 400;
}
.table tbody{
	border-bottom: 1px solid #ddd;
}
.tr-head{
	color: #919aa3;
}
.tr-head th{
	font-weight: 400;
	border-top: 2px solid #ddd!important;
	border-bottom: 2px solid #ddd;
	line-height: 70px!important;
}
.tr-text{
	color: #3b4256;
	height: 70px;
}
.tr-text td{
	/*line-height: 70px!important;*/
}
.text-pod-table{
	color: #919aa3;
	font-size: 16px;
	margin-bottom: 50px;
}
.table-responsive{
	border: none;
}
.secondhover{
cursor: pointer;
}
.secondhover:hover{
	animation-name: sourimg;
	animation-duration: 1500ms;
    animation-timing-function: linear;
}
@keyframes sourimg {
	0%{
		-webkit-transform: translateY(0px);
		transform: translateY(0px);
	}
	10%{
		-webkit-transform: translateY(-30px);
		transform: translateY(-30px);
	}
	25%{
		-webkit-transform: translateY(-30px);
		transform: translateY(-30px) rotateY(180deg);
	}
	30%{
		-webkit-transform: translateY(-30px);
		transform: translateY(-30px) rotateY(0deg);
	}
	35%{
		-webkit-transform: translateY(-30px);
		transform: translateY(-30px) rotateY(180deg);
	}
	40%{
		-webkit-transform: translateY(-30px);
		transform: translateY(-30px) rotateY(0deg);
	}
	45%{
		-webkit-transform: translateY(0px);
		transform: translateY(0px);
	}
	48%{
		-webkit-transform: translateY(-20px);
		transform: translateY(-20px);
	}
	52%{
		-webkit-transform: translateY(0px);
		transform: translateY(0px);
	}
	55%{
		-webkit-transform: translateY(-15px);
		transform: translateY(-15px);
	}
	58%{
		-webkit-transform: translateY(0px);
		transform: translateY(0px);
	}
	62%{
		-webkit-transform: translateY(-10px);
		transform: translateY(-10px);
	}
	65%{
		-webkit-transform: translateY(0px);
		transform: translateY(0px);
	}
	68%{
		-webkit-transform: translateY(-8px);
		transform: translateY(-8px);
	}
	72%{
		-webkit-transform: translateY(0px);
		transform: translateY(0px);
	}
	75%{
		-webkit-transform: translateY(-6px);
		transform: translateY(-6px);
	}
	78%{
		-webkit-transform: translateY(0px);
		transform: translateY(0px);
	}
	82%{
		-webkit-transform: translateY(-3px);
		transform: translateY(-3px);
	}
	85%{
		-webkit-transform: translateY(0px);
		transform: translateY(0px);
	}
	88%{
		-webkit-transform: translateY(-1px);
		transform: translateY(-1px);
	}
	92%{
		-webkit-transform: translateY(0px);
		transform: translateY(0px);
	}
	100%{
		-webkit-transform: translateY(0px);
		transform: translateY(0px);
	}
}
@media (max-width: 991px){
.second-p {
    margin-top: 10px;
	margin-bottom: 50px;
}
.table{
	width: 900px;
    max-width: 900px;
}
}
.third-section{
position: relative;
    min-height: 760px;
}
.third-section h2{
margin-top: 70px;
font-size: 48px;
font-weight: 700;
color: #3b4256;
}
.third-section h2 span{
color: #bd4958;
}
.third-blocks{
background: #fff;
border-radius: 3px;
	-webkit-box-shadow: 0 0px 20px 4px rgba(0,0,0,.2);
    box-shadow: 0 0px 20px 4px rgba(0,0,0,.2);
	height: 435px;
	margin-top: 70px;
}
.third-h3{
    margin-top: 30px;
    font-size: 36px;
    color: #3b4256;
    font-weight: 700;
}
.third-h3 span{
border-bottom: 5px solid #bd4958;
}
.third-p{
font-size: 18px;
    margin-top: 35px;
    color: #3b4256;
    font-weight: 400;
}
.btn-prim{
background: #3b4256;
color: #fff;
font-size: 18px;
font-weight: 500;
margin-top: 30px;
/*position: relative;*/
overflow: hidden;
z-index: 1;
width: 200px;
/*pointer-events: none;*/
animation-delay: 2000ms;
animation-duration: 1000ms;
    position: absolute;
    bottom: 20px;
    left: calc(50% - 100px);
}
.btn-prim:link:after, .btn-prim:visited:after {
  content: "";
  position: absolute;
  background: none repeat scroll 0 0 #bd4958;
  height: 0%;
  left: 50%;
  top: 50%;
  width: 100%;
  z-index: -1;
  -webkit-transition: all .3s ease 0s;
  -moz-transition: all .3s ease 0s;
  -o-transition: all .3s ease 0s;
  transition: all .3s ease 0s;
}
.btn-prim:link:hover, .btn-prim:visited:hover {
  color: #fff!important;
  text-shadow: none;
  box-shadow: 1px 1px 12px rgba(189, 73, 88, 0.5);
  -webkit-box-shadow: 1px 1px 12px rgba(189, 73, 88, 0.5);
-moz-box-shadow: 1px 1px 12px rgba(189, 73, 88, 0.5);
  border-color: #bd4958;
}
.btn-prim:link:hover:after, .btn-prim:visited:hover:after {
  height: 520%;
}
.btn-prim:after {
  -moz-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
  -ms-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
  -webkit-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
  transform: translateX(-50%) translateY(-50%) rotate(-45deg);
}
@media (max-width: 1199px){
	.third-p{
		font-size: 16px;
	}
}
@media (max-width: 991px){
	.third-blocks{
	height: auto;
	}
	.third-p{
	margin-bottom: 70px;
	}
	.clearfix{
		margin-bottom: 70px;
	}
	
}
@media (max-width: 599px){
	.third-h3{
	font-size: 26px;
	}
	.third-section h2{
	font-size: 40px;
	}
}
@media (max-width: 399px){
	.third-section h2{
	font-size: 26px;
	}
	.second-section h2{
	font-size: 26px;
	}
	.btn-prim{
		font-size: 16px;
		width: 180px;
		left: calc(50% - 90px);
	}
}
.fourth-section{
	background: #f2f4f7;
}
.fourth-section h2{
margin-top: 70px;
font-size: 48px;
font-weight: 700;
color: #3b4256;
}
.fourth-p{
font-size: 18px;
color: #3b4256;
font-weight: 500;
margin-bottom: 50px;
}
.fourth-p img{
margin-right: 20px;
}
@media (max-width: 399px){
	.fourth-section h2{
	font-size: 26px;
	}
}
.btn-sub{
background: #3b4256;
color: #fff;
font-size: 18px;
font-weight: 500;
margin-bottom: 15px;
position: relative;
overflow: hidden;
z-index: 1;
width: 200px;
/*pointer-events: none;*/
animation-delay: 2000ms;
animation-duration: 1000ms;
}
.btn-sub:after, .btn-sub:after {
  content: "";
  position: absolute;
  background: none repeat scroll 0 0 #bd4958;
  height: 0%;
  left: 50%;
  top: 50%;
  width: 100%;
  z-index: -1;
  -webkit-transition: all .3s ease 0s;
  -moz-transition: all .3s ease 0s;
  -o-transition: all .3s ease 0s;
  transition: all .3s ease 0s;
}
.btn-sub:hover, .btn-sub:hover {
  color: #fff!important;
  text-shadow: none;
  box-shadow: 1px 1px 12px rgba(189, 73, 88, 0.5);
  -webkit-box-shadow: 1px 1px 12px rgba(189, 73, 88, 0.5);
-moz-box-shadow: 1px 1px 12px rgba(189, 73, 88, 0.5);
  border-color: #bd4958;
}
.btn-sub:hover:after, .btn-sub:hover:after {
  height: 520%;
}
.btn-sub:after {
  -moz-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
  -ms-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
  -webkit-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
  transform: translateX(-50%) translateY(-50%) rotate(-45deg);
}
.five-section{
background: #3b4256;
}
.five-section h2{
margin-top: 70px;
font-size: 48px;
font-weight: 700;
color: #fff;
}
.five-section h2 span{
color: #bd4958;
}
.five-p{
font-size: 24px;
color: #fff;
font-weight: 500;
margin-top: 50px;
}
.five-p span{
color: #919aa3;
}
.cont-p{
font-size: 20px;
color: #fff;
font-weight: 500;
margin-bottom: 50px;
}
.cont-p img{
margin-right: 20px;
}
@media (max-width: 399px){
	.five-section h2{
	font-size: 26px;
	}
}
.form-control{
font-size: 16px;
}
.cont-text{
 height: 80px!important;
 resize: none;
}
/*.modal{
top: 40%;
}*/
.g-recaptcha,
.g-recaptcha div{
    margin: 0 auto;
}
@media (min-width: 992px){
	.g-recaptcha{
	transform: scale(0.835);
    transform-origin: 0 0;
	}
}
@media (min-width: 1200px){
	.g-recaptcha{
		transform: scale(1);
    transform-origin: 0 0;
	}
}
@media (max-width: 991px){
	.g-recaptcha{
	transform: scale(1);
    transform-origin: 0 0;
	}
}
@media (max-width: 768px){
	.g-recaptcha{
	transform: scale(0.55);
    transform-origin: 0 0;
}
}
.nav-tabs{
border: none;
font-weight: 600;
font-size: 30px;
text-align: center;
}
.nav-tabs>li{
float: none;
display: inline-block;
}
.nav-tabs>li:nth-child(1){
margin-left: 100px;
padding-right: 30px; 
}
.nav-tabs>li:nth-child(2){
padding-left: 30px; 
}
.nav-tabs>li a{
padding: 0;
}
.nav-tabs>li a{
color: #919aa3;
border: none;
border-bottom: 5px solid transparent;
}
.nav-tabs>li a:hover{
color: #3b4256;
border: none;
background: transparent;
}
.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus{
border: none;
background: transparent;
color: #3b4256;
border-bottom: 5px solid #bd4958;
}
.nav-tabs>li.active>a:hover{
border: none;
background: transparent;
color: #3b4256;
border-bottom: 5px solid transparent;
}
@media (max-width: 768px){
	.nav-tabs>li:nth-child(1){
		margin-left: 0px;
		padding-right: 10px; 
	}
	.nav-tabs>li:nth-child(2){
		margin-left: 0px;
		padding-left: 10px; 
	}
	.nav-tabs{
		font-size: 18px;
	}
}
.btn:focus{
color: #fff;
}
.bth-sour:focus{
color: #3b4256;
}
.footer{
height: 90px;
text-align: right;
}
.footer-text{
font-size: 14px;
font-weight: 400;
color: #919aa3;
display: inline-block;
line-height: 90px;
margin-bottom: 0;
}
.footer-right-text{
margin-left: 30px;
}
@media (max-width: 767px){
	.footer{
	text-align: left;
	}
	.footer-text{
	display: block;
	line-height: 45px;
	clear: both;
	}
	.footer-right-text{
	margin-left: 0;
	}
}
@media (max-width: 399px){
.btn-sub {
    font-size: 16px;
    width: 180px;
    left: calc(50% - 90px);
	}
}
@media (min-width: 768px){
.modal{
pointer-events: none;
}
.modal-dialog{
pointer-events: all;
}
}