@import url(https://fonts.googleapis.com/css?family=Ubuntu:400,300,200);
@import url(https://fonts.googleapis.com/css?family=Kaushan+Script);
@import url(../fonts/font.css);

/* Reset CSS
 * --------------------------------------- */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,
form,fieldset,input,textarea,p,blockquote,th,td {
	font-family: 'Ubuntu', arial, helvetica;
	padding: 0;
	margin: 0;
}
a{
	text-decoration:none;
}
table {
	border-spacing: 0;
}
fieldset,img {
	border: 0;
}
address,caption,cite,code,dfn,em,strong,th,var {
	font-weight: normal;
	font-style: normal;
}
strong{
	font-weight: bold;
}
ol,ul {
	list-style: none;
	margin:0;
	padding:0;
}
caption,th {
	text-align: left;

}
h1,h2,h3,h4,h5,h6 {
	font-weight: normal;
	font-size: 100%;
	margin:0;
	padding:0;
	color:#444;
}
q:before,q:after {
	content:'';
}
abbr,acronym { border: 0;
}


/* Custom CSS
 * --------------------------------------- */
body{
	font-family: 'Ubuntu', arial, helvetica;
	color: #333;
	color: rgba(0,0,0,0.5);
}
.wrap{
	margin-left: auto;
	margin-right: auto;
	width: 960px;
	position: relative;
}
h1{
	font-size: 6em;
}
p{
	font-size: 2em;
}
.intro p{
	width: 50%;
	margin: 0 auto;
	font-size: 1.5em;
}
.section{
	text-align:center;
}
#menu li {
	display:inline-block;
	margin: 10px;
	color: #000;
	background:#fff;
	background: rgba(255,255,255, 0.5);
	-webkit-border-radius: 10px;
	border-radius: 10px;
}
#menu li.active{
	background:#666;
	background: rgba(0,0,0, 0.5);
	color: #fff;
}
#menu li a{
	text-decoration:none;
	color: #000;
}
#menu li.active a:hover{
	color: #000;
}
#menu li:hover{
	background: rgba(255,255,255, 0.8);
}
#menu li a,
#menu li.active a{
	padding: 9px 18px;
	display:block;
}
#menu li.active a{
	color: #fff;
}
#menu{
	position:fixed;
	top:0;
	left:0;
	height: 40px;
	z-index: 70;
	width: 100%;
	padding: 0;
	margin:0;
}
.twitter-share-button{
	position: fixed;
	z-index: 99;
	right: 149px;
	top: 9px;
}
#download{
	margin: 10px 0 0 0;
	padding: 15px 10px;
	color: #fff;
	text-shadow: 0 -1px 0 rgba(0,0,0,0.25);
	background-color: #49afcd;
	background-image: -moz-linear-gradient(top, #5bc0de, #2f96b4);
	background-image: -ms-linear-gradient(top, #5bc0de, #2f96b4);
	background-image: -webkit-gradient(linear,0 0,0 100%,from( #5bc0de),to( #2f96b4));
	background-image: -webkit-linear-gradient(top, #5bc0de, #2f96b4);
	background-image: -o-linear-gradient(top, #5bc0de, #2f96b4);
	background-image: linear-gradient(top, #5bc0de, #2f96b4);
	background-repeat: repeat-x;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5bc0de', endColorstr='#2f96b4', GradientType=0);
	border-color: #2f96b4 #2f96b4 #1f6377;
	border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) rgba(0,0,0,.25);
	filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);

	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	vertical-align: middle;
	cursor: pointer;
	display: inline-block;
	-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
	-moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
}
#download a{
	text-decoration:none;
	color:#fff;
}
#download:hover{
	text-shadow: 0 -1px 0 rgba(0,0,0,.25);
	background-color: #2F96B4;
	background-position: 0 -15px;
	-webkit-transition: background-position .1s linear;
	-moz-transition: background-position .1s linear;
	-ms-transition: background-position .1s linear;
	-o-transition: background-position .1s linear;
	transition: background-position .1s linear;
}
#infoMenu{
	height: 20px;
	color: #f2f2f2;
	position:fixed;
	z-index:70;
	bottom:0;
	width:100%;
	text-align:right;
	font-size:0.9em;
	padding:8px 0 8px 0;
}
#infoMenu ul{
	padding: 0 40px;
}
#infoMenu li a{
	display: block;
	margin: 0 22px 0 0;
	color: #333;
}
#infoMenu li a:hover{
	text-decoration:underline;
}
#infoMenu li{
	display:inline-block;
	position:relative;
}
#examplesList{
	display:none;
	background: #282828;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	padding: 20px;
	float: left;
	position: absolute;
	bottom: 29px;
	right: 0;
	width:638px;
	text-align:left;
}
#examplesList ul{
	padding:0;
}
#examplesList ul li{
	display:block;
	margin: 5px 0;
}
#examplesList ul li a{
	color: #BDBDBD;
	margin:0;
}
#examplesList ul li a:hover{
	color: #f2f2f2;
}
#examplesList .column{
	float: left;
	margin: 0 20px 0 0;
}
#examplesList h3{
	color: #f2f2f2;
	font-size: 1.2em;
	margin: 0 0 15px 0;
	border-bottom: 1px solid rgba(0, 0, 0, 0.4);
	-webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1);
	-moz-box-shadow: 0 1px 0 rgba(255,255,255,0.1);
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1);
	padding: 0 0 5px 0;
}

/*Theme style*/
::selection {
  background: #4bd9ed; /* Safari, Chrome, Opera */
}
::-moz-selection {
  background: #4bd9ed; /* FireFox */
}
*:focus {
	outline: none;
}
::-webkit-input-placeholder {color:white;}
::-moz-placeholder          {color:white;}/* Firefox 19+ */
:-moz-placeholder           {color:white;}/* Firefox 18- */
:-ms-input-placeholder      {color:white;}

h1 {
	font-size: 5em;
	font-family: arial,helvetica;
	color: #fff;
	margin:0;
}
.intro p{
	color: #fff;
}

/* Overwriting styles for control arrows for slides
* --------------------------------------- */
.controlArrow.prev {
	left: 50px;
}
.controlArrow.next{
	right: 50px;
}

/*section 0 */
#section0 {
	background-image: url(../images/section0.jpg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
#section0 .logo {
	margin: 0 50% 0 15%;
	text-align: left;
	padding-top: 3%;
}
#section0 .logo a {
	color: #4bd9ed;
	font-size: 45px;
	font-family: 'Kaushan Script', 'Ubuntu', Arial;
}
#section0 .text {
	font-family: 'OwnHand', 'Ubuntu', Arial;
	color: white;
	font-size: 2.7em;
	line-height: 86%;
	margin: 10% 50% 0 15%;
	text-align: left;
}

/*main nav*/
.main-nav {
	position: relative;
	z-index: 9999;
	top: 9%;
	left: 11%;
}
#nav-toggle {
	position: fixed;
	width: 30px;
	height: 30px;
	border: 0;
	padding: 20px 40px 23px 12px;
	background-color: transparent;
	top: 0;
	left: 0;
	cursor: pointer;
}
#nav-toggle span, 
#nav-toggle span:before, 
#nav-toggle span:after {
	height: 3px;
	width: 28px;
	content: '';
	display: block;
	background: #FFF;
	cursor: pointer;
	border-radius: 1px;
	position: absolute;
	-webkit-box-shadow: #555555 0px 0px 1px;
	-moz-box-shadow: #555555 0px 0px 1px;
	box-shadow: #555555 0px 0px 1px;
	-webkit-transition: all 0.3s ease-in-out 0s;
	-moz-transition: all 0.3s ease-in-out 0s;
	-ms-transition: all 0.3s ease-in-out 0s;
	-o-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
}
#nav-toggle.active span {
	background-color: white;
	-webkit-box-shadow: white 0px 0px 0px;
	-moz-box-shadow: white 0px 0px 0px;
	box-shadow: white 0px 0px 0px;
}
#nav-toggle.active span:before,
#nav-toggle.active span:after {
	top: 0;
	background: black;
}
#nav-toggle span:before {
	top: -10px;
}
#nav-toggle span:after {
	bottom: -10px;
}
#nav-toggle.active span:before {
	transform: rotate(45deg);
}
#nav-toggle.active span:after {
	transform: rotate(-45deg);
}
.overlay {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	opacity: 0.2;
	background: white;
	z-index: 999;
}
.overlay-door {
	visibility: hidden;
	width: 0;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	-webkit-transition: width 0.5s 0.2s,visibility 0s 0.8s;
	transition: width 0.5s 0.2s,visibility 0s 0.8s;
}
.overlay-door.open {
	visibility: visible;
	width: 100%;
	opacity: 1;
	-webkit-transition: width 0.5s;
	transition: width 0.5s;
}
.overlay ul {
	padding: 0;
	width: 90vw;
	height: 70vh;
	margin: 0 auto;
	list-style: none;
	position: relative;
}
.overlay ul li {
	width: 100%;
	margin: 0 auto;
	display: block;
	text-align: center;
	vertical-align: middle;
	height: calc(100% / 6);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
.overlay ul li a {
	width: 60%;
	margin: 0 auto;
	display: block;
	color: #191919;
	font-size: 3em;
	font-weight: 100;
	text-align: center;
	transition: color 0.2s;
	text-transform: uppercase;
	border: 3px solid transparent;
	-webkit-transition: color 0.2s;
	z-index: 99999;
}
.overlay ul li a:hover {
	border-bottom: 4px solid #4BD9ED;
}
.overlay-door nav {
	opacity: 0;
}
.overlay-door.open nav {
	opacity: 1;
	-webkit-transition-delay: 0.5s;
	transition-delay: 0.5s;
}
.overlay-door.open .logo {
	opacity: 1;
}
.overlay-door .logo {
	margin: 0 auto;
	text-align: center;
	padding-top: 3%;
	padding-bottom: 3%;
	opacity: 0;
}
.overlay-door .logo a {
	color: #4bd9ed;
	font-size: 45px;
	font-family: 'Kaushan Script', 'Ubuntu', Arial;
}

/*lang menu*/
ul#lang-soc {
	position: fixed;
	right: 15%;
	top: 10%;
	z-index: 999;
}
ul#lang-soc li {
	display: inline-block;
	vertical-align: top;
	margin: 0 4px;
}
ul#lang-soc li a {
	display: block;
	width: 20px;
	height: 20px;
	color: white;
	border: 2px solid #fff;
	border-radius: 30px;
	padding: 4px;
	font-size: 13px;
	line-height: 19px;
	text-align: center;
}
ul#lang-soc li a:hover,
ul#lang-soc li.active a {
	background: #fff;
	color: #444;
	-webkit-transition: all 0.3s ease-in-out 0s;
	-moz-transition: all 0.3s ease-in-out 0s;
	-ms-transition: all 0.3s ease-in-out 0s;
	-o-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
}

/*form*/
#section0 .form {
	padding: 3% 0 2% 15%;
	text-align: left;
}
.section .form form input.form-text {
	border: none;
	background: none;
	padding: 0 0 12px 25px;
	color: #fff;
	font-size: 16px;
}
.section .form form input.form-text {outline: none;}
.section .form form input.form-text:-webkit-autofill {
	-webkit-box-shadow: inset 0 0 0 50px rgb(13, 13, 13) !important;
	-webkit-text-fill-color: #fff !important;
	color: #fff !important; 
}
.section .form form span.name {
	display: inline-block;
	width: 20%;
	margin: 0 2% 0 0;
	position: relative;
	border: solid #444348;
	border-width: 0 0 1px 0;
	overflow: hidden;
}
.section .form form span.name i {
	background: url(../images/icons.png) no-repeat;
	position: absolute;
	top: 1px;
	left: 0;
	width: 16px;
	height: 16px;
	overflow: hidden;
	background-position: -60px 0;
}
.section .form form span.mail {
	display: inline-block;
	width: 20%;
	position: relative;
	border: solid #444348;
	border-width: 0 0 1px 0;
	overflow: hidden;
}
.section .form form span.mail i {
	background: url(../images/icons.png) no-repeat;
	position: absolute;
	top: 3px;
	left: 0;
	width: 16px;
	height: 12px;
	overflow: hidden;
	background-position: 0 -12px;
}
.section .form form span.submit {
	display: inline-block;
}
.section .form form input[type='submit'] {
	display: inline-block;
	border: none;
	background-color: #45d8e8;
	border: 2px solid #45d8e8;
	padding: 7px 26px 9px;
	border-radius: 50px;
	cursor: pointer;
	font-size: large;
	vertical-align: bottom;
	margin: 0 0 0 15px;
}
.section .form form input[type='submit']:hover {
	background: none;
	border: 2px solid #45d8e8;
	-webkit-transition: all 0.3s ease-in-out 0s;
	-moz-transition: all 0.3s ease-in-out 0s;
	-ms-transition: all 0.3s ease-in-out 0s;
	-o-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
	color: white;
}

.mouse {
	width: 18px;
	position: absolute;
	height: 35px;
	border-radius: 15px;
	border: 2px solid #888;
	bottom: 40px;
	left: 50%;
	margin-left: -12px;
}
.mouse .scroll {
	display: block;
	margin: 6px auto;
	width: 3px;
	height: 3px;
	border-radius: 4px;
	background: #888;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
	-webkit-animation-name: scroll;
	animation-name: scroll;
}
@keyframes scroll{0%{opacity:1;}100%{opacity:0;-webkit-transform:translateY(20px);-ms-transform:translateY(20px);transform:translateY(20px);}}
@-webkit-keyframes scroll{0%{opacity:1;}100%{opacity:0;-webkit-transform:translateY(20px);transform:translateY(20px);}}
.scroll-down {
	color: #888;
	bottom: 1.2em;
	width: 100%;
	clear: both;
	font-size: 12px;
	position: absolute;
	text-align: center;
	text-transform: uppercase;
}

#section0 .next-page a {
	background: url(../images/mouse.png) no-repeat;
	display: block;
	width: 20px;
	height: 33px;
	text-indent: 100%;
	overflow: hidden;
	margin: 0 auto;
	font-size: 0;
	position: absolute;
	left: 50%;
	right: 50%;
	bottom: 16%;
}
.animatebox{
	width: 35%;
	height: 200px;
	margin: 30px auto 100px auto;
	-webkit-animation-duration: 3s;
	-webkit-animation-delay: 2s;
	-webkit-animation-iteration-count: infinite;
	-moz-animation-duration: 3s;
	-moz-animation-delay: 2s;
	-moz-animation-iteration-count: infinite;
	-o-animation-duration: 3s;
	-o-animation-delay: 2s;
	-o-animation-iteration-count: infinite;
	-ms-animation-duration: 3s;
	-ms-animation-delay: 2s;
	-ms-animation-iteration-count: infinite;
}

/*section 1*/
#section1 {
	background-image: url(../images/section1.jpg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	overflow: hidden;
	position: relative;
}
.section h2 {
	font-size: 43px;
	font-family: 'OwnHand', 'Ubuntu', Arial;
	margin: 0 0 5% 0;
	padding-top: 5%;
	color: #ebebeb;
}
.section h2.moloko,
.section .form .txt.moloko {
	font-family: 'Moloko', 'Ubuntu', Arial;
}
.section .grid {
	max-width: 75%;
	margin: 0 auto;
	padding: 1% 0 0 10%;
	text-align: center;
	overflow: hidden;
}
.section .grid .block {
	display: inline-block;
	width: 30%;
	margin: 0 0px 55px 0;
	min-width: 260px;
	text-align: left;
}
.section .grid .block .img.icon {
	display: inline-block;
	color: #54d7eb;
	font-size: 80px;
	text-align: left;
}
.section .grid .block .title {
	display: inline-block;
	vertical-align: top;
	color: white;
	font-size: 18px;
	text-align: left;
	font-weight: 200;
	padding: 13px 0 0 10px;
}
/*form*/
.section .form2 {
	background-color: rgba(0,0,0,0.40);
	margin: 3% 0 0 0;
	position: absolute;
	width: 100%;
	height: 125px;
	bottom: 0;
	z-index: 10;
}
.section .form2 form {
	padding: 40px 0 0 0;
}
.section .form .txt {
	font-family: 'OwnHand', Arial;
	font-size: 30px;
	color: #C3C3C3;
	float: left;
	padding: 24px 0 0 37px;
	text-align: left;
}

/*section 2*/
#section2 {
	background-image: url(../images/section2.jpg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 20px 0 0 0;
}
#section2 h2 {
	margin: 0 0 3% 0;
	padding-top: 1%;
}
#section2 .portfolio {
	max-width: 80%;
	margin: 0 auto;
	padding: 2% 0 0 0;
}
#section2 .portfolio .work-gr {
	display: inline-block;
	margin: 3px;
	cursor: pointer;
	max-width: 380px;
}
#section2 .portfolio .work-gr img {
	width: 100%;
	height: auto;
}
#section2 .portfolio .more a {
	padding: 10px 21px;
	display: inline-block;
	color: #4BD9ED;
	border-radius: 20px;
	border: 2px solid;
	margin: 20px 0 0 0;
}
#section2 .portfolio .more a:hover {
	border-color: white;
	color: black;
	background: white;
	-webkit-transition: all 0.3s ease-in-out 0s;
	-moz-transition: all 0.3s ease-in-out 0s;
	-ms-transition: all 0.3s ease-in-out 0s;
	-o-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
}
#section2 .portfolio .more a i {
	background: url(../images/icons.png) no-repeat -40px 0px;
	width: 20px;
	height: 12px;
	display: inline-block;
	vertical-align: middle;
	margin: 0 10px 1px 0;
}
#section2 .portfolio .more a:hover i {
	background-position: -40px -12px;
	-webkit-transition: all 0.3s ease-in-out 0s;
	-moz-transition: all 0.3s ease-in-out 0s;
	-ms-transition: all 0.3s ease-in-out 0s;
	-o-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
}
#cboxLoadedContent iframe.cboxIframe img { width: 100%; }

/*section 3*/
#section3 {
	background-image: url(../images/section3.jpg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	overflow: hidden;
	position: relative;
}
#section3 h2 {
	margin: 0 0 4% 0;
	padding-top: 2%;
}
#section3 .grid .block {
	padding: 0 20px 0 0;
}
#section3 .grid .block .icon {
	color: #45d8e8;
	font-size: 40px;
}
#section3 .grid .block .title {
	padding: 7px 0 7px 0;
}
#section3 .grid .block .descr {
	color: #949494;
}

/*section 4*/
#section4 {
	background-image: url(../images/section4.jpg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	overflow: hidden;
	position: relative;
}
#section4 h2 {
	padding-top: 2%;
	margin: 0 0 3% 0;
}
#section4 .grid {
	max-width: 100%;
}
#section4 .grid .block {
	border-right: 1px solid #494949;
	width: 20%;
	min-width: 230px;
	vertical-align: top;
	position: relative;
	padding: 0 0 40px 0;
	margin: 0 20px 0 0;
}
#section4 .grid .block:last-child {
	border: none;
}
#section4 .title {
	padding: 0 0 10px 0;
	font-size: 20px;
	height: 45px;
}
#section4 .descr {
	padding: 10px 0 20px 0;
	font-size: 15px;
	font-weight: 200;
	color: #aaa;
}
#section4 ul.num {
	color: white;
	font-weight: 200;
	min-height: 200px;
}
#section4 ul.num li {
	background: url(../images/li-on.png) no-repeat left center;
	padding: 0 0 0 32px;
	margin: 15px 0;
}
#section4 .price {
	font-size: 25px;
	color: #ccc;
	position: absolute;
	bottom: 0;
	left: 0;
}
#section4 .bottom {
	position: absolute;
	bottom: 4%;
	width: 100%;
}
#section4 .bottom a {
	display: inline-block;
	border: none;
	background-color: #45d8e8;
	border: 2px solid #45d8e8;
	padding: 7px 26px 9px;
	border-radius: 50px;
	cursor: pointer;
	font-size: large;
	vertical-align: bottom;
	margin: 0 0 0 15px;
	color: black;
}
#section4 .bottom a:hover {
	background: none;
	border: 2px solid #45d8e8;
	-webkit-transition: all 0.3s ease-in-out 0s;
	-moz-transition: all 0.3s ease-in-out 0s;
	-ms-transition: all 0.3s ease-in-out 0s;
	-o-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
	color: white;
}


/*section 5*/
#section5 {
	background-image: url(../images/section5.jpg);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	overflow: hidden;
	position: relative;
}
#section5 .title-form {
	font-size: 24px;
	color: #ccc;
	font-weight: 200;
	margin: 0 0 40px 0;
}
#section5 #contact-form {
	max-width: 85%;
	margin: 0 auto;
}
#section5 #contact-form label {
	color: #ccc;
	font-size: 18px;
	font-weight: 200;
}
#section5 #contact-form input.form-text {
	border: 1px solid #565656;
	border-width: 0 0 1px 0;
	background: none;
	padding: 0 0 2px 3px;
	margin: 0 15px 0 10px;
	color: #fff;
	font-size: 16px;
}
#section5 #contact-form span.service {
	display: block;
	margin: 0 0 50px 0;
}
#section5 #contact-form span.submit {
	display: block;
	text-align: center;
}
#section5 #contact-form input[type='submit'] {
	display: inline-block;
	border: none;
	background-color: #45d8e8;
	border: 2px solid #45d8e8;
	padding: 7px 26px 9px;
	border-radius: 50px;
	cursor: pointer;
	font-size: large;
	vertical-align: bottom;
	margin: 60px 0 0 15px;
}
#section5 #contact-form input[type='submit']:hover {
	background: none;
	border: 2px solid #45d8e8;
	-webkit-transition: all 0.3s ease-in-out 0s;
	-moz-transition: all 0.3s ease-in-out 0s;
	-ms-transition: all 0.3s ease-in-out 0s;
	-o-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
	color: white;
}

#section5 .contacks {
	position: absolute;
	bottom: 7%;
	width: 100%;
}
#section5 .contacks .block {
	display: inline-block;
	vertical-align: top;
	padding: 0 25px;
	font-size: 19px;
	font-weight: 200;
}
#section5 .contacks .block a {
	color: #ccc;
}
#section5 .contacks .block a:hover {
	color: #45d8e8;
	-webkit-transition: all 0.3s ease-in-out 0s;
	-moz-transition: all 0.3s ease-in-out 0s;
	-ms-transition: all 0.3s ease-in-out 0s;
	-o-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
}
#section5 .contacks .block.place i {
	background: url(../images/icons.png) no-repeat 0 -24px;
	width: 11px;
	height: 16px;
	margin: 0 5px 0 0;
	display: inline-block;
}
#section5 .contacks .block.phone i {
	background: url(../images/icons.png) no-repeat -16px 0;
	width: 12px;
	height: 16px;
	margin: 0 5px 0 0;
	display: inline-block;
}
#section5 .contacks .block.mail i {
	background: url(../images/icons.png) no-repeat 0 0;
	width: 16px;
	height: 12px;
	margin: 0 5px 0 0;
	display: inline-block;
}
#section5 .contacks .block.skype i {
	background: url(../images/icons.png) no-repeat -11px -24px;
	width: 17px;
	height: 17px;
	margin: 0 5px 0 0;
	display: inline-block;
}


/*Animated styles*/
#section1 h2 {
	opacity: 0;
}
#section1 h2.animated {
	opacity: 1;
}

#section1 .slide.one {
	opacity: 0;
}
#section1 .slide.one.animated {
	opacity: 1;
}

#section1 .form2.form {
	opacity: 0;
}
#section1 .form2.form.animated {
	opacity: 1;
}
/*section2*/
#section2 h2 {
	opacity: 0;
}
#section2 h2.animated {
	opacity: 1;
}

#section2 .portfolio .work-gr {
	opacity: 0;
}
#section2 .portfolio .work-gr.animated {
	opacity: 1;
}

#section2 .portfolio .more {
	opacity: 0;
}
#section2 .portfolio .more.animated {
	opacity: 1;
}
/*section3*/
#section3 h2 {
	opacity: 0;
}
#section3 h2.animated {
	opacity: 1;
}

#section3 .grid {
	opacity: 0;
}
#section3 .grid.animated  {
	opacity: 1;
}

#section3 .form2.form {
	opacity: 0;
}
#section3 .form2.form.animated  {
	opacity: 1;
}

/*section4*/
#section4 h2 {
	opacity: 0;
}
#section4 h2.animated {
	opacity: 1;
}

#section4 .grid .block {
	opacity: 0;
}
#section4 .grid .block.animated {
	opacity: 1;
}

#section4 .bottom {
	opacity: 0;
}
#section4 .bottom.animated {
	opacity: 1;
}

/*section5*/
#section5 h2 {
	opacity: 0;
}
#section5 h2.animated {
	opacity: 1;
}

#section5 .title-form {
	opacity: 0;
}
#section5 .title-form.animated {
	opacity: 1;
}

#section5 #contact-form {
	opacity: 0;
}
#section5 #contact-form.animated {
	opacity: 1;
}

#section5 .contacks {
	opacity: 0;
}
#section5 .contacks.animated {
	opacity: 1;
}