@import "../less/visual";
html {
	height: 100%;
}
body {
	min-height: 100%;
	background-size: cover;
	margin: 0;
	padding: 0;
}
* {
	box-sizing: border-box;
}

.vi-column1 {
	width: 100%;
}
.mp-table {
	width: 80%;

	th {
		width: 25%;
	}
	td {
		width: 75%;
	}
}
.m-page {
	.container {
		margin: 0 auto;
	}

	.panel-wrap {
		width: 520px;
		height: 320px;
		position: absolute;
		top: 40%;
		left: 50%;
		.panel {
			width: 520px;
			min-height: 320px;
			position: absolute;
			top: -50%;
			left: -50%;
			background: rgba(0,0,0,.3);
			padding: 20px;
			text-align: center;
		}
	}
	.logo {
		max-width: 150px;
		max-height: 100px;
		margin: 0 auto;
	}
	h1 {
		color: #ffffff;
		text-align: center;
	}
	.description {
		color: #ffffff;
		text-align: center;
	}
	.social {
		ul {
			margin: 0;
			padding: 0;
			padding-top: 20px;
		}
		a {
			text-decoration: none;
		}
		li {
			display: inline-block;
			margin: 0 10px;
			a {
				background-size: cover;
				display: inline-block;
				width: 35px;
				height: 35px;
				&.twitter {
					background-image: url(../img/twitter.png);
				}
				&.facebook {
					background-image: url(../img/facebook.png);
				}
				&.instagram {
					background-image: url(../img/instagram.png);
				}
			}

		}

	}
}
