@font-face {
    font-family: 'dinregular';
    src: url('fonts/dinregular-webfont.eot');
    src: url('fonts/dinregular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/dinregular-webfont.woff2') format('woff2'),
         url('fonts/dinregular-webfont.woff') format('woff'),
         url('fonts/dinregular-webfont.ttf') format('truetype'),
         url('fonts/dinregular-webfont.svg#dinregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

*{
	box-sizing: border-box;
	font-family: 'dinregular', helvetica;
	margin:0;
}

body{
	overflow: hidden;
}

p,a{
	font-size:.9em;
	margin:5px 0;
	color:#333;
	text-decoration: none;
}

.info-container{
	width: 100%;
}

.logo-kanula{
	width: 100px;
	display:block;
	margin:auto;
	padding-top:70px;
	opacity:.9;
}

.contact-container{
	width: 45%;
	margin:20px auto;
	display:-webkit-box;
	display:-webkit-flex;
	display:-ms-flexbox;
	display:flex;
	-webkit-justify-content:space-around;
	    -ms-flex-pack:distribute;
	        justify-content:space-around;
	-webkit-box-align:center;
	-webkit-align-items:center;
	    -ms-flex-align:center;
	        align-items:center;
	-webkit-flex-wrap:wrap;
	    -ms-flex-wrap:wrap;
	        flex-wrap:wrap;
}

.contact-container *{
	margin:5px 10px 0px 10px;
}

.fb-logo{
	width:25px;
	height:25px;
}

.photo-container{
	width: 100%;
	height: 55vh;
	background: url(../img/bg.jpg) no-repeat center center fixed;
	background-size:contain;
}

.pantalla{
	width: 100%;
	height: 100%;
	background: white;
	opacity:.3;
}

@media (max-width: 800px) {

  .contact-container {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-webkit-flex-direction: column;
		    -ms-flex-direction: column;
		        flex-direction: column;
  }

  .logo-kanula{
		padding-top:40px;
		width: 80px;
	}

	.photo-container{
		width: 100%;
		background: url(../img/bg.jpg) no-repeat center center fixed;
		background-size:cover;
		-webkit-animation: mover 30s linear alternate infinite;
		        animation: mover 30s linear alternate infinite;
	}
}

@media (max-width: 480px) {

	.photo-container{
		-webkit-animation: mover 40s linear alternate infinite;
		        animation: mover 40s linear alternate infinite;
	}
}

@-webkit-keyframes mover{
	from{
		background-position: left center;
	}
	to{
		background-position: right center;
	}
}

@keyframes mover{
	from{
		background-position: left center;
	}
	to{
		background-position: right center;
	}
}



