/* * {outline: 1px solid #ef2809;} */

/*----------------------------------------------------------------------------------
	GENERAL
----------------------------------------------------------------------------------*/
:root {
    --brand-dark-blue: #1d2344;
    --brand-yellow: #f7a707;
    --brand-grey: #e8e8e8;
}

.txt-darkblue {color: var(--brand-dark-blue);}
.txt-yellow {color: var(--brand-yellow);}

.bg-darkblue {background-color: var(--brand-dark-blue);}
.bg-yellow {background-color: var(--brand-yellow);}
.bg-grey {background-color: var(--brand-grey);}

.barlow-regular {font-family: "Barlow", sans-serif; font-weight: 400; font-style: normal;}
.barlow-bold {font-family: "Barlow", sans-serif; font-weight: 700; font-style: normal;}
.barlow-extrabold {font-family: "Barlow", sans-serif; font-weight: 800;	font-style: normal;}

body {font-family: "Barlow", sans-serif !important;}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {font-family: "Barlow", sans-serif; font-weight: 700 !important; font-style: normal;}

p {font-size: 18px;}
ul.list {list-style: none; margin: 0; padding: 0 !important;}
ul.list li {font-size: 18px; margin-bottom: 8px;}
ul.list li::before {content: "\f054"; font-family: "Font Awesome 7 Free"; font-size: 14px; color: var(--brand-yellow); margin-right: 8px;}

.btn-blue {
	padding: 8px 16px;
	font-size: 16px;
	color: var(--brand-dark-blue);
	background-color: #ffffff;
	border: 1px solid var(--brand-dark-blue);
	text-decoration: none;
	transition: .2s ease-in-out all;
}
.btn-blue:hover {background-color: var(--brand-dark-blue); color: #ffffff;}

.btn-blue::before {
	content: "\f232";
	font-family: "Font Awesome 7 Brands";
	font-size: 18px;
	color: var(--brand-yellow);
	margin-right: 8px;
}


/*----------------------------------------------------------------------------------
	HEADER
----------------------------------------------------------------------------------*/
header {position: absolute; z-index: 1; width: 100%;}


/*----------------------------------------------------------------------------------
	CONTENT
----------------------------------------------------------------------------------*/


/* seccion principal --------------------------*/
.bg-main {
	height: 100vh;
	display: flex;
	align-items: center;
	background: url('../images/bg-main.webp') center no-repeat;
	background-size: cover;
}


/* seccion empresa --------------------------*/
.space-up {margin-top: -120px !important;}


/* seccion productos --------------------------*/
.modulo-txt-img {position: relative; overflow: hidden;}
.modulo-txt-img .wrapper-grid {position: relative; min-height: 35vw; display: flex; align-items: center;}
.modulo-txt-img .text {padding: 0 40px;}
.modulo-txt-img .media-img {position: absolute; width: 50%; height: 100%; top: 0; left: calc(0% + 0px); margin-top: 0;}
.modulo-txt-img .media-img img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
.modulo-txt-img .justify-content-start .media-img {left: 50%;}


/* seccion contactos --------------------------*/
#contactos i {font-size: 40px;}
.iconbox {background-color: #f2f4f7; width: 96px; height: 96px; text-align: center; line-height: 112px; border-radius: 99em; margin: auto;}
.map {height: 440px;}


/*----------------------------------------------------------------------------------
	FOOTER
----------------------------------------------------------------------------------*/
footer {background-color: var(--brand-dark-blue);}

.social-links {
	display: inline-block;
	margin-right: 2px;
	width: 40px;
	height: 40px;
	border: 1px solid rgba(255, 255, 255, 0.4);
	border-radius: 50%;
	text-align: center;
	line-height: 36px;
	transition: .2s ease-in-out all;
	color: #ffffff;
}
.social-links:hover {background-color: var(--brand-yellow); border-color: var(--brand-yellow);}

#footer-sign {clear: both; overflow: hidden; margin-top: 16px; padding: 8px 0 16px 0;}
#footer-sign > div {margin: auto; max-width: 128px; overflow: hidden;}
.left-sign {float: left; font-size: 14px; color: #ffffff; margin-top: 4px;}
.right-sign {float: right; width: 100px;}

#back-to-top {
    width: 52px;
    height: 52px;
    line-height: 50px;
    text-align: center;
    position: fixed;
    z-index: 1000;
    background-color: var(--brand-yellow);
    color: var(--brand-dark-blue);
    right: 32px;
    bottom: 32px;
    border-radius: 99em;
    box-shadow: 0 5px 10px 0 rgba(00,00,00,0.5);
    -webkit-box-shadow: 0 5px 10px 0 rgba(00,00,00,0.5);    
    display: none;
}

#back-to-top:hover {color: var(--brand-yellow); background-color: var(--brand-dark-blue);}


/*----------------------------------------------------------------------------------
	MEDIA QUERIES
----------------------------------------------------------------------------------*/
@media only screen and (max-width: 991px) {
	/* header */
	.mobile-nav {background-color: #ffffff; padding: 16px; margin-top: 8px; border-radius: 8px;}
	a.nav-link {color: #1d2344;}
	a.nav-link:hover, a.nav-link:visited {color: #999;}

	/* empresa */
	.space-up:first-child {margin-top: -120px !important;}
	.space-up {margin-top: 0 !important;}

	/* productos */
	.modulo-txt-img .media-img {position: relative; margin-bottom: 32px; width: 100vw; height: 60vw; overflow: hidden;}
	.modulo-txt-img .justify-content-start .media-img {left: 0;}
}