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

}

html, body { font-family: 'latin_modern_mono_caps10Rg'; background-color: #fff; height: 100%;  }

a { outline: 0; }

/* Utils */
.item-page { margin-top: 200px; margin-bottom: 100px; }
.fs-1 { font-size: 1em; }
.fs-12 { font-size: 1.2em; }
.fs-15 { font-size: 1.5em; }
.fs-07 { font-size: 0.7em; }
.border-dashed { border: 1px dashed #000; }
.border-right { border-right: 1px solid #fff; }
.red { color: red; }
.mh-100vh { min-height: 100vh; }
.texte { width: 100%; }
.clickable { cursor: pointer; }
.first { margin-top: 120px; }

.hero {
	font-family: 'latin_modern_mono_caps10Rg';
	color: #000;
}

footer ul {
    list-style: none;
    text-align: center;
    padding: 0;
}

div.vertical-line{
  width: 1px; /* Line width */
  background-color: black; /* Line color */
  height: 200px; /* Override in-line if you want specific height. */
  margin: 50px 0;
}

.grow { transition: all .2s ease-in-out; }
.grow:hover { transform: scale(1.1); }

.btn-black {
	background-color: #1d1d1d;
	color: #fff;
	padding: 10px;
	width: 50%;
	text-align: center;
	margin: 0 auto 20px auto;
}
.btn-line { 
	color: #1d1d1d;
	background-color: #fff;
	border: 1px solid #1d1d1d;
	padding: 10px 20px;
	margin-bottom: 50px;
}
.btn-line:hover, .btn-line-ready {
	color: #fff;
	background-color: #1d1d1d;
	text-decoration: none;
}

/* Projects */
#projectes, #contacte { margin-top: 120px; }
#gallery a { text-decoration: none; }
.filter { 
	width: 80%;
	margin: 0 auto;
}
.box a { 
	border: 1px solid #1d1d1d;
	padding: 10px;
	display: block;
	text-align: center;
}
.box a:hover, .box a.current {
	background: #000;
	color: #fff;
}

@media only screen and (max-width: 736px) {
	.topmenu { background-color: transparent; }
	#carta .vertical-line { display: none; }
}

/* Landscape ipad footer */
@media only screen 
and (min-width : 990px) 
and (max-width : 1200px) {
	.footer_logo { min-width: 250% !important; } 
}
