@import url(https://fonts.googleapis.com/css?family=Titillium+Web:300,400,600);
body {
	font-family: Titillium Web, HelveticaNeue-Light, Helvetica Neue Light, Helvetica Neue, Helvetica, Arial, Lucida Grande, sans-serif
}

* {
	padding: 0;
	margin: 0
}

body,
html {
	height: 100%
}

@media only screen and (min-width:768px) {
	body,
	html {
		overflow: hidden
	}
}

.parallax {
	height: 100%
}

@media only screen and (min-width:768px) {
	.parallax {
		-webkit-transform-style: preserve-3d;
		transform-style: preserve-3d
	}
}

.foto {
	position: fixed;
	width: 100%;
	height: 100%;
	background-position: 50%;
	background-size: cover;
	-webkit-transition: all .5s ease;
	transition: all .5s ease
}

@media only screen and (min-width:768px) {
	.foto {
		width: 120%;
		height: 120%;
		margin-left: -10%;
		margin-top: -5%
	}
}

.wrapper {
	position: relative;
	height: 100%;
	-webkit-transition: all .5s ease;
	transition: all .5s ease;
	-webkit-transform: translateZ(70px);
	transform: translateZ(70px);
	background: rgba(0, 0, 0, .4)
}

.container {
	height: 100%;
	width: calc(100% - 20px);
	margin: 0 10px
}

@media only screen and (min-width:768px) {
	.container {
		width: 460px;
		margin: 0 auto;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center
	}
}

.content {
	width: 100%
}

.social,
.social a {
	text-align: center
}

.social a {
	width: 2.6rem;
	height: 2.6rem;
	line-height: 3rem;
	font-size: 1.6rem;
	margin: 15px 5px;
	display: inline-block;
	border-radius: 100%;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	-ms-border-radius: 100%;
	-o-border-radius: 100%;
	color: #fff;
	text-decoration: none;
	vertical-align: middle;
	-webkit-transition: all .2s ease-out;
	transition: all .2s ease-out;
	-webkit-box-shadow: 0 12px 20px rgba(0, 0, 0, .3);
	box-shadow: 0 12px 20px rgba(0, 0, 0, .3)
}

.social a.facebook {
	background: rgba(46, 50, 146, .8)
}

.social a.facebook:hover {
	background: #2e3292
}

.social a.youtube {
	background: rgba(190, 40, 45, .8)
}

.social a.youtube:hover {
	background: #be282d
}

.social a.instagram {
	background: rgba(220, 50, 120, .8)
}

.social a.instagram:hover {
	background: #dc3278
}


.brand {
	text-align: center;
	padding: 20px 0 15px
}

.brand img {
	width: 96px
}

.brand h1 {
	color: #fff;
	font-size: 2rem;
	text-shadow: 0 4px 20px rgba(0, 0, 0, .3)
}

.web a {
	display: block;
	width: 100%;
	margin: 0 0 10px;
	text-align: center;
	font-size: 1.3rem;
	color: #fff;
	text-decoration: none;
	text-transform: uppercase;
	padding: 12px 0;
	font-weight: 300;
	-webkit-box-shadow: 0 4px 20px rgba(0, 0, 0, .3);
	box-shadow: 0 4px 20px rgba(0, 0, 0, .3);
	-webkit-transition: all .15s ease-out;
	transition: all .15s ease-out
}

.web a.ist,
.web a.tur {
	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	-ms-border-radius: 15px;
	-o-border-radius: 15px
}

@media only screen and (min-width:768px) {
	.web a {
		width: calc(50% - 12px);
		float: left;
		margin: 0 6px
	}
}

.web:after,
.web:before {
	content: " ";
	display: table
}

.web:after {
	clear: both
}

.tooltip {
	position: relative
}

.tooltip span.tt-container {
	display: none
}

.tooltip:hover span.tt-container {
	display: block;
	z-index: 1;
	position: absolute;
	top: 3em;
	background: hsla(0, 0%, 100%, .9);
	padding: 15px;
	width: calc(100% + 10px);
	margin-left: -20px;
	-webkit-box-shadow: 0 8px 25px rgba(0, 0, 0, .4);
	box-shadow: 0 8px 25px rgba(0, 0, 0, .4)
}

.tooltip .tt-text {
	color: #333;
	text-transform: none;
	font-size: 1rem;
	display: block;
	line-height: 1.4
}

.tooltip .tt-arrow {
	display: block;
	width: 0;
	height: 0;
	border-left: 16px solid transparent;
	border-right: 16px solid transparent;
	border-bottom: 10px solid hsla(0, 0%, 100%, .9);
	position: absolute;
	top: -10px;
	left: calc(50% - 16px)
}