.width {
	max-width: 1024px;
	margin-left: auto;
	margin-right: auto;
}

.logo {
	display: inline-block;
	background-repeat: no-repeat;
	background-position: center center;
	background-image: url(../images/logo.png?v3222);
	background-size: 64px 64px;
	width: 64px;
	height: 64px;
}

/* app input */
.app-input {
	width: calc(100% - 20px);
	height: 30px;
	padding: 5px;
	padding-left: 10px;
	padding-right: 10px;
	border: 1px solid #e0dfdf;
	font-family: Conv_bpg_arial;
	font-size: 16px;
	
	-webkit-border-radius: 21px;
	-moz-border-radius: 21px;
	border-radius: 21px;
	
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

.app-button {
	background-color: #bd0a4e;
	color: #ffffff;
	font-family: Conv_bpg_arial;
	font-size: 18px;
	width: 100%;
	height: 40px;
	padding: 10px;
	border: none;
	cursor: pointer;
	
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

.app-button:hover {
	opacity: 0.6;
}

.app-button[item-waiting="1"] {
	background-image: url(../images/ripple-white.svg);
	background-size: cover;
	background-position: center;
}

/* header */
.header {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 64px;
	padding-top: 15px;
	padding-bottom: 15px;
	background-color: #ffffff;
	z-index: +1;
	
	-webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.header-logo-text {
	display: inline-block;
	width: 120px;
	height: 64px;
	background-image: url(../images/logo-text.png?v12222);
	background-repeat: no-repeat;
	background-position: left center;
	background-size: 80px 42px;
	margin-left: 8px;
	cursor: pointer;
}

.header-items {
	display: inline-block;
	overflow: hidden;
}

.header-menu {
	display: none;
}

.header-item {
	display: inline-block;
	font-family: 'Conv_bpg_arial';
	font-size: 18px;
	height: 64px;
	line-height: 64px;
	margin-left: 24px;
	color: #121212;
	cursor: pointer;
}

.header-item:hover {
	color: #bd0a4e;
}

.header-btn {
	display: inline-block;
	background-color: #bd0a4e;
	color: #ffffff;
	font-family: 'Conv_bpg_arial';
	font-size: 18px;
	width: 180px;
	min-height: 24px;
	line-height: 24px;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-left: 24px;
	vertical-align: middle;
	text-align: center;
	cursor: pointer;
	
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

.header-btn:hover {
	background-color: #aa0745;
	box-shadow: 1px 1px 20px 0 rgba(142, 4, 43, 0.2);
}

/* footer */
.footer {
	background-color: #313131;
	padding-top: 60px;
	padding-bottom: 40px;
}

.footer-item {
	display: inline-block;
	width: 300px;
	font-family: 'Conv_bpg_arial';
	font-size: 16px;
	color: #ffffff;
	vertical-align: top;
}

.footer-item-link {
	display: block;
	font-size: 18px;
	padding-bottom: 15px;
	color: #d5d5d5;
}

.footer-item-link:hover {
	color: #bd0a4e;
}

/* twins */
.twin-container {
	display: flex;
}

.twin-item {
	flex: 1;
	position: relative;
	text-shadow: 2px 1px #292929;
	min-height: 500px;
}

.twin-item-bg {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
}

@-webkit-keyframes move-bg-1 {
	from {
		transform: translateX(-10%);
		-webkit-transform: translateX(-10%);
		
		opacity: 0.1;
	}
	
	to {
		transform: translateX(0);
		-webkit-transform: translateX(0);
		
		opacity: 1;
	}
}

@-webkit-keyframes move-bg-2 {
	from {
		transform: translateX(10%);
		-webkit-transform: translateX(10%);
		
		opacity: 0.1;
	}
	
	to {
		transform: translateX(0);
		-webkit-transform: translateX(0);
		
		opacity: 1;
	}
}

.twin-item[item-id="download"] {
	background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.9)), url(../images/1.jpg?v=55);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}

.twin-item[item-id="download"]:hover {
	background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.9)), url(../images/1.jpg?v=77);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}

.twin-item[item-id="buy"] {
	background: linear-gradient(rgba(102, 0, 51, 0.3), rgba(102, 0, 51, 0.8)), url(../images/1.jpg?v823);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}

.twin-item[item-id="buy"]:hover {
	background: linear-gradient(rgba(102, 0, 51, 0.6), rgba(102, 0, 51, 0.8)), url(../images/1.jpg?v=975);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}

/* pages */
.page-item {
	min-height: 20px;
}

/* menu */
.menu-icon {
	display: inline-block;
	width: 32px;
	line-height: 32px;
	vertical-align: middle;
}

.menu-icon:after, 
.menu-icon:before, 
.menu-icon div {
	display: block;
	background-color: #bd0a4e;
	content: '';
	height: 5px;
	
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	
	transition: all .2s ease-in-out;
}

.menu-icon:after {
	margin-top: 5px;
}

.menu-icon:before {
	margin-bottom: 5px;
}

.menu-icon[is-open="yes"]:before {
	transform: translateY(10px) rotate(135deg);
}

.menu-icon[is-open="yes"]:after {
	transform: translateY(-10px) rotate(-135deg);
}

.menu-icon[is-open="yes"] div {
	transform: scale(0);
}

/* download */
.download-btn {
	display: inline-block;
	background-color: #bd0a4e;
	color: #ffffff;
	font-family: 'Conv_bpg_arial';
	font-size: 20px;
	min-height: 24px;
	line-height: 24px;
	padding-top: 17px;
	padding-bottom: 17px;
	padding-left: 22px;
	padding-right: 22px;
	vertical-align: middle;
	text-align: center;
	cursor: pointer;
	
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

.download-btn:hover {
	background-color: #bd0a4e;
	box-shadow: 1px 1px 20px 0 rgba(135, 8, 33, 0.2);
}

/* responsive */
@media all and (min-width: 1024px) {
	.twin-item[item-id="download"] {
		animation-name: move-bg-1;
		animation-duration: 0.6s;
		animation-timing-function: linear;
		
		-webkit-animation-name: move-bg-1;
		-webkit-animation-duration: 1s;
		-webkit-animation-timing-function: linear;
	}
	
	.twin-item[item-id="buy"] {
		animation-name: move-bg-1;
		animation-duration: 0.6s;
		animation-timing-function: linear;
		
		-webkit-animation-name: move-bg-2;
		-webkit-animation-duration: 1s;
		-webkit-animation-timing-function: linear;
	}
}

@media all and (max-width: 1024px) {
	.header-items {
		position: fixed;
		left: 0px;
		top: 94px;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.7);
		text-align: left;
	}
	
	.header-items[is-mobile-hidden="yes"] {
		display: none;
	}
	
	.header-items .header-item {
		display: block;
	}
	
	.header-items .header-items-content {
		padding-bottom: 25px;
		background-color: #ffffff;
		
		-webkit-border-bottom-right-radius: 10px;
		-webkit-border-bottom-left-radius: 10px;
		-moz-border-radius-bottomright: 10px;
		-moz-border-radius-bottomleft: 10px;
		border-bottom-right-radius: 10px;
		border-bottom-left-radius: 10px;
	}
	
	.header-items .header-btn {
		display: block;
		width: calc(100% - 48px);
		margin-top: 16px;
		padding-top: 15px;
		padding-bottom: 15px;
		
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
		border-radius: 10px;
	}
	
	.header-items .header-btn span {
		display: none;
	}
	
	.header-items .header-btn:after {
		content: attr(item-big-title);
	}
	
	.header-menu {
		display: inline-block !important;
		width: 100%;
		height: 64px;
		line-height: 64px;
		text-align: center;
	}
	
	.twin-container {
		flex-direction: column;
		flex-wrap: wrap;
	}
	
	.twin-item {
		min-height: 0px;
		padding-top: 50px;
		padding-bottom: 50px;
		padding-left: 20px;
		padding-right: 20px;
	}
	
	.twin-item[item-id="download"] img[item-id="download-2"] {
		margin-left: 0px !important;
		margin-top: 10px;
	}
	
	.page-item[item-id="contact"] .page-container {
		display: block !important;
		max-width: 400px;
		padding-left: 20px;
		padding-right: 20px;
		margin-left: auto;
		margin-right: auto;
	}
	
	.page-item[item-id="contact"] .gmaps-embed {
		width: 100%;
	}
	
	.page-item[item-id="contact"] div[item-id="contact-map"] {
		margin-top: 40px;
	}
	
	.footer-container {
		padding-left: 20px;
		padding-right: 20px;
	}
	
	.footer-item {
		display: block;
		width: 100% !important;
		padding-left: 0px !important;
	}
	
	.footer-item[item-id="company-info"] {
		padding-bottom: 20px;
		border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	}
	
	.footer-item[item-id="links-1"] {
		padding-bottom: 20px;
		border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	}
	
	.footer-item[item-id="social-icons"] {
		text-align: center;
	}
}