@import url("https://fonts.googleapis.com/css2?family=Oswald:wght@200;400;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Source+Sans+3:wght@200;400;700&display=swap");

:root {
	/* Fonts */
	--sc-font-family-header: "Oswald", sans-serif;
	--sc-font-family-body: "Source Sans 3", sans-serif;
	--sc-font-weight-extralight: 200;
	--sc-font-weight-regular: 400;
	--sc-font-weight-bold: 700;

	/* Colors */
	--sc-color-primary: #ff8700;
	--sc-color-primary-50: rgb(255, 197, 130);
	--sc-color-primary-darker: #ea7c00;
	--sc-color-accent: #f5c443;
	--sc-color-error-background: #fb8073;
	--sc-color-error-border: #c13425;

	--sc-color-light-mode: #121212;
	--sc-color-light-mode-90: rgba(18, 18, 18, 0.9);
	--sc-color-light-mode-80: rgba(18, 18, 18, 0.8);
	--sc-color-light-mode-70: rgba(18, 18, 18, 0.7);
	--sc-color-light-mode-60: rgba(18, 18, 18, 0.6);
	--sc-color-light-mode-40: rgba(18, 18, 18, 0.4);
	--sc-color-background-light-mode: #ffb766;

	--sc-color-dark-mode: #ffffff;
	--sc-color-dark-mode-90: rgba(255, 255, 255, 0.9);
	--sc-color-dark-mode-80: rgba(255, 255, 255, 0.8);
	--sc-color-dark-mode-70: rgba(255, 255, 255, 0.7);
	--sc-color-dark-mode-60: rgba(255, 255, 255, 0.6);
	--sc-color-dark-mode-50: rgba(255, 255, 255, 0.5);
	--sc-color-dark-mode-40: rgba(255, 255, 255, 0.4);
	--sc-color-dark-mode-30: rgba(255, 255, 255, 0.3);
	--sc-color-dark-mode-20: rgba(255, 255, 255, 0.2);
	--sc-color-dark-mode-10: rgba(255, 255, 255, 0.1);
	--sc-colorbg-dark-mode: #121212;
	--sc-colorbg-dark-mode-alt-1: #272727;
	--sc-colorbg-dark-mode-alt-2: #4c4c4c;
	--sc-colorbg-dark-mode-alt-3: #040404;
	--sc-colorbg-dark-mode-menu: #151515;

	--sc-menubg-dark-mode: #1f1f1f;

	--sc-cologbg-dark-mode-card: #222222;
	--sc-cologbg-dark-mode-card-alt-1: #373737;
	--sc-cologbg-dark-mode-card-alt-2: #1b1b1b;
	--sc-cologbg-dark-mode-medios-de-pago: #4c4c4c;

	/* Text */
	--sc-letter-spacing-uppercase: 0.02em;

	/* Border Radius */
	--sc-br-16: 16px;
	--sc-br-8: 8px;
	--sc-br-4: 4px;
	--sc-br-2: 2px;

	/* Primary Buttons */
	--sc-primary-button-color-text: #2f1a03;
	--sc-primary-button-color-text-hover: #251202;
	--sc-primary-button-color-background: var(--sc-color-primary);
	--sc-primary-button-color-background-hover: #fd6c00;

	/* Secondary Button */
	--sc-secondary-button-color-text: var(--sc-color-primary);
	--sc-secondary-button-color-border: var(--sc-color-primary);
	--sc-secondary-button-color-text-hover: var(--sc-primary-button-color-text);
	--sc-secondary-button-color-background-hover: var(--sc-color-primary);
	--sc-button-primary-border-radius: 500px;
	/* Para el radio redondeado de los botones */

	/* sobreescribir las variables del tema para el bg del body y el menu */
	--wpex-bg-color: var(--sc-colorbg-dark-mode);
	--wpex-surface-1: var(--sc-menubg-dark-mode);

	/* Card Hover Animation Background */
	--sc-card-hover-animation-bg: linear-gradient(
		120deg,
		#171717 38%,
		#535353 65%,
		#171717 80%
	);
}

.vc_column_container > .vc_column-inner {
	padding: 0;
}

.wpex-post-cards-inner {
	margin: auto;
}

/* SECTION: Hero --->  */

#content .sc-row-hero,
#content .sc-row-hero .wpb_column,
#content .sc-row-hero .vc_column-inner {
	margin: 0;
	padding: 0;
}

/* <--- Fin SECTION: Hero */

/*
bg body y menu
*/

.body {
	background-color: var(--sc-colorbg-dark-mode);
}

.vc_row {
	margin-right: 0;
	margin-left: 0;
}

.pagos-ico {
	width: 34px;
	height: 26px;
}

#footer-bottom {
	display: none;
}

.sc-section-extra-content {
	margin-top: 100px;
}

/* MENU: /general/sc-menu-header.css */

/* SCROLL UP button */
#site-scroll-top {
	z-index: 300;
	padding: 4px;
	border: 1px solid var(--sc-color-dark-mode-20);
	background-color: var(--sc-colorbg-dark-mode-alt-2);
	color: var(--sc-color-dark-mode-80);
}

#site-scroll-top:hover {
	background-color: var(--sc-color-dark-mode);
	color: var(--sc-color-light-mode);
}

.size-thumbnail,
.size-thumb {
	width: 42px;
	height: 42px;
}

.wpex-carousel .owl-nav.disabled {
	visibility: hidden !important;
}

/* Carrousel Nav Slim */
.wpex-carousel.arrwstyle-slim .owl-nav .owl-nav__btn {
	border: 2px solid var(--sc-color-dark-mode);
	border-radius: 50%;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--sc-color-dark-mode);
	font-size: 24px;
	opacity: 0.8;
}

.wpex-carousel.arrwstyle-slim .owl-nav .owl-nav__btn:hover {
	background-color: var(--sc-color-dark-mode-20);
	opacity: 1;
}

/* Lightbox */

body .fancybox-can-pan .fancybox-content,
body .fancybox-can-swipe .fancybox-content {
	cursor: auto;
}
body .fancybox-content {
	border: 1px solid var(--sc-color-dark-mode-20);
	border-radius: 8px;
	background-color: var(--sc-colorbg-dark-mode-alt-1);
}

.fancybox-container .hubspot-form-text {
	width: 100%;
	max-width: 400px;
	margin: auto;
	margin-bottom: 32px;
}

.fancybox-container .hubspot-form-text * {
	margin: 0;
	padding: 0;
	color: var(--sc-color-dark-mode);
	font-weight: var(--sc-font-weight-normal);
	font-size: 16px;
	line-height: 1.4;
	font-family: var(--sc-font-family-body);
}

.fancybox-container .hubspot-form-text h3 {
	margin: 0;
	margin-bottom: 16px;
	padding: 0;
	color: var(--sc-color-dark-mode);
	font-weight: var(--sc-font-weight-bold);
	font-size: 24px;
	line-height: 1.2;
	font-family: var(--sc-font-family-header);
}

.fancybox-content {
	border: 1px solid var(--sc-color-dark-mode-20);
	border-radius: 8px;
	background-color: var(--sc-colorbg-dark-mode-alt-1);
}

.fancybox-slide--html .fancybox-close-small {
	color: white !important;
	opacity: 1 !important;
}

/* PRIMARY BUTTON */
.btn-primary {
	text-decoration: none !important;
	border: none;
	border-radius: var(--sc-button-primary-border-radius);
	background-color: var(--sc-color-primary);
	color: var(--sc-primary-button-color-text);
	font-weight: var(--sc-font-weight-bold);
	letter-spacing: var(--sc-letter-spacing-uppercase);
	text-transform: uppercase;
	transition-duration: 0.3s;
	transition-timing-function: cubic-bezier(0.9, -0.28, 0, 1.69);
}

.btn-primary:hover {
	border: 1px solid rgba(255, 255, 255, 0.1);
	background-color: var(--sc-primary-button-color-background-hover);
	box-shadow: inset 0 0 10px var(--sc-color-light-mode-70);
	color: var(--sc-primary-button-color-text-hover);
}

/* NO POSTS FOUND (postcards tema) */
.vcex-no-posts-found {
	background-color: var(--sc-color-dark-mode-10);
	padding: 32px;
	border-radius: 8px;
	text-align: center;
	color: var(--sc-color-dark-mode-80);
	font-size: 16px;
	font-weight: var(--sc-font-weight-extralight);
}

/* Breadcrumbs */
#main .vcex-breadcrumbs > span {
	font-weight: var(--sc-font-weight-regular);
	font-size: 14px;
}

#main .vcex-breadcrumbs > span > span {
	color: var(--sc-color-dark-mode-90);
}

#main .vcex-breadcrumbs > span > span:first-child {
	background-color: var(--sc-color-dark-mode-90);
	color: var(--sc-color-light-mode);
	padding: 2px 4px;
	border-radius: 4px;
	text-transform: uppercase;
	font-size: 12px;
	letter-spacing: var(--sc-letter-spacing-uppercase);
}

/* Animations */
@-webkit-keyframes CardAnimateHover {
	0% {
		background-position: 51% 0%;
	}
	50% {
		background-position: 50% 100%;
	}
	100% {
		background-position: 51% 0%;
	}
}
@-moz-keyframes CardAnimateHover {
	0% {
		background-position: 51% 0%;
	}
	50% {
		background-position: 50% 100%;
	}
	100% {
		background-position: 51% 0%;
	}
}
@-o-keyframes CardAnimateHover {
	0% {
		background-position: 51% 0%;
	}
	50% {
		background-position: 50% 100%;
	}
	100% {
		background-position: 51% 0%;
	}
}
@keyframes CardAnimateHover {
	0% {
		background-position: 51% 0%;
	}
	50% {
		background-position: 50% 100%;
	}
	100% {
		background-position: 51% 0%;
	}
}

/* Media Query for Tablets Ipads portrait mode */
@media (max-width: 1024px) {
}

/* Media Query for low resolution  Tablets, Ipads */
@media (max-width: 768px) {
	/*.sc-section .vc_row {
		padding: 0 16px;
	}*/

	#sidr-main .sidr-class-wpex-close {
		width: 68px;
		margin-left: auto;
	}

	#sidr-main .sidr-class-wpex-close a span {
		font-size: 36px;
	}
}

@media only screen and (min-width: 640px) {
	.wpex-carousel.arrwstyle-slim.arrwpos-abs .owl-prev {
		left: -60px;
	}

	.wpex-carousel.arrwstyle-slim.arrwpos-abs .owl-next {
		right: -60px;
	}
}

/* Media Query for Mobile Devices */
@media (max-width: 480px) {
	/* Métodos de Pago*/
	.pagos-ico {
		width: 40px;
		height: 26px;
	}

	/* Lightbox */
	.fancybox-content {
		max-width: 95% !important;
		padding: 32px 16px !important;
	}

	.fancybox-container .hubspot-form-text p {
		display: none;
	}
}

@media (max-width: 400px) {
	.pagos-ico {
		width: 30px;
		height: 20px;
	}
}