/* ==========================================================================
FORMAT
========================================================================== */
/*
* === FUENTES ===
*
	font-family: 'Montserrat', sans-serif;
	font-family: 'Open Sans', sans-serif;
*/

/*
* === COLORES ===
*/

/* Definir variables para el elemento raiz */
:root {
	/* Fuentes */
	--font-family-montserrat: 'Montserrat', sans-serif;
	/*--font-family-open-sans: 'Open Sans', sans-serif;*/
        --font-family-open-sans: 'Montserrat', sans-serif;
	/* titulos y textos */
	--text-color-gray: #757575;
	--text-color-black: #243039;
	--text-detail-red: #ba3362;
	--title-color-black: #243039;
	--title-color-white: #fff;
	--title-detail-red: #ba3362;
	--subtitle-color-white: #fff;
	--cover-title-color: #fff;
	/* links */
	--link-red: #ba3362;
	--link-red-bg: #fff;
	--link-white: #fff;
	--link-icon-color: #757575;
	/* fondos */
	--bg-black: #243039;
	--bg-light-gray: #f9f9f9;
	--bg-white: #fff;
	/* botones */
	--btn-turquoise-bg: #007f84;
        --btn-turquoise-bg-hover: #00a2a8;
        --btn-red-bg: #ba3362;
	--btn-red-text: #fff;
	--btn-red-bg-hover: #db3770;
	--btn-red-text-hover: #fff;
	--btn-red-icon-bg: #b32d5b;
	--btn-red-icon-text: #fff;
	--btn-red-icon-bg-hover: #db3770;
	--btn-red-icon-text-hover: #fff;
	/* wrappers */
	--wrapper-size: 4.375rem;
}

/*
* === GENERAL ===
*/

/* Html/Body Tags */
body
{
	font-family: var(--font-family-open-sans);
	font-weight: 400;
	font-size: 1rem;
	color: var(--text-color-gray);
}

/* Utility Resets */
.lead
{
	font-size: 1.875rem;
}

.lead-small
{
	font-size: 1.125rem;
}

strong, b
{
	font-weight: 700;
}

/* Titles */
.title
{
	font-family: var(--font-family-montserrat);
	font-size: 2.5rem;
	font-weight: 700;
	position: relative;
	margin-bottom: 0;
	color: var(--title-color-black);
	text-align: center;
	padding-bottom: 2.5rem;
        text-transform: uppercase;
}

.title::after
{
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 170px;
	height: 1px;
	background-color: var(--title-detail-red)
}

.title > .regular
{
	display: block;
	font-weight: 400;
}

.title-single
{       
        text-transform: uppercase;
	font-family: var(--font-family-montserrat);
	font-size: 2.5rem;
	font-weight: 700;
	position: relative;
	margin-bottom: 0;
	color: var(--title-color-black);
}

.title.white,
.title-single.white
{
	color: var(--title-color-white);
}

.title.space,
.title-single.space
{
	margin-bottom: 3rem;
}

.title.thin-space
{
	margin-bottom: 2.5rem;
}

.subtitle
{
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--subtitle-color-white);
}

.subtitle.space
{
	margin-bottom: 1.85rem;
}

/* Selection */
::selection
{
	background: #111416 ;
	color: #ffffff;
}

::-webkit-selection
{
	background: #111416 ;
	color: #ffffff;
}

::-moz-selection
{
	background: #111416 ;
	color: #ffffff;
}

/* Wrappers */
.wrapper
{
	padding-top: var(--wrapper-size);
	padding-bottom: var(--wrapper-size);
}

.wrapper-top
{
	padding-top: var(--wrapper-size);
}

.wrapper-bottom
{
	margin-bottom: var(--wrapper-size);
}

/* Brackgrounds */
.bg-light-gray
{
    background: var(--bg-light-gray);
}

.bg-hands-on
{
	background-image: url('../img/banner-bg.jpg');
}

.bg-brand
{
	background-image: url('../img/mensaje.jpg');
}

.bg-adn
{
	background-image: url('../img/adn-bg.jpg');
}

.bg-stamp
{
	background-image: url('../img/somos-banner-bg.jpg');
}

.bg-desk
{
	background-image: url('../img/bienvenida-bg.jpg');
}

.bg-tree
{
	background-image: url('../img/banner-inversion.jpg');
}

/* Buttons */
.button-rounded
{
	border-radius: 2rem;
	padding: 1rem 2rem;
	text-align: center;
}

.button-rounded.red 
{
	background-color: var(--btn-turquoise-bg);
	color: var(--btn-red-text);
	transition: all .3s ease-in-out;
}

.button-rounded.red:hover,
.button-rounded.red:focus,
.button-rounded.red:active
{
	background-color: var(--btn-turquoise-bg-hover);
	color: var(--btn-red-text-hover);
}


.button-rounded-w-icon
{
	border-radius: 2rem;
	padding: .5rem 1rem .5rem 3rem;
	text-align: center;
}


.button-rounded-w-icon.red 
{
	position: relative;
	background-color: var(--btn-turquoise-bg);
	color: var(--btn-red-text);
	transition: all .3s ease-in-out;
}

.button-rounded-w-icon.red:hover,
.button-rounded-w-icon.red:focus,
.button-rounded-w-icon.red:active
{
	background-color: var(--btn-red-turquoise-hover);
	color: var(--btn-red-text-hover);
}

.button-rounded-w-icon span
{
	position: absolute;
	left: 0;
	top: 0;
	background-color: var(--btn-turquoise-bg);
	color: var(--btn-red-icon-text);
	border-radius: 2rem;
	padding: .425rem .625rem;
	text-align: center;
	transition: all .3s ease-in-out;
}

.button-rounded-w-icon.red:hover span,
.button-rounded-w-icon.red:focus span,
.button-rounded-w-icon.red:active span
{
	background-color: var(--btn-red-turquoise-hover);
	color: var(--btn-red-icon-text-hover);
}

/* Links */
.link
{
	font-family: var(--font-family-montserrat);
}

.link > .fas
{
	color: var(--link-icon-color);
	margin-right: 0.25rem;
}

.link.red
{
	color: var(--link-red);
	background: var(--link-red-bg);
    border: 0;
}

.link.red:hover,
.link.red:focus,
.link.red:active
{
	color: var(--link-red);
}

.link.white
{
	color: var(--link-white);
}

.link.white:hover,
.link.white:focus,
.link.white:active
{
	color: var(--link-white);
}

/* Google Maps */
.map-contact
{
	width: 100%;
	height: 550px;
}

/* Form */
.input
{
	--input-focus-borders: 4px solid #ba3362;
}

.input
{
	margin: 0;
	width: 100%;
	max-width: 100%;
}

.input__label
{
	font-weight: 400;
	font-size: 0.8125rem;
}

.input__field 
{
	font-weight: 400;
}

.input__field--hoshi
{
    padding: 0.85em 0.15em 1em 0.15em;
}

.input__label--hoshi::after 
{
    border-bottom: var(--input-focus-borders);
}

.input--hoshi.has-error .input__label
{
	color: red;
}

/* selects */
div.cs-skin-underline 
{
	font-size: 0.8125rem;
	max-width: 100%;
	color: #fff;
}

.cs-skin-underline > span 
{
	padding: 0.5em 3em 0.8em 0.5em;
	font-weight: 400;
	border-bottom: 3px solid #fff;
}

.cs-skin-underline ul span::before 
{
	background-color: #fff;
}

.cs-skin-underline .cs-options 
{
	background: #ba3362;
}

/* red */
div.cs-skin-underline.red 
{
	color: #6e7c7c;
}

.cs-skin-underline.red > span 
{
	border-bottom: 3px solid #ba3362;
}

.cs-skin-underline.red ul span::before 
{
	background-color: #ba3362;
}

.cs-skin-underline.red .cs-options 
{
	background: #fff;
}

/* select has-error */
div.cs-skin-underline.has-error 
{
	color: red;
}

/* Description List */
.list-date > dt
{
	font-size: 1.5rem;
}

.list-date > dt + dd
{
	margin-bottom: 2rem;
}

.list-date > dt > .fa-caret-right, .fa-caret-right
{
	color: var(--text-detail-red);
	margin: 0.25rem;
}

/* List Unordered */
.list-unordered
{
	margin: 2rem 0;
}

.list-unordered > li:not(:last-child)
{
	margin-bottom: 1rem;
}
/* ==========================================================================
COMPONENTES
========================================================================== */
/*
* === TEMPLATE ===
*/
/* Variables */
header
{
	--header-bg-gray: #f9f9f9;
	--header-bg-navbar: #fff;
	--header-nav-links-color: #757575;
	--header-nav-links-color-hover: #7d274d;
	--header-nav-button-text-color: #fff;
	--header-detail-red-color: #7d274d;
}

/* clases */
.navbar-gray
{
	background-color: var(--header-bg-gray);
	color: var(--header-nav-links-color);
}

.navbar-gray .language-selector li a
{
	font-size: .875rem;
	font-weight: 700;
        text-transform: uppercase;
}

.navbar-gray .social-links::before
{
	content: "|";
	margin-right: .5rem;
	font-size: .875rem;
	vertical-align: top;
}

.navbar-gray .list-inline > .list-inline-item a
{
	color: var(--header-nav-links-color);
}

.navbar-gray .list-inline > .list-inline-item:hover a,
.navbar-gray .list-inline > .list-inline-item:focus a,
.navbar-gray .list-inline > .list-inline-item:active a
{
	color: var(--header-nav-links-color-hover);
}

.logo
{
	width: 290px;
    height: 180px;
	background-image: url('../img/vila-logo-new.png');
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
}

@media (max-width: 600px) {
	.logo{
		width: 190px;
	}
}

.navbar
{
	padding: .75rem 1rem;
	font-size: 0.8125rem;
	font-family: var(--font-family-open-sans);
	background: var(--header-bg-navbar);
}

.navbar .navbar-nav .nav-link
{
	color: var(--header-nav-links-color);
	padding: .5rem;
}

.navbar .navbar-nav .nav-link:hover,
.navbar .navbar-nav .nav-link:focus, 
.navbar .navbar-nav .nav-link:active,  
.navbar .navbar-nav .active > .nav-link, 
.navbar .navbar-nav .nav-link.active
{
	color: var(--header-nav-links-color-hover);
}

.navbar .navbar-nav .nav-link.button-rounded
{
	margin-left: .5rem;
	color: var(--header-nav-button-text-color);
}

.dropdown-menu {
	font-size: 0.8125rem;
    padding: .5rem 0;
    border: 1px solid rgb(189,36,63);
	border-radius: 0rem;
}

.dropdown-item
{
	color: var(--header-nav-links-color);
}

.dropdown-item.active, 
.dropdown-item:active {
	background-color: var(--header-detail-red-color);
}

.navbar-toggler {
    padding: .25rem .75rem;
    font-size: 1.25rem;
    line-height: 1;
    background-color: transparent;
    border: 1px solid transparent;
        border-top-color: transparent;
        border-right-color: transparent;
        border-bottom-color: transparent;
        border-left-color: transparent;
    border-radius: .0;
}

/* Variables */
footer
{
	--footer-bg-white: #fff;
	--footer-text-color: #757575;
	--footer-link-color: #757575;
	--footer-link-color-hover: #757575;
	--footer-border: 1px solid rgba(117, 117, 117, 0.2);
}

/* clases */
footer
{
	background-color: var(--footer-bg-white);
	color: var(--footer-text-color);
	font-size: .875rem;
}

footer .footer-border
{
	/*border-top: var(--footer-border);*/
}

footer .section-title
{
	font-size: .875rem;
	font-weight: 700;
	margin-bottom: 1.5rem;
}

footer a
{
	color: var(--footer-link-color);
}

footer a:hover,
footer a:focus,
footer a:active
{
	color: var(--footer-link-color-hover);
}

footer .social-links
{
	margin-top: 4rem;
}

footer .social-link
{
	display: block;
	width: 35px;
	height: 35px;
	margin: 0 auto;
	background-position: center;
	background-repeat: no-repeat;
	transition: all .2s ease-in-out;
}

footer .social-links .social-link.facebook-logo
{
	background-image: url('../img/facebook.svg');
}

footer .social-links .social-link.facebook-logo:hover,
footer .social-links .social-link.facebook-logo:focus,
footer .social-links .social-link.facebook-logo:active
{
	background-image: url('../img/facebook-2.svg');
}

footer .social-links .social-link.twitter-logo
{
	background-image: url('../img/twitter.svg');
}

footer .social-links .social-link.twitter-logo:hover,
footer .social-links .social-link.twitter-logo:focus,
footer .social-links .social-link.twitter-logo:active
{
	background-image: url('../img/twitter-2.svg');
}

footer .social-links .social-link.linkedin-logo
{
	background-image: url('../img/linkedin.svg');
}

footer .social-links .social-link.linkedin-logo:hover,
footer .social-links .social-link.linkedin-logo:focus,
footer .social-links .social-link.linkedin-logo:active
{
	background-image: url('../img/linkedin-2.svg');
}

footer .social-links .social-link.youtube-logo
{
	background-image: url('../img/youtube.svg');
}

footer .social-links .social-link.youtube-logo:hover,
footer .social-links .social-link.youtube-logo:focus,
footer .social-links .social-link.youtube-logo:active
{
	background-image: url('../img/youtube-2.svg');
}

/*
* === CAROUSEL ===
*/
.carousel
{
	/*--carousel-bg-item-red: rgba(186, 51, 98, 0.75);*/
	--carousel-bg-item-yellow: rgba(228, 144, 7, 0.75);
        --carousel-bg-item-orange: rgba(173, 49, 59, 0.75);
        --carousel-bg-item-red: rgba(228, 54, 77, 0.75);
        --carousel-bg-item-wine: rgba(219, 55, 112, 0.75);
        --carousel-bg-item-dark-wine: rgba(124, 21, 64, 0.75);
        --carousel-bg-item-green: rgba(18, 91, 96, 0.75);
        --carousel-bg-item-turquoise: rgba(0, 162, 168, 0.75);
        --carousel-bg-item-black: rgba(36, 48, 57, 0.75);
	--carousel-bg-item-white: rgba(255, 255, 255, 0.75);
	--carousel-content-borders: 2px solid #fff;
	--carousel-content-color: #fff;
}

.carousel > .carousel-inner > .carousel-item
{
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
        height: 55vh;
        padding: 30px 0;
	/*height: 65vh;
	padding: 10% 0;*/
}

.carousel > .carousel-inner > .carousel-item::after
{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 45%;
	height: 100%;
	z-index: -1;
}

.carousel > .carousel-inner > .carousel-item.carousel-yellow-item::after
{
	background-color: var(--carousel-bg-item-yellow);
}

.carousel > .carousel-inner > .carousel-item.carousel-orange-item::after
{
	background-color: var(--carousel-bg-item-orange);
}

.carousel > .carousel-inner > .carousel-item.carousel-wine-item::after
{
	background-color: var(--carousel-bg-item-wine);
}

.carousel > .carousel-inner > .carousel-item.carousel-dark-wine-item::after
{
	background-color: var(--carousel-bg-item-dark-wine);
}

.carousel > .carousel-inner > .carousel-item.carousel-green-item::after
{
	background-color: var(--carousel-bg-item-green);
}

.carousel > .carousel-inner > .carousel-item.carousel-turquoise-item::after
{
	background-color: var(--carousel-bg-item-turquoise);
}

.carousel > .carousel-inner > .carousel-item.carousel-red-item::after
{
	background-color: var(--carousel-bg-item-red);
}

.carousel > .carousel-inner > .carousel-item.carousel-black-item::after
{
	background-color: var(--carousel-bg-item-black);
}

/*.carousel > .carousel-inner > .carousel-item:nth-child(even)::after
{
	background-color: var(--carousel-bg-item-black);
}*/

.carousel > .carousel-inner > .carousel-item .content
{
	position: relative;
	margin-left: calc(45% - 422px);
	width: 100%;
	max-width: 504px;
	border: var(--carousel-content-borders);
}

.carousel > .carousel-inner > .carousel-item .content > .horizontal-box
{
	width: calc(100% - 80px);
	padding: 2rem 1rem;
}

.carousel > .carousel-inner > .carousel-item .content > .horizontal-box > .title
{
	font-size: 1.7rem;
	color: var(--carousel-content-color);	
	text-align: left;
	padding-bottom: 1.75rem;
        text-transform: uppercase;
}

.carousel > .carousel-inner > .carousel-item .content > .horizontal-box > .title.space
{
	margin-bottom: 1.5rem;
}

.carousel > .carousel-inner > .carousel-item .content > .horizontal-box > .title::after
{
	background-color: var(--carousel-content-color);	
}

.carousel > .carousel-inner > .carousel-item .content > .horizontal-box > .body
{
	color: var(--carousel-content-color);
	margin-bottom: 1.5rem;
}

.carousel > .carousel-inner > .carousel-item .content > .horizontal-box .link .fas
{
	color: var(--carousel-content-color);
}

.carousel > .carousel-inner > .carousel-item .content > .vertical-box
{
	background-color: var(--carousel-bg-item-white);
	position: relative;
	width: 80px;
}

.carousel > .carousel-inner > .carousel-item .content > .vertical-box > .text
{
	font-weight: 700;
	transform: rotate(-100grad);
	text-align: center;
        text-transform: uppercase;
	position: absolute;
	left: -110px;
	min-width: 300px;
	max-width: 600px;
	width: 100%;
}

.carousel-indicators {
    right: 0;
    left: 47%;
    justify-content: initial;
    margin-right: 0;
    margin-left: 0;
}

.carousel-indicators li {
    width: 50px;
    height: 5px;
    margin-right: 3px;
    margin-left: 3px;
}

/*
* === COVERS ===
*/
.cover
{
	--cover-content-color: #fff;
}

.cover .bg-cover
{
	background-position: 65% center;
	background-size: cover;
	background-repeat: no-repeat;
	height: 200px;
}

@media screen and (min-width: 560px) {
    .cover .bg-cover
    {
            background-position: 65% center;
            background-size: cover;
            background-repeat: no-repeat;
            height: 275px;
    }
}

.cover .bg-cover.quienes-somos 
{
	background-image: url('../img/header-wine.png');
}

.cover .bg-cover.valores-compromiso 
{
	background-image: url('../img/header-green.png');
}

.cover .bg-cover.mensaje-del-director
{
	background-image: url('../img/header-turquoise.png');
}

.cover .bg-cover.tour-virtual
{
	background-image: url('../img/header-yellow.png');
}

.cover .bg-cover.noticias
{
	background-image: url('../img/header-yellow.png');
}

.cover .bg-cover.nuestro-equipo
{
	background-image: url('../img/header-turquoise.png');
}

.cover .bg-cover.administrativo
{
	background-image: url('../img/header-green.png');
}

.cover .bg-cover.contacto
{
	background-image: url('../img/header-wine.png');
}

.cover .bg-cover .cover-title
{
	font-family: var(--font-family-montserrat);
	font-weight: 700;
	font-size: 2.8125rem;
	color: var(--cover-title-color);
	position: absolute;
	top: 170px;
        text-transform: uppercase;
}

.cover .bg-cover-w-info
{
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	min-height: 275px;
	margin-bottom: 4rem;
}

.cover .bg-cover-w-info.integrante
{
	background-image: url('../img/header-turquoise.png');
}

.cover .bg-cover-w-info .bio .stamp
{
	margin-bottom: -2rem;
}

.cover .bg-cover-w-info .bio .stamp img + span
{
	height: calc(100% + 4rem);
}

.cover .bg-cover-w-info .content
{
	color: var(--cover-content-color);
}

.cover .bg-cover-w-info .content .title-single
{
	margin-top: 2rem;
}

.cover .bg-cover-w-info .content .sub
{
	font-size: 1.625rem;
        text-transform: uppercase;
}

.cover .bg-cover-w-info .content .text
{
	font-size: 1.125rem;
	margin-bottom: 3rem;
}

/*
* === BORDERED BOX ===
*/
.bordered-box 
{
	--bordered-box-borders: 1px solid #ba3362;
}

.bordered-box.bg-adn
{
	background-position: center;
	background-repeat: no-repeat;
	background-size: 35%;
}

.bordered-box .row:first-child .content
{
	margin-bottom: 3rem;
}

.bordered-box .content
{
	padding: 4rem 6rem;
	border: var(--bordered-box-borders);
	text-align: center;
}

.bordered-box .content .bordered-box-title
{
	font-size: 1.25rem;
	font-family: var(--font-family-montserrat);
	color: var(--text-color-black);
	margin-bottom: 3rem;
}

.bordered-box .content > p
{
	font-style: italic;
}

.bordered-box .content > p:first-of-type
{
	margin-bottom: 2rem;
}

.bordered-box .content > p:last-of-type
{
	margin-bottom: 0rem;
}


/*
* === BORDERED BOX W POSTAL ===
*/
.bordered-box-w-postal
{
	--bordered-box-w-postal-borders: 1px solid #ba3362;
}

.bordered-box-w-postal
{
	position: relative;
	border: var(--bordered-box-w-postal-borders);
	padding: 5rem;
}

.bordered-box-w-postal > .postal
{
	position: absolute;
	top: -17%;
	left: 0;
	right: 0;
	margin: 0 auto;
}

/*
* === BORDERED BOX IMAGE ===
*/
.bordered-box-image
{
	--bordered-box-image-borders: 1px solid #ba3362;
	--bordered-box-bg-content: #fff;
}

.bordered-box-image.bg-desk
{
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

.bordered-box-image .wrapper
{
	padding-top: calc(var(--wrapper-size) + 1rem);
	padding-bottom: calc(var(--wrapper-size) + 1rem);
}

.bordered-box-image .content
{
	border-top: var(--bordered-box-image-borders);
	border-left: var(--bordered-box-image-borders);
	border-bottom: var(--bordered-box-image-borders);
	padding: 2.5rem;
	background-color: var(--bordered-box-bg-content);
}

.bordered-box-image .content p
{
	text-align: justify;
}

.bordered-box-image .content p:last-of-type
{
	margin-bottom: 3rem;
}

.bordered-box-image .bg-picture
{
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	margin-top: -1rem;
	height: calc(100% + 2rem);
	box-shadow: 0rem 0rem 2.5rem rgba(0,0,0,0.15);
}

/*
* === CARDS ===
*/
.cards
{
	--cards-card-item-bg: #fff;
}

.cards .wrapper
{
	padding-top: 0;
	padding-bottom: 0;
}

.cards .wrapper:first-child
{
	padding-top: var(--wrapper-size);
}

.cards .wrapper:last-child
{
	padding-bottom: calc(.375rem + 40px);
}

.cards .wrapper .card-item
{
	margin-bottom: 4rem;
}

.cards .card-item
{
	position: relative;
}

.cards .card-item .card-title
{
	position: absolute;
	bottom: -40px;
	left: 0;
	right: 0;
	margin: 0 auto;
	width: calc(100% - 2rem);
	background-color: var(--cards-card-item-bg);
	height: 80px;
	overflow: hidden;
	box-shadow: none;
	transition: all .3s ease-in-out;
        text-transform: uppercase;
}

.cards .card-item:hover .card-title,
.cards .card-item:focus .card-title,
.cards .card-item:active .card-title
{
	box-shadow: 0rem 0rem 2.5rem rgba(0,0,0,0.15);
}

.cards .card-item .card-title > p
{
	text-align: center;
        text-transform: uppercase;
	margin: 0 auto;
	width: calc(100% - 8rem);
	font-size: 0.9125rem;
	margin-bottom: 0;
	color: var(--text-color-black);
}

/*
* === BANNER BOX ===
*/
.banner-box
{
	--banner-box-floating-box-bg: #fff;
}

.banner-box .wrapper
{
	padding-bottom: calc(var(--wrapper-size) + 177.5px);
}

.banner-box .bg-banner
{
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 515px;
}

.banner-box .bg-banner .floating-box
{
	position: absolute;
	bottom: -177.5px;
	left: 0;
	right: 0;
	margin: 0 auto;
	text-align: center;
	padding: 3rem 8rem;
	width: 70%;
	min-height: 355px;
	background-color: var(--banner-box-floating-box-bg);
	box-shadow: 0rem 0rem 2.5rem rgba(0,0,0,0.15);
}

.banner-box .bg-banner .floating-box p:last-of-type
{
	margin-bottom: 3rem;
}

/*
* === BLOG CARDS ===
*/
.blog-cards
{
	--blog-card-bg: #fff;
}

.blog-cards .blog-card
{
	background-color: var(--blog-card-bg);
}

.blog-cards .blog-card .new-content
{
	position: relative;
	padding: 2rem 1rem;
	height: 100%;
}

.blog-cards .blog-card .new-content .new-title
{
	color: var(--text-color-black);
	font-size: 1rem;
	margin-bottom: 2rem;
	height: 38px;
	overflow: hidden;
}

.blog-cards .blog-card .new-content .new-body
{
	font-size: 0.875rem;
	height: 84px;
	overflow: hidden;
}

.blog-cards .blog-card .new-content .new-link
{
	position: absolute;
	bottom: 0;
	right: 1rem;
	bottom: 2rem;
}

/*
* === IMAGE W FRAME ===
*/
.image-w-frame
{
	position: relative;
}

.image-w-frame .wrapper
{
	padding-bottom: calc(var(--wrapper-size) - 2.375rem);
}

.image-w-frame .wrapper:last-child
{
	padding-bottom: calc(var(--wrapper-size) + 2.375rem);
}

.image-w-frame img
{
	box-shadow: 0rem 0rem 2.5rem rgba(0,0,0,0.15);
}

.image-w-frame img + span
{
	position: absolute;
	top: 2rem;
	width: calc(100% - 2rem);
	height: 100%;
	/*border: 1px solid #ba3362;*/
	pointer-events: none;
}

.image-w-frame .image-left
{
	position: relative;
	padding-left: 2rem;
}

.image-w-frame .image-left img + span
{
	left: 0;
}

.image-w-frame .image-right
{
	position: relative;
	padding-right: 2rem;
}

.image-w-frame .image-right img + span
{
	right: 0;
}

.image-w-frame .content 
{
	padding-top: 1rem;
}

.image-w-frame .content > p
{
	margin-bottom: 3rem;
}

.image-w-frame .content > p:last-child
{
	margin-bottom: 0;
}

.image-w-frame .content .ordered-list li:not(:last-child), .ordered-list ol li:not(:last-child)
{
	margin-bottom: 1rem;
}
/*
* === BG SQUARE BOX ===
*/
.bg-square-box
{
	--bg-square-box-bg: #fff;
}

.bg-square-box
{
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

.bg-square-box .square-box
{
	background-color: var(--bg-square-box-bg);
	padding: 4rem;
	box-shadow: 0rem 0rem 2.5rem rgba(0,0,0,0.15);
}

/*
* === BIO ===
*/
.bio .stamp 
{
	position: relative;
}

.bio .stamp img
{
	box-shadow: 0rem 0rem 2.5rem rgba(0,0,0,0.15);
}

.bio .stamp img + span
{
	position: absolute;
	top: -1rem;
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 90%;
	height: calc(100% + 2rem);
	/*border: 1px solid #00A2A8;*/
	pointer-events: none;
}

.bio .content > p
{
	margin-bottom: 3rem;
}

.bio .content > p:last-of-type
{
	margin-bottom: 5rem;
}

.bio .content > .signature > p
{
	text-align: center;
	font-weight: 700;
	margin-bottom: 2rem;
}

.bio .content .quote
{
	display: block;
	text-align: center;
	font-size: 3rem;
	height: 50px;
}

/*
* === GALLERY ===
*/
.gallery .row:not(:last-child) .gallery-photo
{
	margin-bottom: 2rem;
}

/*
* === FLOATING CARD ===
*/
.floating-cards
{
	--floating-cards-card-bg: #fff;
	--floating-cards-card-body-detail: 1px solid rgba(117, 117, 117, 0.2);
	--floating-cards-card-text-color: #757575;
	--floating-cards-card-text-color-hover: #ba3362;
}

.floating-cards .floating-card
{
	position: relative;
	margin-bottom: 3rem;
}

.floating-cards .floating-card a
{
	text-decoration: none;
}

.floating-cards .floating-card .linkeable > img, .partner
{
	/*filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
	/*filter: gray; /* IE6-9 */
	/*-webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
	transition: all .3s ease-in-out;
	width: 100%;
    height: auto;
}

/*.floating-cards .floating-card .linkeable:hover > img, .partner:hover
{
	filter: none;
	-webkit-filter: grayscale(0%);
}*/

.floating-cards .floating-card .floating-box
{
	position: relative;
	margin: 0 auto;
	margin-top: -4rem;
	width: calc(100% - 2rem);
	background-color: var(--floating-cards-card-bg);
	box-shadow: 0rem 0rem 2.5rem rgba(0,0,0,0.15);
	padding: 2rem;
}

/* regular size */
.floating-cards .floating-card .floating-box .title-single
{   
        text-transform: uppercase;
	font-size: 1.875rem;
	margin-bottom: 1rem;
	transition: all .3s ease-in-out;
}

.floating-cards .floating-card .floating-box a:hover .title-single
{
	color: var(--floating-cards-card-text-color-hover);
}

.floating-cards .floating-card .floating-box .labels
{
	display: block;
	margin-bottom: .5rem;
}

.floating-cards .floating-card .floating-box .labels .button-rounded
{
	font-size: 1rem;
	border-radius: 2rem;
	padding: .25rem 1rem;
	text-align: center;
	margin-bottom: .5rem;
}

.floating-cards .floating-card .floating-box .labels .button-rounded:not(:last-child)
{
	margin-right: .5rem;
}

.floating-cards .floating-card .floating-box .content .body
{
	margin-top: 2rem;
	padding-top: 2rem;
	border-top: var(--floating-cards-card-body-detail);
}

/* small size */
.floating-cards .floating-card .floating-box.small-size .title-single
{
	font-size: 1.375rem;
	margin-bottom: .5rem;
}

.floating-cards .floating-card .floating-box.small-size .labels
{
	display: block;
	margin-bottom: .5rem;
}

.floating-cards .floating-card .floating-box.small-size .labels .button-rounded
{
	font-size: .7rem;
	border-radius: 2rem;
	padding: .25rem 1rem;
	text-align: center;
	margin-bottom: .25rem;
}

.floating-cards .floating-card .floating-box.small-size .labels .button-rounded:not(:last-child)
{
	margin-right: .25rem;
}

.floating-cards .floating-card .floating-box.small-size .date
{
	font-size: 80%;
}

/* Horizontal floating Card */
.floating-cards .horizontal.floating-card
{
	position: relative;
}

.floating-cards .horizontal.floating-card .floating-box
{
	position: relative;
	margin-top: 0;
	margin-left: -2rem;
	width: calc(100% + 2rem);
	background-color: var(--floating-cards-card-bg);
	box-shadow: 0rem 0rem 2.5rem rgba(0,0,0,0.15);
	padding: 2rem;
}

/* Worker floating card */
.floating-cards .floating-card .worker.floating-box
{
	padding: 2rem;
	height: 140px;
}

.floating-cards .floating-card .worker.floating-box .person
{
	text-align: center;
}


.floating-cards .floating-card .linkeable .worker.floating-box .person .name
{   
        text-transform: uppercase;
	font-size: 0.9125rem;
	margin-bottom: 2rem;
	font-weight: 700;
	color: var(--floating-cards-card-text-color);
	transition: all .3s ease-in-out;
}

.floating-cards .floating-card .linkeable:hover .worker.floating-box .person .name,
.floating-cards .floating-card .linkeable:focus .worker.floating-box .person .name,
.floating-cards .floating-card .linkeable:active .worker.floating-box .person .name
{
	color: var(--floating-cards-card-text-color-hover);
}

.floating-cards .floating-card .linkeable .worker.floating-box .person .sub
{	
        text-transform: uppercase;
	font-size: 0.6875rem;
	margin-bottom: 0;
	color: var(--floating-cards-card-text-color);
}

/* Map floating card */
.floating-cards .floating-card.map .floating-box
{
	width: 70%;
}

/*
* === ARTICLES ===
*/
.articles .article .date
{
	margin: 2rem 0;
	display: block;
}

.articles .article .title-single
{
	margin-bottom: 3rem;
}

/*
* === ASIDE BOX ===
*/
.aside-box
{
	--aside-box-background-color: #fff;
	--aside-box-borders: 1px solid rgba(117, 117, 117, 0.2);
}

.aside-box
{
	padding: 1.5rem;
	background-color: var(--aside-box-background-color);
	border: var(--aside-box-borders);
}

.aside-box .aside-box-title
{
	font-weight: 700;
	font-size: 0.8125rem;
	margin-bottom: 3rem;
}

.aside-box .aside-description-list
{
	font-size: 0.8125rem;
	margin-bottom: 3rem;
}

.aside-box .aside-description-list > dt,
.aside-box .aside-description-list > dd
{
	margin-bottom: 1rem;
}


/*New classes*/
.post-bg{
    background-image: url('../img/header-yellow.png');
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 100% 200px;
}

.post-cover{
    background-color: white;
    padding: 8px;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}

.nav-item a{
    text-transform: uppercase;
}

.echoed-title{
    position: absolute;
    margin-top: 30px;
    font-size: 9rem;
    font-weight: bold;
    margin-left: -80px;
    color: #292929;
    opacity: .15;
    text-transform: uppercase;
    width: 100%;
    height: 200px;
    overflow: hidden;
}

.dudev{
    padding-top: 5px;
    background-color: #292929;
    color: #f9f9f9;
}

.dudev-link img, .dudev-link{
    text-decoration: none;
    border:none;
}

.formContainer{
    background-image: url('../img/bienvenida-bg.jpg');
    background-color: transparent;
    padding: 3rem 0px;
}

.form{
    background-color: white;
    background-size: cover;
    padding: 40px 50px;
    border-radius: 10px;
    -mox-border-radius: 10px;
    -webkit-border-radius: 10px;
    box-shadow: 5px 5px 8px 3px #e9e9e9;
    border: solid thin #d9d9d9;
}

.area-content p{
    font-size: 1.125rem;
    text-align:justify !important;
}

.area-content h3{
    text-transform: uppercase;
    font-family: var(--font-family-montserrat);
    font-size: 2.5rem;
    font-weight: 700;
    position: relative;
    margin-bottom: 0;
    color: var(--title-color-black);
    margin-bottom: 3rem;
}

.team-content h3{   
    text-align:left !important;
    font-family: var(--font-family-montserrat);
    font-size: 2.5rem;
    font-weight: 700;
    position: relative;
    margin-bottom: 0;
    color: var(--title-color-black);
    text-align: center;
    padding-bottom: 2.5rem;
    text-transform: uppercase;
    margin-bottom: 2.5rem;
}

.team-content h3::after{
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 170px;
    height: 1px;
    background-color: var(--title-detail-red);
}

.date-container h5{
    font-weight: 700;
    font-size: 1.5rem;
}

.lawyer-container{
   margin-bottom: 20px;
}


/*TESTIMONIALS*/

.testimonialHeader {
    padding: 50px 40px 80px;
    text-align: center;
    background-color: #4a4a4a;   
    background-position: center;
    background-size: cover;
    color: white;
    font-size: 1.2rem;
    font-family: Arial;
    height:230px;
    /* font-weight: bold; */
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.greenTestimonial{
    background-image: url(../img/header-green.png);
}

.yellowTestimonial{
    background-image: url(../img/header-yellow.png);
}

.wineTestimonial{
    background-image: url(../img/header-wine.png);
}

.turquoiseTestimonial{
    background-image: url(../img/header-turquoise.png);
}

.testimonialFooter{
    margin-top: -20px;
    background: white;
    padding: 30px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    box-shadow: 0rem 0rem 2.5rem rgba(0,0,0,0.15);
}

img.testimonialIcon {
    margin: -70px auto 20px;
    position: relative;
    display: block;
    width: 80px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border: solid 4px white;
}

img.testimonialIcon2 {
    margin: -70px auto 20px;
    position: relative;
    display: block;
    width: 80px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border: solid 0px white;
}

h3.testimonialTitle {
    font-size: 1.3rem;
    text-align: center;
}

p.testimonialSubtitle {
    text-align: center;
    margin-top:10px;
}


.pageSubtitle{
    font-size: 1.7rem;
    font-size: 2.2rem;
    color: var(--carousel-content-color);
    text-align: left;
    padding: 1.75rem 1.75rem 0;
    text-transform: uppercase;
    font-weight: bold;
}

.dropdown-item:focus, .dropdown-item:hover {
    color: white !important;
    text-decoration: none;
    background-color: rgb(189,36,63) !important;
}

.fact-container{
    margin:10px;
    padding: 20px;
    border-radius: 5px;
    border: solid thin #e9e9e9;
    box-shadow: 0rem 0rem 2.5rem rgba(0,0,0,0.15);
    min-height: 194px;
}

.fact-container:hover p.fact-title, .fact-container:hover p.fact-title strong, .fact-container:hover p.fact-subtitle{
    color: white;
}

.fact-container-yellow .fact-title strong{
    color: rgba(228, 144, 7, 0.75);
}

.fact-container-yellow:hover{
    color:white !important;
    background-color: rgba(228, 144, 7, 0.75);
}

.fact-container-green .fact-title strong{
    color: rgba(18, 91, 96, 0.75);
}

.fact-container-green:hover{
    color:white !important;
    background-color: rgba(18, 91, 96, 0.75);
}

.fact-container-wine .fact-title strong{
    color: rgba(189,36,63, 0.75);
}

.fact-container-wine:hover{
    color:white !important;
    background-color: rgba(189,36,63, 0.75);
}

.fact-container-turquoise .fact-title strong{
    color: rgba(0, 162, 168, 0.75);
}

.fact-container-turquoise:hover{
    color:white !important;
    background-color: rgba(0, 162, 168, 0.75);
}

.fact-title{
    font-size: 2.5rem;
}

.fact-title strong{
    font-weight: normal;
    font-size: 3rem;
    margin-left: 5px;
}

/**
 * ------------------------------------------------------------
 * New Classes by Adrian
 * ------------------------------------------------------------
 */

:root {
    --title-color-red: #ba3362;
}

/*
* === TITLE CROOKED ===
*/
.title-crooked {
    position: relative;
    font-size: 2.5rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 2.5rem;
    margin-left: 1rem;
}

.title-crooked span {
    position: absolute;
    left: 0;
    right: 0;
    top: 2.5rem;
    /*margin-left: -5rem;*/
    color: var(--title-color-black);
    word-break: break-all;
}

.title-crooked.space {
    margin-bottom: 6rem;
}

.title-crooked.red {
    color: var(--title-color-red);
}

/*
* === BLACK BOX ===
*/
.black-box {
    position: relative;
}

.black-box .black-box-item {
    position: relative;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 500px;
    -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
    filter: grayscale(100%);
}

.black-box .black-box-item:hover{
	-webkit-filter: grayscale(0%) !important; /* Safari 6.0 - 9.0 */
    filter: grayscale(0%) !important;
}

.black-box .black-box-item::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
}

.black-box .black-box-item:hover{
	background-color: rgba(0, 0, 0, 0.0) !important;
}

.black-box .black-box-item.bg-1 {
    background-image: url('../img/lawyers.jpg');
}

.black-box .black-box-item.bg-1:hover{
	background-image: url('../img/lawyers.jpg');
}

.black-box .black-box-item.bg-2 {
    background-image: url('../img/HOM2.png');
}

.black-box .black-box-item.bg-2:hover {
    background-image: url('../img/HOME-1.png');
}

.black-box .black-box-item.bg-3 {
    background-image: url('../img/hill.jpg');
}

.black-box .black-box-item.bg-3:hover {
    background-image: url('../img/hill.jpg');
}

.black-box .black-box-item .text {
    color: white;
    position: absolute;
    left: 15px;
    right: 15px;
    bottom: 50px;
    z-index: 1;
    text-align: center;
    font-style: italic;
}

/*
* === LIST NEWS ===
*/
.list-news {
    --list-new-title-color: #243039;
    --list-new-title-color-hover: #ba3362;
    --list-new-title-icon-color: #ba3362;
}

.list-news .list-new-item .graph {
    color: var(--list-new-title-icon-color);
    font-size: 150%;
}

.list-news .list-new-item .content .new-title {
    color: var(--list-new-title-color);
    font-weight: 700;
}

.list-news .list-new-item .content .new-title:hover {
    color: var(--list-new-title-color-hover);
}

/*
* === LIST SOCIAL MEDIA ===
*/
.list-social-media {
    --list-social-media-color: #fff;
    --facebook-color: #4267b2;
    --linked-in-color: #0073b1;
    --instagram-color: #d02f7a;
    --youtube-color: #b00;
    padding: 20px;
}

.list-social-media .facebook,
.list-social-media .linked-in,
.list-social-media .instagram,
.list-social-media .youtube {
    color: var(--list-social-media-color);
    padding: 5px;
    border-radius: 50%;
    display: block;
    width: 30px;
    height: 30px;
    margin: 0 5px;
}

.list-social-media .facebook {
    background-color: var(--facebook-color);
}

.list-social-media .linked-in {
    background-color: var(--linked-in-color);
}

.list-social-media .instagram {
    background-color: var(--instagram-color);
}

.list-social-media .youtube {
    background-color: var(--youtube-color);
}

.list-social-media i {
    vertical-align: middle;
}

/*
* === SIDEBAR ===
*/
.sidebar {
    --sidebar-default-title-color: #ba3362;
    --sidebar-blue-color: #0073b1;
    --sidebar-subtitle-color: #243039;
    --sidebar-divider-color: #ba3362;
}

.sidebar .sidebar-title {
    font-size: 1.5rem;
    color: var(--sidebar-default-title-color);
    font-weight: 700;
}

.sidebar .sidebar-subtitle {
    font-size: 1rem;
    color: var(--sidebar-subtitle-color);
    font-weight: 700;
}

.sidebar .divider {
    display: block;
    width: 100%;
    height: 2px;
    margin-top: 1rem;
    margin-bottom: 2rem;
}

.sidebar .divider.show {
    background-color: var(--sidebar-divider-color);
}

.sidebar .sidebar-title.blue,
.sidebar .graph.blue,
.sidebar .list-news .list-new-item .content .new-title.blue:hover {
    color: var(--sidebar-blue-color);
}

.sidebar .divider.show.blue {
    background-color: var(--sidebar-blue-color);
}

/*
* === CUSTOM TAB ===
*/
.custom-tab {
    --custom-tab-tab-color: #243039;
    --custom-tab-tab-color-active: #ba3362;
}

.custom-tab {
    border: none;
}

.custom-tab .nav-item:nth-child(1) .nav-link {
    background-color: #f8f9fa;
}
.custom-tab .nav-item:nth-child(2) .nav-link {
    background-color: #e9ecef;
}
.custom-tab .nav-item:nth-child(3) .nav-link {
    background-color: #dee2e6;
}
.custom-tab .nav-item:nth-child(4) .nav-link {
    background-color: #ced4da;
}

.custom-tab .nav-item .nav-link {
    font-weight: 700;
    color: var(--custom-tab-tab-color);
    border: none;
    border-radius: 0;
}

.custom-tab .nav-item .nav-link.active {
    color: var(--custom-tab-tab-color-active);
}


@media screen and (min-width: 800px) {
  .vila-partners li.list-inline-item{
		width: calc(20% - 3rem);
		/*width: 120px;*/
    	margin: 1.5rem;
	}
}

