@font-face {
	font-family: 'weblysleek_uilight';
	font-weight: normal;
	font-style: normal;

	src: url('../fonts/weblysleekuil.eot');
	src: url('../fonts/weblysleekuil.eot?#iefix') format('embedded-opentype'), url('../fonts/weblysleekuil.woff') format('woff'), url('../fonts/weblysleekuil.ttf') format('truetype'), url('../fonts/weblysleekuil.svg#weblysleek_uilight') format('svg');
}
* {
	outline: none;
}
/*html, body { font-family: arial; font-size: 12px; height: 100%; margin: 0; color: #333333; background: #f7f7f7; }*/

html,
body {
	font-family: arial;
	font-family: 'weblysleek_uilight', Arial, Verdana;
	font-size: 14px;
	line-height: 21px;

	height: 100%;
	margin: 0;

	color: #333;
	background: #f1f1f1;
}
a {
	text-decoration: none;

	color: #1ba39c;
}
img {
	border: 0;
}
::selection {
	color: #fff;
	background: #65c6bb;
}
h1,
.h1 {
	font-size: 30px;
	font-weight: normal;
	line-height: 30px;

	float: left;

	width: 94%;
	margin: 0;
	padding: 38px 3% 78px 3%;

	text-transform: uppercase;

	color: #fff;
	background: url(../images/separator.png) 3% 101px no-repeat #49b8b4;
}
.h1 {
	margin-top: -40px;
}
h2,
h3 {
	font-weight: normal;
	line-height: 28px;

	margin-top: 10px;
}
.header {
	float: left;

	width: 100%;
	height: 170px;

	background: #fff;
}
.header .logo {
	float: left;

	margin: 64px 0 0 40px;
}
.header .title {
	position: relative;
	top: -7px;

	margin: 0 0 0 20px;
	padding: 0 0 3px 20px;

	color: #ccc;
	border-left: #ececec 1px solid;
}
.header .menu {
	font-size: 14px;

	float: right;

	margin: 64px 0 0 0;

	text-transform: uppercase;
}
.header .menu .menu-icon {
	display: none;
	float: right;

	width: 20px;
	height: 21px;
	padding: 6px;

	background: url(../images/menu-icon.png) center center no-repeat transparent;
}
.header .menu ul.tabs {
	display: inline-block;

	margin: 0;
	padding: 0;
}
.header .menu ul.tabs li {
	float: left;

	margin: 0;
	padding: 0;

	list-style: none;
}
.header .menu a {
	color: #333;
}
.header .menu a.active {
	border-bottom: 1px solid #27bdac;
}
.header .lang-select {
	position: relative;

	display: inline-block;
	float: right;

	margin: 0;
	margin: 65px 40px 0 0;
	padding: 0;
}
.header .lang-select .select {
	display: inline-block;
}
.header .lang-select .icon {
	display: none;
}
.header .lang-select a {
	margin-left: 10px;
	padding-bottom: 5px;

	color: #333;
	border-left: 1px solid #ccc;
}
.header .lang-select a b {
	display: inline-block;

	width: 18px;
	height: 15px;
	margin: 0 2px 0 10px;

	background: url(../images/flags.png) 0 0 no-repeat transparent;
}
.header .lang-select a b.en {
	background-position: 0 0;
}
.header .lang-select a b.hu {
	background-position: 0 -21px;
}
.header .lang-select a i {
	display: inline-block;

	width: 5px;
	height: 8px;
	margin: 0 2px 0 6px;

	background: url(../images/select-arrow.png) 0 0 no-repeat transparent;
}
.header .lang-select ul {
	position: absolute;
	z-index: 4;
	top: 30px;
	right: 0;

	display: none;

	width: 127px;
	margin: 0;
	padding: 0;

	border: 1px solid #e7e7e7;
	background: #fff;
}
.header .lang-select ul li {
	display: block;

	list-style: none;
}
.header .lang-select ul li a {
	display: block;

	padding: 13px 8px;

	border: 0;
}
.header .lang-select ul li a b {
	margin-left: 0;
}
.boxes {
	float: left;

	width: 100%;

	background: #f1f1f1;
}
.boxes .text-box {
	float: left;

	width: 215px;
	height: 125px;
	padding: 25px 20px;

	color: #fff;
}
.boxes .text-box.first {
	background: #1ba39c;
}
.boxes .text-box.second {
	background: #49b8b4;
}
.boxes .text-box.third {
	background: #65c6bb;
}
.boxes .text-box.fourth {
	background: #27bdac;
}
.boxes .text-box .title {
	font-size: 24px;

	float: left;

	width: 215px;

	text-transform: uppercase;
}
.boxes .text-box .separator {
	float: left;

	width: 215px;
	height: 1px;
	margin-top: 19px;

	background: url(../images/separator.png) left center no-repeat transparent;
}
.boxes .text-box .description {
	font-size: 14px;

	float: left;

	margin-top: 17px;
}
.boxes .image-box {
	position: relative;

	float: left;
	overflow: hidden;

	width: 255px;
	height: 175px;

	cursor: pointer;

	background: url(../images/loader.gif) center center no-repeat;
}
.boxes .image-box .inside {
	float: left;

	opacity: 0;
}
.boxes .image-box .inside > * {
	transition: opacity .5s;
}
.boxes .image-box .inside > span.title {
	transition: all .5s;
}
.boxes .image-box img {
	position: absolute;
	top: 0;
	left: 0;

	width: 255px;
	height: 175px;
}
.boxes .image-box img.color {
	opacity: 0;
}
.boxes .image-box span.title {
	font-weight: bold;

	position: absolute;
	bottom: -41px;
	left: 0;

	width: 235px;
	height: 17px;
	padding: 11px 10px 13px;

	color: #333;
	background: #fff;
}
.boxes .image-box:hover img.color {
	opacity: 1;
}
.boxes .image-box:hover span.title {
	bottom: 0;
}
.project-header {
	float: left;

	width: 94%;
	margin-top: -25px;
	padding: 0 3% 25px 3%;

	background: #49b8b4;
}
.project-header a {
	font-size: 14px;

	text-transform: uppercase;

	color: #fff;
}
.project-header .all {
	float: left;

	padding: 25px 0 10px 40px;

	background: none;
	background: url(../images/icon-all.png) 0 23px no-repeat;
}
.project-header .next {
	float: right;

	margin-top: 25px;
	margin-right: 3%;
	margin-left: 70px;
}
.project-header .prev {
	float: right;

	margin-top: 25px;
}
.project-header .prev img {
	position: relative;
	top: 3px;
	left: -30px;
}
.project-header .next img {
	position: relative;
	top: 3px;
	right: -30px;
}
.project {
	float: left;

	width: 100%;

	background: #fff;
}
.project .info {
	float: left;

	width: 100%;
	margin-top: 20px;
}
.project .info .title {
	font-size: 24px;
	line-height: 24px;

	float: left;

	width: 13%;
	margin: 20px 2% 0 3%;

	text-align: right;
}
.project .info .title span {
	font-size: 14px;
	line-height: 16px;
}
.project .info .description {
	float: left;

	width: 28%;
	margin: 20px 2% 0 2%;
}
.project .info .tags {
	float: left;

	width: 28%;
	margin: 20px 2% 0 2%;
}
.project .info .tags .status {
	display: inline-block;

	width: 100%;
	margin-bottom: 5px;
}
.project .info .tags span {
	display: inline-block;

	margin: 0 0 4px 0;
	padding: 0 6px;

	color: #fff;
	background: #87d8cf;
}
.project .info .space {
	float: left;

	width: 18%;
}
.project .block {
	float: left;

	width: 100%;
	margin-top: 40px;
	margin-bottom: 20px;
}
.project .block .title {
	float: left;

	width: 18%;
}
.project .block .title span {
	float: left;

	width: 85%;
	padding: 10px 5% 10px 0;

	text-align: right;

	color: #fff;
	background: #6bc7bd;
}
.project .block .title a {
	float: right;

	margin: 10px 15% 0 0;
}
.project .block .title i {
	float: right;

	margin: 10px 15% 0 0;

	color: #777;
}
.project .block .device {
	float: left;

	width: 60%;
	min-width: 602px;
	margin: 0 2%;

	text-align: center;
}
.project .block .device .paginate {
	float: left;

	width: 100%;
	margin: 16px 0 22px;

	text-align: center;
}
.project .block .device .paginate.for-iphone4 {
	position: relative;
	z-index: 2;

	margin-top: -30px;
	margin-bottom: 60px;
}
.project .block .device .paginate .left {
	padding: 0 5px;

	color: #fff;
	background: #65c6bb;
}
.project .block .device .paginate .page {
	padding: 0 10px;

	color: #fff;
	background: #1ba39c;
}
.project .block .device .paginate .right {
	padding: 0 5px;

	color: #fff;
	background: #65c6bb;
}
.project .block .device .paginate .inactive {
	cursor: default;

	color: #fff;
	background: #fff;
}

.project .block .device .mac {
	display: inline-block;

	width: 100%;
	/*height: 362px;*/
	margin-top: 20px;
	/*background: url(../images/mac.png) center center no-repeat;*/
}
.project .block .device .mac .screen {
	display: inline-block;
	overflow: hidden;

	width: 100%;
	/*height: 286px;*/
	/*height: 362px;*/
/*	box-shadow: 0 0 0 1px #e7e7e7;*/
	margin-top: 18px;
}
.project .block .device .mac .screen .screenshots {
	position: relative;
	left: 0;

	display: inline-block;
	float: left;

	width: 100%;
	/*height: 286px;*/
	/*height: 362px;*/
}

.project .block .device .mac .screen .screenshots .screenshots-cell {
	float: left;
	width: 100%;
	border: 1px solid #e7e7e7;
	/*height: 362px;*/
}

/*
.project .block .device .mac img {
	float: left;

	width: 457px;
	height: 286px;
}
*/

.project .block .device .iphone4 {
	display: inline-block;

	width: 297px;
	height: 492px;
	margin-top: 20px;

	background: url(../images/iphone4.png) center center no-repeat;
}
.project .block .device .iphone4 .screen {
	display: inline-block;
	overflow: hidden;

	width: 178px;
	height: 267px;
	margin-top: 73px;
}
.project .block .device .iphone4 .screen .screenshots {
	position: relative;
	left: 0;

	display: inline-block;
	float: left;

	width: 178px;
	height: 267px;
}
.project .block .device .iphone4 img {
	float: left;

	width: 178px;
	height: 267px;
}
.project .block .space {
	float: left;

	width: 18%;
}
.texts {
	font-size: 16px;
	line-height: 22px;

	float: left;

	width: 94%;
	margin: 0;
	padding: 0 3% 80px 3%;

	color: #fff;
	background: #49b8b4;
}
.texts p.larger {
	font-size: 22px;
	line-height: 33px;

	margin-bottom: 50px;
}
.texts a {
	text-decoration: underline;

	color: #fff;
}
.about-container {
	float: left;

	width: 100%;

	background: #f9f9f9;
}
.about-title {
	float: left;

	width: 100%;
	margin: 60px 0 50px;
}
.about-title .inside {
	font-size: 28px;
	line-height: 40px;

	width: 812px;
	margin: 0 auto;

	text-align: center;

	color: #777;
}
.we {
	float: left;

	width: 100%;
}
.we .inside {
	width: 511px;
	margin: 0 auto;

	text-align: center;
}
.we .inside .picture {
	position: relative;
	z-index: 3;

	display: inline-block;

	width: 511px;
}
.we .left,
.we .right {
	position: absolute;
	z-index: -1;
	top: 252px;
	left: -238px;

	width: 280px;

	text-align: left;

	color: #fff;
}
.we .left .head,
.we .right .head {
	float: left;

	width: 184px;
	padding: 20px 43px 20px 38px;

	background: #1ba39c;
}
.we .left .head .name,
.we .right .head .name {
	font-size: 24px;

	float: left;

	width: 100%;
}
.we .left .head .title,
.we .right .head .title {
	font-size: 16px;

	float: left;

	width: 100%;
	margin-top: 2px;
}
.we .left .description,
.we .right .description {
	font-size: 14px;

	float: left;

	width: 212px;
	margin-top: 10px;
	padding: 15px 44px 14px 24px;

	background: #49b8b4;
}
.we .right {
	right: -228px;
	left: auto;
}
.we .left .head {
	margin-left: 15px;
}
.we .right .head {
	padding: 20px 43px 20px 38px;

	text-align: right;
}
.we .right .description {
	padding: 15px 24px 14px 44px;

	text-align: right;
}
.testimonials {
	float: left;

	width: 100%;

	background: #49b8b4;
}
.testimonials .one {
	float: left;

	width: 90%;
	margin: -20px 5% 50px;
}
.testimonials .one .image {
	float: left;

	width: 91px;
	margin-right: 40px;
}
.testimonials .one .text {
	font-size: 14px;
	line-height: 27px;

	position: relative;

	float: left;

	width: 60%;
	padding: 14px 26px 17px;

	background: #fff;
}
.testimonials .one .text .arrow {
	position: absolute;
	top: 38px;
	left: -10px;

	display: inline-block;

	width: 11px;
	height: 16px;

	background: url(../images/arrow-left.png) center center no-repeat transparent;
}
.testimonials .one .text .name {
	font-size: 16px;
	font-style: italic;

	float: right;

	color: #999;
}
.testimonials .one .text .quote {
	font-family: Georgia;
	font-size: 48px;

	position: relative;
	top: 21px;

	display: inline-block;

	height: 22px;

	color: #aaa;
}
.footer {
	line-height: 18px;

	float: left;

	width: 100%;

	background: #f1f1f1;
}
.footer a {
	text-decoration: underline;

	color: #555;
}
.footer ul {
	float: left;

	width: 14%;
	margin: 20px 3%;
	padding: 0;
}
.footer ul li {
	font-size: 11px;

	margin: 0;
	padding: 0;

	list-style: none;

	color: #555;
}
@media screen and (max-width: 942px) {
	.header .title {
		display: none;
	}
}
@media screen and (max-width: 800px) {
	.about-title .inside {
		font-size: 24px;
		line-height: 32px;

		width: 90%;
	}
}
@media screen and (max-width: 768px) {
	.header {
		height: 60px;
	}
	.header .separator {
		display: none;
	}
	.header .logo {
		width: 100%;
		margin: 19px 0 0;

		text-align: center;
	}
	.header .menu {
		position: absolute;
		top: 11px;
		left: 15px;

		margin: 0;
	}
	.header .menu .menu-icon {
		display: inline-block;
	}
	.header .menu ul.tabs {
		position: absolute;
		z-index: 4;
		top: 39px;
		left: 0;

		display: none;

		border: 1px solid #e7e7e7;
		background: #fff;
	}
	.header .menu ul.tabs li {
		float: none;

		width: 200px;
	}
	.header .menu ul.tabs li a {
		display: block;

		padding: 16px 20px;
	}
	.header .menu ul.tabs li a.active {
		font-weight: bold;

		border: 0;
	}
	.header .lang-select {
		position: absolute;
		top: 9px;
		right: 10px;

		margin: 0;
	}
	.header .lang-select ul {
		top: 41px;
		right: 4px;
	}
	.header .lang-select .icon {
		position: relative;
		top: 4px;

		display: inline-block;

		margin: 0;
		padding: 11px 10px 11px 10px;

		border: 0;
	}
	.header .lang-select .select {
		display: none;
	}
	.header .lang-select a b {
		width: 16px;
		height: 11px;
		margin: 0 5px 0 0;
	}
	.header .lang-select a b.hu {
		background-position: -2px -25px;
	}
	.header .lang-select a b.en {
		background-position: -2px -4px;
	}
	.boxes .image-box img.color {
		display: inline-block;
	}
	.footer ul {
		float: left;

		width: 30%;
		margin: 20px 0 20px 3%;
		padding: 0;
	}
	h1 {
		width: 90%;
		padding: 38px 5% 78px 5%;

		background-position: 5% 101px;
	}
	.texts {
		width: 90%;
		padding: 0 5% 80px 5%;
	}
	.project .info .title {
		width: 18%;
		margin: 20px 5% 0 0;
	}
	.project .info .description {
		float: left;

		width: 35%;
		margin: 20px 3% 0 0;
	}
	.project .info .tags {
		float: left;

		width: 35%;
		margin: 20px 3% 0 0;
	}
	.project .info .space {
		float: left;

		width: 0;
	}
	.project .block .title {
		font-size: 18px;

		width: 100%;
	}
	.project .block .title span {
		width: 30%;
		padding: 10px 2% 11px 0;
	}
	.project .block .title a {
		float: left;

		margin: 10px 0 0 3%;
	}
	.project .block .title i {
		float: left;

		margin: 10px 0 0 3%;
	}
	.project .block .device {
		width: 99%;
		min-width: 0;
		margin: 20px 0 0;
	}
	.project .block .space {
		width: 0;
	}
	.project-header {
		width: 90%;
		padding: 0 5% 25px 5%;
	}
	.project-header .next {
		margin-right: 5%;
	}
	.we .left {
		position: relative;
		top: 0;
		left: 0;

		float: left;

		width: 50%;
	}
	.we .left .head {
		width: 90%;
		margin: 0;
		padding: 20px 5%;

		background: #1ba39c;
	}
	.we .left .head .name {
		float: left;

		width: 100%;
	}
	.we .left .head .title {
		font-size: 14px;

		float: left;

		margin-top: 1px;
	}
	.we .left .description {
		float: left;

		width: 90%;
		margin: 0;
		padding: 20px 5%;

		background: #1ba39c;
	}
	.we .right {
		position: relative;
		top: 0;
		left: 0;

		float: right;

		width: 50%;
	}
	.we .right .head {
		width: 90%;
		margin: 0;
		padding: 20px 5%;

		background: #49b8b4;
	}
	.we .right .head .name {
		float: right;

		width: 100%;
	}
	.we .right .head .title {
		font-size: 14px;

		float: right;

		margin-top: 1px;
	}
	.we .right .description {
		float: right;

		width: 90%;
		margin: 0;
		padding: 20px 5%;

		background: #49b8b4;
	}
	.we .inside {
		width: 100%;
	}
	.we .inside .picture {
		width: 100%;
	}
	.we .picture img {
		width: 70%;
	}
}
@media screen and (max-width: 617px) {
	.project .block {
		margin-bottom: 0;
	}
	.project .block .device {
		min-width: 0;
		margin-top: 0;
		margin-bottom: 0;
	}
	.project .block .device .mac {
		width: 100%;
		height: auto;
		margin-top: 0;

		background: none;
	}
	.project .block .device .iphone4 {
		width: 100%;
		height: auto;
		margin-top: 0;

		background: none;
	}
	.project .block .device .paginate.for-iphone4 {
		margin-top: 20px;
	}
	.project .block .device .iphone4 .screen {
		margin-top: 30px;
	}
}
@media screen and (max-width: 530px) {
	.testimonials .one .image {
		float: left;

		width: 100%;
		margin: 20px 0 28px;

		text-align: center;
	}
	.testimonials .one .text {
		width: 90%;
		padding: 14px 5% 17px;
	}
	.testimonials .one .text .arrow {
		top: -12px;
		left: 0;

		width: 100%;
		height: 13px;

		background: url(../images/arrow-top.png) center center no-repeat transparent;
	}
}
@media screen and (max-width: 480px) {
	.boxes .image-box {
		width: 90% !important;
		height: auto !important;
		margin: 20px 5% 0;

		border: 1px solid #e7e7e7;
		box-shadow: 1px 1px 0 rgba(0, 0, 0, .1);
	}
	.boxes .image-box span.title {
		font-size: 18px;

		position: relative;
		bottom: 0;

		float: left;

		width: 90% !important;
		padding: 18px 5% 23px;
	}
	.boxes .image-box img {
		position: relative;

		float: left;

		width: 100% !important;
		height: auto !important;
	}
	.boxes .image-box img.color {
		display: none;
	}
	.boxes .text-box {
		width: 80% !important;
		height: auto !important;
		margin: 20px 5% 0;
		padding: 30px 5%;

		box-shadow: 1px 1px 0 rgba(0, 0, 0, .1);
	}
	.boxes .text-box .description {
		font-size: 20px;
		line-height: 34px;

		min-height: 120px;
	}
	.project-header {
		width: 90%;
		padding: 0 5% 25px 5%;
	}
	.project-header .all {
		display: none;
	}
	.project-header .prev {
		float: left;

		margin-left: 8%;
	}
	.project-header .next {
		margin-right: 8%;
	}
	.project .info .title {
		width: 90%;
		margin: 20px 5% 0 5%;

		text-align: left;
	}
	.project .info .description {
		float: left;

		width: 90%;
		margin: 20px 5% 0 5%;

		text-align: left;
	}
	.project .info .tags {
		float: left;

		width: 90%;
		margin: 20px 5% 0 5%;

		text-align: left;
	}
	.project .block .title {
		font-size: 18px;

		width: 100%;
	}
	.project .block .title span {
		width: 50%;
		padding: 10px 4% 11px 0;
	}
	.project .block .title a {
		font-size: 14px;

		float: left;

		width: 50%;
		margin: 10px 2% 11px 0;

		text-align: right;
	}
	.project .block .title i {
		font-size: 14px;

		float: left;

		width: 50%;
		margin: 10px 2% 11px 0;

		text-align: right;
	}
	.about-title {
		margin: 30px 0 20px;
	}
	.about-title .inside {
		font-size: 18px;
		line-height: 26px;
	}
	.we .left,
	.we .right {
		width: 95%;
		margin-bottom: 20px;
	}
	.we .right {
		margin-bottom: 0;
	}
	.we .picture img {
		width: 80%;
	}
}
@media screen and (min-width: 769px) {
	.header .menu ul {
		display: inline-block !important;
	}
}