
body{
	font-family: "PT Sans", Helvetica, Arial, sans-serif;
	color: #181818;
	padding: 0px;
	margin: 0px;
	font-size: 16px;
	cursor: default;
}
#site-nav{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	padding: 36px 0 36px;
	z-index: 10;
	/*background: rgba(20,24,28,.75);*/
}
.primary-menu{
	padding: 0;
	margin: 0;
	list-style: none;
	margin: 11px 0;
}
.primary-menu li{
	display: inline-block;
	margin-right: 30px;
}
.primary-menu li.menu-all{
	margin-right: 0px;
}
.primary-menu li a{
	color: #fff;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 0.875em;
	font-weight: bold;
}
.primary-menu li a:hover{
	color: #e1861d;
}

#site-header{
	
	background: #14181c url("../images/header-bg.jpg") no-repeat;
	background-size: cover;
	color: #fff;
}
#header-canvas{
	position: absolute;
	width: 100%;
	top: 0px;
	left: 0px;
	height: 100%;
	z-index: 0;
}
.header-title{
	margin: 270px 0 0 0;
	text-align: center;
	position: relative;
	z-index: 1;
}
.macbook{
	margin-bottom: -30px;
}

h3.pt{
	font-size: 1.875em;
	font-weight: normal;
	margin: 0px;
	line-height: 1em;
}
h3.pt.desc{
	font-size: 1.500em;
	line-height: 1em;
	font-weight: normal;
	color: #d6d7d7;
	color: rgba(255,255,255,.75);
	margin: 0px;
}
h1.hw{
	font-size: 4.375em; 
	margin: 0px;
	line-height: 1.25em;
}
.hw{
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.btn-holder{
	margin-top: 35px;
	margin-bottom: 75px;
}

section{
	padding: 50px 0;
}
section.light h3.pt,section.light h1.hw{
	color: #181c20;
	text-align: center;
}
section.dark h3.pt,section.dark h1.hw{
	color: #fff;
	text-align: center;
}
#reasons{
	padding-top: 80px; 
}
section h1.hw{
	margin-bottom: 50px;
}
#reasons .icon-holder{
	text-align: center;
	padding: 22px;
	border:2px solid #181c20;
	width: 80px;
	height: 80px;
	margin: 0 auto;
	border-radius: 100px;
}
.icon{
	background: url("../images/sprite.png") no-repeat;
}
#reasons .icon{
	width: 32px;
	height: 32px;
	display: inline-block;
	margin-bottom: 14px;
}
.icon-plane{
	background-position: 0px 0px;
}
.icon-controlls{
	background-position: -33px 0px;
}
.icon-search{
	background-position: -67px 0px;
}
.icon-user{
	background-position: -100px 0px;
}
.icon-site{
	background-position: -133px 0px;
}
.icon-notebook{
	background-position: -166px 0px;
}
.icon-diamond{
	background-position: -199px 0px;
}
#reasons .reason-name{
	font-size: 23px;
	color: #161e28;
	text-align: center;
	margin-top: 13px;
}
#reasons .reason-border{
	width: 50px;
	margin: 10px auto;
	height: 2px;
	background: #006089
}
#reasons .reason-text{
	text-align: center;
	color: #6b6b6b;
	font-size: 15px;
}
#reasons .reasons-inline{
	margin: 50px 0px;
}
#reasons .reasons-inline .icon-holder{
	text-align: center;
	padding: 17px;
	border:2px solid #181c20;
	width: 70px;
	height: 70px;
	margin: 25px auto 0;
	border-radius: 100px;

}
#reasons .reasons-inline .reason-border{
	margin: 10px auto 0px;
}
#reasons .reasons-inline .reason-name{
	margin-top: 10px;
}

#services{
	background: url("../images/services-bg.jpg") top center no-repeat;
	background-size: cover;
	
}
#services .container .row{
	margin-bottom: 70px;
	height: 220px;
}
#services .container .row:last-child{
	margin-bottom: 0px;
}
.service{
	color: #fff;
	text-align: left;
	height: 100%;
	position: relative;
}
.service .pull-left{
	position: relative;
	z-index: 10;
	text-align: left;
}
.service .icon-holder{
	position: relative;
	z-index: 9;
	width: 50px;
	height: 50px;
	margin-right: 15px;
}
.service .icon-holder .icon{
	width: 50px;
	height: 50px;
	display: inline-block;
}
.service .icon-holder .icon.icon-secondary{
	position: absolute;
	top: 10px;
	left: 10px;
	width: 100px;
	height: 100px;
}
.service .icon-holder .icon.icon-monitor{
	background-position: 0px -46px;
}
.service .icon-holder .icon.icon-monitor.icon-secondary{
	background-position: 0px -97px;
}
.service .icon-holder .icon.icon-brush{
	background-position: -51px -46px;
}
.service .icon-holder .icon.icon-brush.icon-secondary{
	background-position: -101px -97px;
}
.service .icon-holder .icon.icon-pencil{
	background-position: -102px -46px;
}
.service .icon-holder .icon.icon-pencil.icon-secondary{
	background-position: -202px -97px;
}
.service .icon-holder .icon.icon-eye{
	background-position: -255px -46px;
}
.service .icon-holder .icon.icon-eye.icon-secondary{
	background-position: -505px -97px;
}


.service .icon-holder .icon.icon-target{
	background-position: -204px -46px;
}
.service .icon-holder .icon.icon-target.icon-secondary{
	background-position: -404px -97px;
}
.service .icon-holder .icon.icon-banner{
	background-position: -306px -46px;
}
.service .icon-holder .icon.icon-banner.icon-secondary{
	background-position: -606px -97px;
}
.service .icon-holder .icon.icon-seo{
	background-position: -357px -46px;
}
.service .icon-holder .icon.icon-seo.icon-secondary{
	background-position: -707px -97px;
}
.service .icon-holder .icon.icon-mail{
	background-position: -153px -46px;
}
.service .icon-holder .icon.icon-mail.icon-secondary{
	background-position: -303px -97px;
}
.service .icon-holder .icon.icon-sms{
	background-position: -408px -46px;
}
.service .icon-holder .icon.icon-sms.icon-secondary{
	background-position: -808px -97px;
}
.service .icon-holder .icon.icon-video{
	background-position: -459px -46px;
}
.service .icon-holder .icon.icon-video.icon-secondary{
	background-position: -909px -97px;
}
.service .icon-holder .icon.icon-app{
	background-position: -510px -46px;
}
.service .icon-holder .icon.icon-app.icon-secondary{
	background-position: -1010px -97px;
}
.service .icon-holder .icon.icon-forums{
	background-position: -560px -46px;
}
.service .icon-holder .icon.icon-forums.icon-secondary{
	background-position: -1111px -97px;
}






.service-name,.service-price{
	font-size: 21px;
	margin-bottom: 10px;
	line-height: 24px;
}
.service-desc{
	color: #aeaeae;
	font-size: 14px;
	margin-bottom: 10px;
}
.service-price .fa-rouble{
	font-size: 19px;
}
.service-info{
	margin-top: 5px;
}

.cases-holder{
	margin-bottom: 35px;
}
.case-holder{
	position: relative;
	
	padding: 0px;
}
.case-title{
	padding: 30px;
	color: #181818;
	position: relative;
	z-index: 10;
	opacity: 0;
	transition: color 0.1s linear 0.1s;
}
.img-holder{
	overflow: hidden;
	position: absolute;
	top: 15px;
	left: 15px;
	right: 15px;
	bottom: 15px;
	z-index: 9;
	
	background: #fff;
	transition: background 0.1s linear 0.1s;
}
.img-holder img{
	min-width: 100%;
	min-height: 100%;
	opacity: .9;
	max-width: 100%!important;
}
.rollover{
	position: absolute;
	top: 55%;
	z-index: 15;
	width: 100%;
	visibility: hidden;
	opacity: 0;
	transition: opacity 0.1s linear 0.1s;
}
.case-title h2{
	margin: 0px;
	font-size: 21px;
	text-transform: uppercase;
}
.case-title p{
	margin: 0px;
	font-size: 17px;
}
.case_1 a{
	height: auto;
}
@media (min-width: 768px){
	.case_1 a,.case_4 a{
		height: 23.438em;
	}
	.case_2 a,.case_3 a,.case_5 a,.case_6 a,.more_than_six a{
		height: 10.781em;
	}
	.case_5,.case_6{
		margin-top: -12.65em;
	}
	.case_5 a{
		height: 10.781em;
	}
	.case-title{
		/*padding-bottom: 0px;*/
	}

}
@media (min-width: 992px){
	.case_1 a,.case_4 a{
		height: 30.313em;
	}
	.case_5,.case_6{
		margin-top: -16.1em;
	}
	.case_2 a,.case_3 a,.case_5 a,.case_6 a,.more_than_six a{
		height: 14.2185em;
	}
		

}
@media (min-width: 1200px){
	.case_1 a,.case_4 a{
		height: 36.563em;
	}
	.case_5,.case_6{
		margin-top: -19.225em;
	}
	.case_2 a,.case_3 a,.case_5 a,.case_6 a,.more_than_six a{
		height: 17.35em;
	}
}
@media screen and (min-width : 768px) and (max-width: 992px) {
	.servise_mobile .btn.secondary{
		position: absolute;
		bottom: 0;
	}
	.case-title h2 {
		font-size: 18px;
	}
	.case-title p {
		font-size: 14px;
	}
	.case-title {
		padding: 10px;
	}
	.rollover .btn {
		padding: 10px!important;
	}
}
@media (max-width: 768px){
	.img-holder {
		position: static;
	}
	
	.logo img {
		margin: 0 auto;
	}
	.primary-menu {
		text-align: center!important;
	}
	.primary-menu li {
		margin: 0 6px;
	}
	#site-nav {
		padding: 36px 0 0 0;
	}
	.text-up {
		font-size: 2.5em!important;
	}
	.btn:first-child {
		margin-right: 0!important;
	}
	.icon-holder {
		margin: 0 auto!important;
		float: none!important;
	}
	#reasons .reasons-inline .reason-border {
		margin: 0 auto;
	}
	.border_wrap {
		width: 100%;
		margin-top: 20px;
	}
	.servise_mobile {
		text-align: center!important;
		margin-bottom: 30px;
		width: 100%;
	}
	.form {
		width: 100%!important;
		padding: 0!important;
	}
	.form-group {
		margin: 0 auto!important;
		text-align: center!important;
	}
	.form-group input{
		width: 80%!important;
		margin: 10px auto!important;
		text-align: center!important;
		display: inline-block;
		float: none!important;
	}
}
.border_wrap {
	width: 100%;
	margin-top: 20px;
}
.case-holder a{
	text-decoration: none;
	display: block;
	margin: 15px;
}
.case-holder .img-holder{
	background: #84c1ff;
	
	transition: opacity 0.3s linear;
}
.case-holder a .img-holder img{
	transition: transform 0.3s;
}
.case-holder .img-holder img{
	transform: scale(1.2);
	transition: transform 0.3s;
	opacity: 0.4;
}

.case-holder .case-title{
	background: rgba(29,29,29,.85);
	color: #fff;
	opacity: 1;
	transition: all 0.1s linear 0.1s;
}
.case-holder a:hover .case-title:after{
	/*border-top: 90px solid #181818;
	border-right: 36.563em solid transparent;
	content: '';
	width: 0px;
	height: 0px;
	position: absolute;
	display: block;
	line-height: 0;
	bottom: -90px;
	left: 0px;
	z-index: 10;*/
}
.case-holder .rollover{
	visibility: visible;
	opacity: 1;
	transition: opacity 0.4s linear 0.4s;
}

#reviews{
	background: url("../images/reviews-bg.jpg") no-repeat;
	background-size: cover;
}
.review-author-photo{
	margin-right: 15px;
}
.review-author-photo img{
	border:2px solid #84c1ff;
	border-radius: 100px;
}
.review-holder{
	color: #fff;
}
.review-text{
	border: 3px solid #84c1ff;
}
.review-text:before{
	border-left: 34px solid #84c1ff;
	border-bottom: 34px solid transparent;
	content: '';
	width: 0px;
	height: 0px;
	position: absolute;
	display: block;
	line-height: 0;
	bottom: 73px;
	right: 50%;
	margin-right: -50px;
	z-index: 10;
}
.review-text:after{
	border-left: 26px solid #1b1f22;
	border-bottom: 26px solid transparent;
	content: '';
	width: 0px;
	height: 0px;
	position: absolute;
	display: block;
	line-height: 0;
	bottom: 81px;
	right: 50%;
	margin-right: -45px;
	z-index: 10;
}
.review-text-inner{
	margin: 30px;
}
.review-border,.name-border{
	width: 50px;
	height: 2px;
	background: #84c1ff;
	margin: 10px 0;
}
.review-text-inner h2{
	color: #84c1ff;
}
#reviews  h1.hw {
	margin-bottom: 25px;
}
.review-author{
	margin: 15px auto 0;
	text-align: center;
}
.review-author > *{
	display: inline-block;
}
.author-name{
	font-size: 24px;
	line-height: 24px;
	margin-bottom: 4px;
}
.author-company a{
	color: #6b6b6b;
	font-size: 15px;
}
.review-author-name{
	position: relative;
	top: -20px;
	text-align: left;
}
.reviews-controls{
	text-align: center;
	margin-top: 20px;
}
.reviews-controlls-arr{
	display: inline-block;
	font-size: 1.2em;
	margin: 0px -2px;
}
.reviews-controlls-arr a{
	padding: 10px 20px;
	display: inline-block;
	color: #84c1ff;
	border-top: 2px solid #84c1ff;
}
.reviews-controlls-arr:hover a{
	color: #a1d0ff;
	border-top: 2px solid #a1d0ff;
}
.reviews-controlls-arr a.disabled{
	color: #4d4d4d;
	border-top: 2px solid #4d4d4d;
	cursor: default;
}
#company > .container > .hw{
	margin-bottom: 25px
}
.company-desc{
	margin-bottom: 35px;
}
.heading h1.hw{
	text-transform: uppercase;
	font-size: 50px;
	text-align: center;
	margin-bottom: 0px;
	line-height: 40px;
}
.heading h1 small{
	font-size: 17px;
}
.heading p{
	text-align: center;
	margin-top: 0px;
	margin-bottom: 40px;
}
.quote{
	background: url("../images/quote.png") top center no-repeat;
	width: 554px;
	min-height: 52px;
	margin: 50px auto 20px;
	text-align: center;
}
.alex{
	border-radius: 50px;
	float: left;
	margin-right: 15px;
}
.alex-author{
	width: 260px;
	position: absolute;
	left: 50%;
	margin-bottom: 60px;
}
#footer{
	background: #fdfdfd url("../images/footer.jpg") center top no-repeat;
	padding-top: 195px;
	margin-top: 60px;
	overflow: hidden;
}
#footer h3, #footer h1{
	text-align: center;
}
.letter {
	position: relative;
	padding-bottom: 40px;
}
.letter .form{
	background: #fff url("../images/letter-bottom.png") bottom center repeat-x;
	border: 1px solid #f4f4f4;
	position: relative;
	z-index: 10;
	width: 615px;
	padding: 30px 30px 50px;
	margin:0 auto; 
}
.letter .form .form-group{
	margin: 0 -15px;
	margin-bottom: 25px;
	float: left;
}
.form-group .form-control{
	margin: 0 15px;
	border: 2px solid #dedede;
	border-radius: 0px;
	color: #777;
	text-transform: uppercase;
	font-family: "Arial", sans-serif;
	letter-spacing: 2px;
	padding: 0px 14px;
	height: 34px;
	width: 260px;
	font-size: 11px;
}
.form-group .form-control::-webkit-input-placeholder { color:#ddd; }
.form-group .form-control::-moz-placeholder { color:#ddd; } 
.form-group .form-control:-ms-input-placeholder { color:#ddd; } 

.letter .mail-top{
	background: url("../images/mail-top.png") no-repeat;
	width: 928px;
	height: 26px;
	position: absolute;
	bottom: 41px;
	left: 50%;
	margin-left: -464px;
	z-index: 9;
}
.letter .mail-bottom{
	background: url("../images/mail-bottom.png") no-repeat;
	width: 983px;
	height: 41px;
	position: absolute;
	bottom: 0px;
	left: 50%;
	margin-left: -491px;
	z-index: 11;
}
.footer-links{
	width: 84%;
	margin: 20px auto;
}
@media (max-width: 1200px){
	.footer-links{
		width: 100%;
	}
}
.footer-links .letters{
	padding-left: 40px;
	background: url("../images/letters.png") no-repeat;
	background-position: left center;
}
.footer-links .vk{
	padding-left: 40px;
	background: url("../images/vk.png") no-repeat;
	background-position: left center;
}
.footer-links .job{
	padding-left: 40px;
	background: url("../images/job.png") no-repeat;
	background-position: left center;
}
.footer-links a{
	color: #84c1ff;
	text-decoration: none;
	border-bottom:1px solid  #e5f1fd;
}
.footer-links a:hover{
	color: #d71824;
	text-decoration: none;
	border-bottom: 1px solid #d71824;
}
.rules{
	font-size: 11px;
	color: #84c1ff;
	border-bottom:1px dotted #e5f1fd;
}
.rules:hover{
	color: #d71824;
	border-bottom:1px dotted #d71824;
	text-decoration: none;
}

abbr{
	cursor: help;
}
.primary-color{
	color: #d71824;
}
.btn-holder .btn:first-child{
	margin-right: 30px;
}
.btn{
	padding: 15px 34px;
	border-radius: 4px;
	text-transform: uppercase;
	color: #181818;
	font-size: 14px;
	border:none;
	font-family: "Arial", sans-serif;
	letter-spacing: 2px;
}
.btn.wide{
	padding-right: 40px;
	padding-left: 40px;
}
.btn.primary{
	color: #fff;
	background: #d71824;
	padding: 10px 25px;
	outline: none!important;
	font-size: 11px;
}
.btn.primary:hover{
	color: #fff;
	background: #e6263d;
	outline: none!important;
}
.btn.primary:active{
	color: #fff;
	background: #e6263d;
	outline: none!important;
}

.btn.secondary,.btn.secondary.full:hover{
	color: #fff;
	background: none;
	border: 1px solid #fff;
	padding: 10px 25px;
	outline: none!important;
	font-size: 11px;
	letter-spacing: 2px;
}
.servise_mobile {
	height: 100%;
}
.btn.secondary:hover,.btn.secondary.full{
	color: #181818;
	background: #fff;
	border: 1px solid #fff;
	outline: none!important;
}
.btn.secondary:active{
	color: #fff;
	background: #fff;
	border: 1px solid #fff;
	outline: none!important;
}
.text-center{
	text-align: center;
}
.text-left{
	text-align: left;
}
.text-right{
	text-align: right;
}
.text-up{
	text-transform: uppercase;
}
.white-popup {
  	background: #fff;
	padding: 30px;
	text-align: left;
	max-width: 400px;
	margin: 40px auto;
	position: relative;
	color:#181818;
}
.white-popup .hw{
	font-size: 30px;
	text-align: center;
	line-height: 30px;
	color: #181818;
	text-transform: uppercase;
}
.modalform{
	margin: 0 auto;
}
.modalform-2{
	max-width: 260px;
	margin: 0 auto;
}
.modalform-2 .form-control{
	margin-bottom: 15px;
}


.form-group .form-control{
	float: left;
	background: #fff;
	box-shadow: none;
}
.form-group .form-control:focus{
	border:2px solid #84c1ff;
	box-shadow: none;
}
/* at start */
.my-mfp-slide-bottom .zoom-anim-dialog {
	opacity: 0;
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;

	-webkit-transform: translateY(-20px) perspective( 600px ) rotateX( 10deg );
	-moz-transform: translateY(-20px) perspective( 600px ) rotateX( 10deg );
	-ms-transform: translateY(-20px) perspective( 600px ) rotateX( 10deg );
	-o-transform: translateY(-20px) perspective( 600px ) rotateX( 10deg );
	transform: translateY(-20px) perspective( 600px ) rotateX( 10deg );

}

/* animate in */
.my-mfp-slide-bottom.mfp-ready .zoom-anim-dialog {
	opacity: 1;
	-webkit-transform: translateY(0) perspective( 600px ) rotateX( 0 ); 
	-moz-transform: translateY(0) perspective( 600px ) rotateX( 0 ); 
	-ms-transform: translateY(0) perspective( 600px ) rotateX( 0 ); 
	-o-transform: translateY(0) perspective( 600px ) rotateX( 0 ); 
	transform: translateY(0) perspective( 600px ) rotateX( 0 ); 
}

/* animate out */
.my-mfp-slide-bottom.mfp-removing .zoom-anim-dialog {
	opacity: 0;

	-webkit-transform: translateY(-10px) perspective( 600px ) rotateX( 10deg ); 
	-moz-transform: translateY(-10px) perspective( 600px ) rotateX( 10deg ); 
	-ms-transform: translateY(-10px) perspective( 600px ) rotateX( 10deg ); 
	-o-transform: translateY(-10px) perspective( 600px ) rotateX( 10deg ); 
	transform: translateY(-10px) perspective( 600px ) rotateX( 10deg ); 
}

/* Dark overlay, start state */
.my-mfp-slide-bottom.mfp-bg {
	opacity: 0.01;

	-webkit-transition: opacity 0.3s ease-out; 
	-moz-transition: opacity 0.3s ease-out; 
	-o-transition: opacity 0.3s ease-out; 
	transition: opacity 0.3s ease-out;
}
/* animate in */
.my-mfp-slide-bottom.mfp-ready.mfp-bg {
	opacity: 0.8;
}
/* animate out */
.my-mfp-slide-bottom.mfp-removing.mfp-bg {
	opacity: 0;
}

