/*
 *
 *  * EENDA
 *  * Marketing, Desarrollo & Consulting
 *  * www.eenda.com
 *  * © 2023
 *
 */

 :root{
    --blanco: rgba(255, 255, 255, 1);
    --celeste: rgba(0, 170, 215, 1);
    --celeste50: rgba(153, 212, 235, 1);
    --celeste25: rgba(205, 234, 245, 1);
    --naranja: rgba(220, 144, 2, 1);
    --amarillo: rgba(246, 214, 81, 1);
    --amarillo50: rgba(250, 235, 171, 1);
    --amarillo25: rgba(252, 245, 213, 1);
    --gray: rgba(61, 61, 61, 1);
    --gray50: rgba(64, 64, 64, 1);
    --gray25: rgba(191, 191, 191, 1);
    --gray05: rgba(242, 242, 242, 1);
    --black: rgba(0, 0, 0, 1);
  }

body{
    font-size: 16px;
    font-weight: 400;
    font-family: 'Open Sans', Helvetica, Arial, sans-serif;
    color: var(--gray);
}

h2{
    color: var(--black);
    font-size: 3rem;
}

h3{
    color: var(--gray);
}

h4{
    font-size: 1.5rem;
    margin-bottom: 1.5rem;
    font-weight: 400;
}

h6{
    padding-top: 0.5rem;
    font-size: .8rem;
    text-transform: uppercase;
    color: var(--gray50);
    text-align: center;
}

strong, b{
    font-weight: 600;
}

.dropdown.bootstrap-select{
	width:100% !important;
    display:block;
	background:rgba(255, 255, 255, 1);
	border:0;
	border-radius:0.375rem;
	transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.bootstrap-select button{
	width:100% !important;
	background:rgba(255, 255, 255, 1);
	border:1px solid #dee2e6;
	border-radius:0.375rem;
}

.bootstrap-select button[aria-expanded="true"]{
	border-color: #86b7fe;
	outline: 0;
	box-shadow: 0 0 0 0.25rem rgba(13,110,253,.25);
}

.bootstrap-select input[type="search"]{
	margin-bottom:.25rem;
	border-color: transparent !important;
	outline: 0 !important;
	box-shadow: none !important;
}

/* 
Logo Aguas Residuales
*/

img.logo{
    width: 195px;
}

/* 
Iconos Redes Sociales
*/

a.social-icon{
    display: inline-block;
    text-decoration: none;
    
}

a.social-icon img{
    width: 25px;
}

/*
Customizing AddToAny
*/

.sharing-title,
.sharing-text{
    display:inline-block;
    margin-right:1rem;
    font-weight:300;
    font-size:1rem;
    color:var(--celeste);
}

.sharing-text{
    margin-right:0;
    margin-left:1rem;
}

.a2a_flex_style a{
    padding:0 4px !important;
    text-decoration: none;
}

.a2a_flex_style a > i{
    font-size:1.5rem;
}

.a2a_button_facebook > i{
    color:rgba(66, 103, 178, 1);
}

.a2a_button_twitter > i{
    color:rgba(29, 161, 242, 1);
}

.a2a_button_linkedin > i{
    color:rgba(10, 102, 194, 1);
}

.a2a_button_pinterest > i{
    color:rgba(230, 0, 35, 1);
}

.a2a_button_whatsapp > i{
    color:rgba(37, 211, 102, 1);
}

/* 
Customs aspect-ratio
*/

.ratio-11x5{
    aspect-ratio: 36.8%;
}

/* 
Cards
*/

.card{
    border: 0;
}

.card-img,
.card-img-top{
    border-radius: 15px;
    box-shadow: 1px 1px 5px -1px rgba(0,0,0,0.5);
}

.card .card-header{
    background:none;
    border:0;
    border-radius:0;
    margin-bottom:.25rem;
    font-size:.75rem;
    color:rgba(0, 0, 0, .35);
    text-transform: uppercase;
}

.card .card-header a{
    color:rgba(0, 0, 0, .35);
    text-decoration: none;
}

.card .card-header a:hover{
    color:rgba(246, 214, 81, 1);
}

.card .card-header.categoria::before{
    content: "# ";
}

.card .card-body{
    margin-top: 0.5rem;
    padding: .5rem .5rem .5rem 0;
}

.card .card-body .card-text{
    color: var(--celeste);
    font-size: 1rem;
    font-weight: 300;
}

.card .fecha{
    border-right: 1px solid var(--celeste);
    padding-right: 1rem;
}

.card .visualizaciones{
    padding-left: 1rem;
}

.card .card-footer{
    background: none;
    border-top: 0;
    padding: 0 1rem 0 0;
}

.card .card-footer a{
    text-decoration: none;
}

.card .card-footer h3{
    font-size: 1.5rem;
    font-weight: 300;
}

.mini-card .card-body{
    padding: .5rem;
}

/* 
Botones
*/

.btn-outline-primary{
    color: var(--gray);
    border: 1px solid var(--gray);
    border-radius: 25px;
}

.btn-outline-primary:hover,
.btn-outline-primary:active{
    color: var(--blanco);
    border: 1px solid var(--gray50);
    background-color: var(--gray);
}

.btn-outline-primary i{
    padding-left: 1.5rem;
}

.btn-primary.phone{
    background: var(--celeste25);
    color: var(--gray);
    font-size: .8rem;
    border: 0;
    border-radius: 25px;
    padding-right: 1rem;
    padding-left: 1rem;
}

.btn-primary.phone:hover,
.btn-primary.phone:active{
    background: var(--celeste50);
}

.btn-primary.write{
    background: var(--amarillo50);
    color: var(--gray);
    font-size: .8rem;
    border: 0;
    border-radius: 25px;
    padding-right: 1rem;
    padding-left: 1rem;
}

.btn-primary.write:hover,
.btn-primary.write:active{
    background: var(--amarillo);
}

.btn-primary.phone > i,
.btn-primary.write > i{
    font-size: 1.2rem;
    color: var(--gray);
}

.btn-primary.phone span.phone-texto,
.btn-primary.write span.write-texto{
    padding-left: 0.5rem;

}

/* 
Ticker news
*/

#ticker{
    padding:.5rem 0;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    background-color:var(--celeste);
    color:rgba(255, 255, 255, 1);
}

#ticker p{
    margin-bottom:0;
    font-weight:600;
    color:rgba(255, 255, 255, 1);
}

#ticker a{
    color:rgba(255, 255, 255, 1);
    text-decoration: none;
}

.ticker-list{
    list-style: none;
    padding: 0;
    margin: 0;
}

.ticker-list li{
    display: inline-block;
    white-space: nowrap;
    margin-right: 2em;
    opacity: 0;
    transition: opacity 0.5s;
}

.ticker-list li.active{
    opacity: 1;
}

/* 
Header
*/

#header{
    background-color: var(--blanco);
}

/* 
Sección buscar
*/

#search-input{
    border-radius: 15px;
    border-color:var(--celeste50)!important;
    caret-color: var(--celeste);
}

#search-input:focus{
    box-shadow: 0 0 0 0.25rem var(--celeste25);
}

#search-input.form-control{
    padding: .5rem 3rem .5rem 1.5rem;
}

#search-input::placeholder{
    font-size: 1rem;
    font-weight: 300;
}

#buscar .icon{
    margin-left: -55px;
    z-index: 99;
}

#buscar .icon:active{
    border-color: transparent;
}

#buscar .icon i{
    font-size: 1.3rem;
    color: var(--gray);
    padding: .3rem;
}

/* 
Menú principal
*/
#menu-principal{
    border-bottom: 6px solid transparent;
    background: var(--blanco);
    border-image: linear-gradient(90deg, var(--celeste50) 40%, var(--amarillo50) 60%);
    border-image-slice: 1;
}

#menu-principal .dropdown-menu{
    margin-top: 6px;
    padding: 0.7rem;
    border: 0;
    background: var(--celeste);
    border-radius: 0;
}

#menu-principal .dropdown-menu .dropdown-item{
    color: var(--blanco);
}

#menu-principal .dropdown-menu .dropdown-item:hover{
    color: var(--gray);
}

#menu-principal a.nav-link{
    font-size: .9rem;
    font-weight: 500;
    text-transform: uppercase;
    color: var(--gray);
}

#menu-principal a.nav-link:hover,
#menu-principal a.nav-link:active,
#menu-principal a.nav-link:focus{
    background: var(--celeste);
    color: var(--blanco);
}

/* 
Directo en portada
*/

#directo{
    position: relative;
    padding:2rem 0;
    background-color:rgba(0, 0, 0, .065);
}

#directo span{
    display:inline-block;
    margin-bottom:1rem;
    padding:.25rem 1rem;
    background:rgba(0, 0, 0, .085);
    font-size:.75rem;
    text-transform: uppercase;
    border-radius:.75rem;
}

#directo h2{
    margin-bottom:1.25rem;
    font-size:2rem;
    text-align: center;
}

/* 
Menú offcanvas
*/

#navbar-toggle{
    position: fixed;
    float: right;
    bottom: 2rem;
    right: 2rem;
    z-index: 9999;
    width: 90px;
    height: 48px;
    background: var(--celeste);
    line-height: 2rem;
    color: rgba(255, 255, 255, 1);
    text-align: center;
    border-radius: 100px;
    text-transform: uppercase;
}

#navbar-toggle textarea:focus,
#navbar-toggle input[type]:focus,
#navbar-toggle button:active,
#navbar-toggle button:focus{
   border-color: inherit;
   box-shadow: none !important;
   outline: 0 none;
}

#offcanvasResponsive{
    background: var(--celeste);
    border-right: 0;
    padding: 0.7rem;
}

#offcanvasResponsive .offcanvas-header a{
    color: var(--blanco);
    font-size: 1.2rem;
}

#offcanvasResponsive .offcanvas-body .nav-fill .nav-link{
    color: var(--blanco);
    font-size: 1rem;
    text-align: left;
    text-transform: uppercase;
}

#offcanvasResponsive .offcanvas-body ul.dropdown-menu.show{
    background: var(--blanco);
    border-radius: 0;
    border: 0;
    padding: 0.7rem;
}

#offcanvasResponsive .offcanvas-body ul.dropdown-menu.show a.dropdown-item{
    color: var(--gray);
}

#offcanvasResponsive .offcanvas-body ul.dropdown-menu.show a.dropdown-item:active,
#offcanvasResponsive .offcanvas-body ul.dropdown-menu.show a.dropdown-item:hover{
    color: var(--gray);
    background: var(--celeste50);
}

/* 
Carousel patrocinadores
*/

#patrocinadores .bx-viewport{
    height: auto!important;
}

#patrocinadores .bx-wrapper{
    max-width: 1320px!important;
    border: 6px solid var(--blanco);
    box-shadow: none;
    margin: 0 2rem;
}

#patrocinadores .bx-wrapper .bx-controls-direction a{
    text-indent: 0;
    text-decoration: none;
    color: var(--gray25);
    font-size: 2rem;
    font-weight: 100;
    margin-top: -25px;

}

#patrocinadores .bx-wrapper .bx-controls-direction a.bx-prev{
    margin-left: 0;
    background: none;
    z-index: 99;
    
}

#patrocinadores .bx-wrapper .bx-controls-direction a.bx-prev::before{
    content: "\f137";
    font-family: "Font Awesome 5 Pro";
    display: inline-block;
    position: relative;
    right: 3rem;

}

#patrocinadores .bx-wrapper .bx-controls-direction a.bx-next{
    margin-left: 0;
    background: none;
    z-index: 99;
}

#patrocinadores .bx-wrapper .bx-controls-direction a.bx-next::after{
    content: "\f138";
    font-family: "Font Awesome 5 Pro";
    display: inline-block;
    position: relative;
    left: 3rem;
}

#patrocinadores .bx-wrapper .bx-pager{
    display: none;
}

/* 
Carousel novedades
*/

#carouselNovedades .carousel-control-prev,
#carouselNovedades .carousel-control-next{
    opacity: 1;
}

#carouselNovedades .carousel-control-prev i.fa-chevron-circle-left:before{
    content: "\f137";
    position: absolute;
    left: 0.5rem;
}

#carouselNovedades .carousel-control-next i.fa-chevron-circle-right:before{
    content: "\f138";
    position: absolute;
    right: 0.5rem;
}

#carouselNovedades .carousel-control-prev i,
#carouselNovedades .carousel-control-next i{
    color: var(--celeste);
    font-size: 2rem;
    font-weight: 100;
}

/* 
Aside Ofertas de trabajo
*/

#aside-trabajo .card{
    margin-bottom: .5rem;
}

#aside-trabajo .card .card-body .card-title{
    font-size: 1rem;
    text-decoration: none;
}

#aside-trabajo .card .card-body .card-text{
    font-size: .8rem;
}

/* 
Aside Suscripción a la nesletter
*/

#formulario{
    background: var(--gray05);
    padding: 1.5rem 1.2rem;
}

#formulario h3{
    font-size: 1.5rem;
    margin-bottom: 1.5rem;
    font-weight: 400;
}

#formulario a{
    text-decoration: none;
    color: var(--gray);
}

#formulario a:hover{
    text-decoration: underline;
    color: var(--gray);
}

#formulario input{
    border-radius: 25px;
}

#formulario .form-control:focus{
    box-shadow: 0 0 0 0.25rem var(--celeste25);
}

#formulario .form-floating input{
    border: 0;
}

#formulario .form-floating input.custom{
    caret-color: var(--celeste);
}

#formulario .form-floating label{
    font-size: 1rem;
}

#formulario .form-check input{
    border: 0.5px solid var(--gray);
}

#formulario .form-check input:checked{
    background-color: var(--celeste);
    border: 0.5px solid var(--celeste);

}

#formulario .form-check-input:focus{
    outline: 0;
    box-shadow: 0 0 0 0.25rem var(--celeste25);
}

/* 
Sección banner medium
*/

#page-content-banner-medium img{
    box-shadow: 1px 1px 5px -1px rgba(0,0,0,0.5);
}

/* 
Sección Contenido
*/

#page-content-contenido .card-img, 
#page-content-contenido .card-img-top{
    position: relative;
}

#page-content-contenido .card-tipo{
    display: flex;
    width: 100%;
    height: 100%;
    position: absolute;
    bottom: 0;
    background: linear-gradient(180deg, rgba(0,0,0,0) 65%, rgba(0,0,0,0.83) 100%);
    border-radius: 15px;
    align-items: flex-end;
    pointer-events: none;
}

#page-content-contenido .card-tipo .card-title{
    color: var(--blanco);
    text-transform: uppercase;
    font-size: 1rem;
    vertical-align: bottom;
    padding: 0 0 1rem 1.5rem;
    margin-bottom: 0;
}

/* 
Sección Escaparate de novedades
*/

#page-content-escaparate .card-img, 
#page-content-escaparate .card-img-top{
    position: relative;
}

#page-content-escaparate .margin-escaparate{
    margin-bottom: .8rem;
}

/* 
Sección Agenda
*/

#page-content-agenda{
    background: var(--gray05);
}

#page-content-agenda .card{
    background: none;
}

#page-content-agenda .card .fecha{
    border-right: 0;
}

/* 
Sección Exposición de Productos y Servicios
*/

#page-content-exposicion{
    padding-bottom: 3rem;
}

#page-content-exposicion .card{
    padding: .5rem;
    box-shadow:1px 1px 5px -1px rgba(0, 0, 0, .5);
    border:0;
}

#page-content-exposicion .card .card-img-top{
    border-radius: 0;
    box-shadow: none;
}

/* 
Footer
*/

footer{
    border-top: 6px solid transparent;
    background: var(--blanco);
    border-image: linear-gradient(90deg, var(--celeste50) 40%, var(--amarillo50) 60%);
    border-image-slice: 1;
}

footer a > img{
    width: 150px;
}

footer a{
    text-decoration: none;
    color: var(--gray);
}

#rgpd{
    font-size: .8rem;
}

#rgpd a{
    font-weight: 600;
}

#rgpd span{
    padding-right: 0.5rem;
    padding-left: 0.5rem;
}

#rgpd span::before{
    content: "|";
}

#rgpd p{
    margin-top: .5rem;
}

/*  
Botón Scroll to Top
*/

#btn-scroll-to-top{
    position: fixed;
    float: right;
    bottom: 2rem;
    right: 2rem;
    z-index: 1000;
    display: none;
    background: transparent;
    color: var(--celeste);
}

#btn-scroll-to-top .fa-angle-up:before{
    font-size: 3rem;
}

/*
Página de contenidos globales
*/

.page-content-globals h3{
    font-weight:300;
}

.page-content-globals a{
    color:var(--black);
}

.page-content-globals .image > figcaption{
    padding:.25rem .5rem;
    background:rgba(0, 0, 0, .05);
    font-size:.85rem;
    color:rgba(0, 0, 0, .5);
}

.page-content-globals .product > figcaption{
    padding:.5rem;
    background:rgba(0, 0, 0, .05);
    font-size:1.25rem;
    color:inherit;
    text-decoration: none;
}

.page-content-globals #empresa .card-header{
    padding:0;
}

.page-content-globals #empresa .card-image{
    padding:2rem 0;
    border-style:solid;
    border-width:1px;
    box-shadow:none;
    border-radius: 0;
    text-align:center;
}

.page-content-globals #empresa .card-image img{
    max-width:60%;
}

.page-content-globals #empresa .card-header h4{
    margin:.5rem 0;
    font-style: italic;
    text-transform: none;
}

.page-content-globals #empresa .card-header h4::before{
    content: "\f10d";
    margin-right:.5rem;
    font-weight:600;
    font-family:'Font Awesome 5 Pro';
}

.page-content-globals #empresa .card-type{
    padding: .5rem 1rem;
    font-weight:600;
    border-radius:0;
}

.page-content-globals #empresa .card-body,
.page-content-globals #empresa .card-contact{
    margin:0;
    padding:1rem;
    background:rgba(0, 0, 0, .075);
}

.page-content-globals #empresa .card-body h4{
    font-weight:600;
    font-size:1.15rem;
}

.page-content-globals #empresa .list-group-flush{
    margin:auto auto 2rem auto;
    max-width:80%;
    background:rgba(0, 0, 0, .075);
}

.page-content-globals #empresa .card-footer{
    padding:0;
    border-radius: 0;
}

.page-content-globals #empresa .card-footer .btn-group,
.page-content-globals #empresa .card-footer .btn-group > .btn{
    border-radius: 0;
}

.page-content-globals #empresa .card-footer .btn-group > .btn:first-child{
    margin-right:2px;
}