@charset "UTF-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,700&display=swap');
@import url('https://fonts.googleapis.com/css?family=Maven+Pro:700&display=swap');

/************
GENERAL
************/

body {
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	color: #eee;
	background-color: #333;
	
}
h1, h2, h3 {
	font-weight: 700
}
h1 {
	font-size: 3rem
}
h2 {
	font-size: 2rem;
	margin-bottom: 2rem
}
h3 {
	font-size: 1.6rem	
}
h4 {
	font-size: 1rem;
    letter-spacing: 2px;
}
p {
	font-size: .9rem
}
a {
	color: #fff;
	transition: all .3s ease-out;
	text-decoration: none
}
a:hover, a:focus {
	color: #fff;
	text-decoration: none;
}
main p, main span {
	font-size: 1.2rem
}
@media (min-width: 768px) {
	h1 {
		font-size: 4rem
	}
	h2 {
		font-size: 3rem;
		margin-bottom: 2rem
	}
	p {
		font-size: 1rem
	}
}

/************
ASSETS
************/

.btn-mas {
	color: #000;
	background-color: #fff;
	display: inline-block;
	padding: .6rem 1.5rem;
	text-transform: uppercase;
	font-size: .8rem;
	letter-spacing: .1rem;
	border: 2px solid #fff;
	font-weight: 400
}
.btn-mas:hover,
.btn-mas:focus,
.btn-mas:active {
	color: #fff;
	text-decoration: none;
	background: #000;
}


/************
HEADER
************/

.bl-header {
	padding: 5rem 0;
	background: transparent url('../images/fd-header.jpg') no-repeat center center;
	background-size: cover
}

/************
OBRAS
************/

.bl-galeria a {
	display: block;
    overflow: hidden;
    height: auto;
    width: 100%;
}
.co-obra {
	position: relative;
    text-align: center;
    width: 100%;
    display: block;
	overflow: hidden
}

.co-obra-overlay {
	position: relative;
	left: 0;
	top: 0;
	width: 100%;
	padding: 1rem;
	box-sizing: border-box;
	height: 100%;
	background: rgba(0,0,0,.7);
	transition: all .3s ease-out;
	opacity: 1;
	z-index: 1;
}
.co-obra:hover .co-obra-overlay {
	opacity: 1
}

.co-obra-overlay--text {
	width: 100%;
	
}
.co-obra-overlay--text p {
	font-size: .8rem !important;
	margin-bottom: 0
}
.co-obra-overlay--text .el-obra-titulo {
	font-size: 1rem !important;
	font-weight: bold;
}
@media (min-width: 768px) {
	
	.co-obra-overlay--text .el-obra-titulo {
		font-size: 1rem !important
	}
}
@media (min-width: 992px) {
	.co-obra-overlay {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		padding: 1rem;
		box-sizing: border-box;
		height: 100%;
		background: rgba(0,0,0,.7);
		transition: all .3s ease-out;
		opacity: 0;
		z-index: 1;
	}
}
/************
FOOTER
************/

.bl-footer {
	clear: both;
	display: block;
	padding: 4rem 0 5rem;
	background: transparent url('../images/fd-footer.jpg') no-repeat center center;
	background-size: cover
}

.js div#preloader {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 999;
  width: 100%;
  height: 100%;
  overflow: visible;
  background: #333 url('http://files.mimoymima.com/images/loading.gif') no-repeat center center;
}


/************
MODAL
************/

.modal-body {
    color: #333;
}
.modal-title {
	color: #333;
}
.modal-content {
	border-radius: 0;
}
.modal-dialog {
    max-width: 940px !important;
	width: 80% !important;
    margin: 1.75rem auto;
}
.btn {
	border-radius: 0;
}
.modal-body h2 { 
	font-size: 2.5rem;
    margin-bottom: 0;
}
.modal-body h3 { 
	margin-bottom: 2rem
	
}