/* Estilos Principales 
-------------------------------------------------------------------------------------------------------------------------------------------- */
:root {
	--main-color: #789a2a;
	--second-color: #0b9991;
	--third-color: #6c757d;
	--fourth-color: #9b9ba1;
}

html { overflow-x: hidden!important; }

body { overflow-x: hidden; }

a { 
	transition-duration: 0.5s;
	-moz-transition-duration: 0.5s;
	-o-transition-duration: 0.5s;
	-webkit-transition-duration: 0.5s;
	-ms-transition-duration: 0.5s;
	text-decoration: none;
	color: var(--main-color);
}

	a:hover { color: var(--second-color); }

h1, h2, h3, h4, h5, h6 { color: var(--third-color); }

p, li { color: var(--third-color); }

/*Background 
-------------------------------------------------------------------------------------------------------------------------------------------- */
.bg-1 { background: var(--main-color)!important; }

.bg-2 { background: var(--second-color)!important; }

.bg-3 { background: var(--third-color)!important; }

/*Font-Colors
-------------------------------------------------------------------------------------------------------------------------------------------- */
.text-color-1 { color: var(--main-color); }

.text-color-2 { color: var(--second-color); }

.text-color-3 { color: var(--third-color)!important; }

/*Font-Weight 
-------------------------------------------------------------------------------------------------------------------------------------------- */
.fw-300 { font-weight: 300!important; }

.fw-400 { font-weight: 400!important; }

.fw-500 { font-weight: 500!important; }

.fw-600 { font-weight: 600!important; }

.fw-700 { font-weight: 700!important; }

.fw-800 { font-weight: 800!important; }

.fw-900 { font-weight: 900!important; }

/*Font-Italic 
-------------------------------------------------------------------------------------------------------------------------------------------- */
.f-italic { font-style: italic!important; }

.text-justify { text-align: justify!important; }

#error-404 h2 { font-size: 4.5rem; }
#error-404 a { max-width: 200px; width: 100%; }

/*Buttons
-------------------------------------------------------------------------------------------------------------------------------------------- */
.btn {
	border-radius: 1rem;
	transition: .5s ease-out!important;
	padding-left: 2rem;
	padding-right: 2rem;
}

.btn-1 {
	background: var(--main-color);
	color: #fff;
	font-weight: 600;
	border: 1px solid var(--main-color);
}

.btn-1:hover {
	background: transparent;
	border: 1px solid var(--main-color);
	color: var(--main-color);
}

.btn-1-outline {
	background: transparent;
	color: var(--main-color);
	font-weight: 600;
	border: 1px solid var(--main-color);
}

.btn-1-outline:hover {
	background: var(--main-color)!important;
	border: 1px solid var(--main-color);
	color: #fff;
}

.btn-1-outline-white {
	background: transparent;
	color: #fff;
	font-weight: 600;
	border: 1px solid #fff;
}

.btn-1-outline-white:hover {
	background: var(--main-color)!important;
	border: 1px solid var(--main-color);
	color: #fff;
}

#btn-top {
	position: fixed;
	bottom: .8rem;
	right: .8rem;
	padding: .5rem .7rem .5rem .7rem;
	color: #fff;
	background: var(--main-color);
	border-radius: .8rem;
	cursor: pointer;
	z-index: 9000;
}

#btn-top:hover {
	background: #5f7c1b;
	color: #fff;
}

.content-btn-contact {
	position: fixed;
	bottom: 20px;
	left: 10px;
	z-index: 9000;
}

.btn-whatsapp {
	background: #2BB741;
	color: #fff;
	font-size: 1.1rem;
}

.btn-whatsapp:hover {
	color: #fff;
	transform: translateY(-.8rem);
}

.wrapp-title { 
	margin-bottom: 1.5rem;
	line-height: .8rem;
}

.wrapp-title p {
	font-weight: 600;
	color: var(--main-color);
	margin: 0;
	font-size: 1.2rem;
}

.wrapp-title h2 {
	font-size: 3rem;
	font-weight: 700;
}

.glide__arrow {
	color: #fff;
	background: var(--main-color);
	font-size: 1rem;
	border-radius: 50%;
    display: inline-block;
    margin: auto 5px;
	height: 34px;
    width: 34px;
    text-align: center;
	border: none;
}

.glide__arrow:hover {
	opacity: .8;
	color: #fff!important;
}

.glide__arrow.prev {
	left: -45px;
}

.glide__arrow.next {
	right: -45px;
}

.glide img {
	border-radius: 1rem;
	box-shadow: 0 .125rem .25rem rgba(0,0,0,.075)!important;
	border: 1px solid #dddde3;
}

.content {
	position: relative;
	width: 90%;
	max-width: 400px;
	margin: auto;
	overflow: hidden;
}

.content .content-overlay {
	background: linear-gradient(135deg, #b3e63ce2 0%, #789a2ab7 100%);
	border-radius: 1rem;
	position: absolute;
	height: 99%;
	width: 100%;
	left: 0;
	top: 0;
	bottom: 0;
	right: 0;
	opacity: 0;
	-webkit-transition: all 0.4s ease-in-out 0s;
	-moz-transition: all 0.4s ease-in-out 0s;
	transition: all 0.4s ease-in-out 0s;
}

.content:hover .content-overlay{
	opacity: 1;
}

.content-details {
	position: absolute;
	text-align: center;
	padding-left: 1em;
	padding-right: 1em;
	width: 100%;
	top: 50%;
	left: 50%;
	opacity: 0;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	-webkit-transition: all 0.3s ease-in-out 0s;
	-moz-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
}

.content-details h3 {
	color: #fff;
	font-weight: 600;
	margin-bottom: .2rem;
}

.content-details p {
	color: #fff;
}
  
.content:hover .content-details{
	top: 50%;
	left: 50%;
	opacity: 1;
}

.fadeIn-top{
	top: 20%;
}


/*Navbar
-------------------------------------------------------------------------------------------------------------------------------------------- */
#main-menu .nav-item {
	padding-left: .8rem;
	padding-right: .8rem;
}

#main-menu .nav-item .nav-link {
	color: #fff;
	font-size: 1.1rem;
	font-weight: 500;
	transition: 0.5s ease;
}

#img-logo-nav {
	width: 280px;
	height: auto;
}

#main-menu.navbar-fixed {
	background: #fff;
	box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;
}

#main-menu.navbar-fixed .nav-item .nav-link {
	color: var(--third-color);
}

#main-menu .nav-item .nav-link:hover {
	color: var(--second-color);
}


footer {
	background: #F4F8FB;
}

.list-effect li .text {
	transition: 0.5s ease;
}

.list-effect li:hover .text {
	padding-left: 1rem;
}

.wrapp-social .icon {
	color: var(--fourth-color);
	font-size: 1rem;
	border-radius: 50%;
    display: inline-block;
    line-height: 32px;
    margin: auto 5px;
	height: 34px;
    width: 34px;
    text-align: center;
	border: 1px solid var(--fourth-color);
}

.wrapp-social .icon:hover {
	background: var(--main-color);
	color: #fff;
	border: 1px solid var(--main-color);
}

@media( max-width: 600px ) {
	.glide__arrow.prev {
		left: -15px;
	}
	
	.glide__arrow.next {
		right: -15px;
	}
}