/* Contributors Feed CSS
//--------------------------------------------------------------------- */

/* Header sencillo buscador
---------------------------------------------------------------- */
header.header-sencillo-buscador {
	padding-top: 80px;
	background: var(--color-clear);
}

header.header-sencillo-buscador div.pod {
	display: grid;
	grid-template-columns: 1fr 300px;
	grid-gap: 30px;
}

header.header-sencillo-buscador h1 {
	font-family: var(--font-family-secundaria);
	color: var(--color-teal);
	text-align: left;
	font-weight: 500;
	margin-bottom: 5px;
}

header.header-sencillo-buscador div.pod div.txt div.rte {
	font-family: var(--font-family-secundaria);
	text-align: left;
	font-weight: 500;
	max-width: 800px;
}

header.header-sencillo-buscador div.pod div.buscador div.input { 
	position: relative;
	border: 1px solid var(--color-gris-azulado-claro);
}

header.header-sencillo-buscador div.pod div.buscador input[type=text] {
	display: block;
	width: 100%;
	border: none;
	background: var(--color-clear-2);
	padding: 15px;
	height: 45px;
}

header.header-sencillo-buscador div.pod div.buscador button {
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	border: none;
	padding: 15px;
	font-family: var(--font-family-secundaria);
	font-weight: 500;
	background: var(--color-teal);
	color: var(--color-blanco);
	cursor: pointer;
	height: 45px;
}

header.header-sencillo-buscador div.pod div.buscador button:hover { background: var(--color-dark-blue-2); }
header.header-sencillo-buscador div.pod div.buscador { text-align: center; }

@media (max-width: 1199px) { header.header-sencillo-buscador div.pod { grid-template-columns: 1fr 250px; grid-gap: 15px; } }

@media (max-width: 767px) {
	header.header-sencillo-buscador { padding-top: 60px; }
	header.header-sencillo-buscador div.pod { grid-template-columns: 1fr; grid-gap: 15px; }
}

/* Custom Compendium Drop down
---------------------------------------------------------------- */
div.custom-dropdown {
	position: relative;
	margin-top: 15px;
}

div.custom-dropdown span.label {
	border: 1px solid var(--color-gris-azulado-claro);
    background: var(--color-blanco);
    display: block;
    padding: 10px 15px;
    color: var(--color-gris-azulado);
    border-radius: 50px;
    position: relative;
    letter-spacing: 1px;
	text-align: center;
	cursor: pointer;
}

div.custom-dropdown span.label i {
	display: inline-block;
	transform: rotate(90deg);
	font-size: 11px;
}

div.custom-dropdown span.label:hover {
	background: var(--gradient-main);
	color: var(--color-blanco);
}

div.custom-dropdown:hover span.label { border-radius: 18px 18px 0 0; }

div.custom-dropdown span.label ul {
	display: none;
	width: 100%;
	background: var(--color-blanco);
	position: absolute;
	top: 100%;
	left: 0;
	text-align: left;
	border: 1px solid var(--color-gris-azulado-claro);
	border-radius: 0 0 18px 18px;
	overflow: hidden;
	z-index: 50;
}

div.custom-dropdown span.label:hover ul { display: block; z-index: 100; }
div.custom-dropdown span.label ul li { padding: 0 10px; }
div.custom-dropdown span.label ul li:hover { background: var(--color-clear); }

div.custom-dropdown span.label ul li a {
	display: block;
	border-bottom: 1px solid var(--color-gris-azulado-claro);
	color: var(--color-gris-azulado);
	padding: 10px 0;
}

div.custom-dropdown span.label ul li:last-child a { border: none; }

/* Feed autores
---------------------------------------------------------------- */
div.feed-autores div.pod {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	grid-gap: 30px;
}

div.feed-autores div.pod div.item-x {
	border: 1px solid var(--color-gris-azulado-claro);
	overflow: hidden;
	position: relative;
}

div.feed-autores div.pod div.item-x div.img {
	position: relative;
	padding-top: 20px;
}

div.feed-autores div.pod div.item-x div.img::before {
	content: '';
	display: block;
	width: 100%;
	height: 95px;
	background: var(--color-clear);
	position: absolute;
	top: 0;
	left: 0;
	transition: height .3s ease;
}

div.feed-autores div.pod div.item-x:hover div.img::before { height: 600px; }

div.feed-autores div.pod div.item-x div.img-inner {
	width: 150px;
	height: 150px;
	position: relative;
	margin: 0 auto;
	border-radius: 50%;
	overflow: hidden;
}

div.feed-autores div.pod div.item-x div.img-inner img { transition: all .3s ease; }
div.feed-autores div.pod div.item-x:hover div.img-inner img { transform: scale(1.1); }

div.feed-autores div.pod div.item-x div.txt {
	padding: 20px 20px 50px 20px;
	position: relative;
}

div.feed-autores div.pod div.item-x div.txt .name {
	font-family: var(--font-family-secundaria);
	color: var(--color-principal);
	font-weight: 500;
	margin-bottom: 5px;
}

div.feed-autores div.pod div.item-x div.txt .name a { color: var(--color-principal); }
div.feed-autores div.pod div.item-x:hover div.txt .name a { color: var(--color-blue); }

div.feed-autores div.pod div.item-x div.txt span.subtitle {
	font-family: var(--font-family-secundaria);
	color: var(--color-teal);
	font-weight: 500;
    display: block;
}

div.feed-autores div.pod div.item-x div.txt div.rte {
	margin-top: 15px;
	color: var(--color-gris-azulado);
}

div.feed-autores div.pod div.item-x div.txt div.botones { margin-top: 20px; }

div.feed-autores div.pod div.item-x div.txt div.botones a {
	display: inline-block;
	font-size: 12px;
	padding: 5px 10px;
	border-radius: 50px;
	border: 1px solid var(--color-gris-azulado-claro);
	color: var(--color-gris-azulado);
	background: var(--color-blanco);
}

div.feed-autores div.pod div.item-x div.txt div.botones a:hover {
	background: var(--gradient-main);
	color: var(--color-blanco);
}

div.feed-autores div.pod div.item-x hr {
	height: 20px;
	position: absolute;
	bottom: 0;
	left: 20px;
	width: calc(100% - 40px);
	background: var(--gradient-main);
	margin: 0;
}

div.feed-autores div.pod div.item-x div.txt ul.social-media { margin-top: 5px; }
div.feed-autores div.pod div.item-x div.txt ul.social-media li { margin: 5px 5px 5px 0; }

div.feed-autores div.pod div.item-x div.txt ul.social-media li a {
	font-size: 12px;
	background: var(--color-teal);
	color: var(--color-blanco);
	width: 20px;
	height: 20px;
	display: block;
	border-radius: 3px;
	line-height: 20px;
	text-align: center;
	transition: all .3s ease;
}

div.feed-autores div.pod div.item-x div.txt ul.social-media li a:hover { background: var(--color-dark-blue); }

@media (max-width: 991px) { div.feed-autores div.pod { grid-template-columns: 1fr 1fr; } }
@media (max-width: 575px) { div.feed-autores div.pod { grid-template-columns: 1fr; } }
@media (min-width: 2500px) { div.feed-autores div.pod { grid-template-columns: 1fr 1fr 1fr 1fr 1fr; } }