/**
 * style_franchise.css
 * Extends style_theme.css
 * base_theme: voxelcare
 * namespace: .com-
 * written by: Alexis
 */

@import url('https://fonts.googleapis.com/css?family=Roboto:400,700');
@import url('/cms/css/style_franchise_voxelcare.css');

/* ------------------------------------------------------------------------- */
/*                                   Layout                                  */
/* ------------------------------------------------------------------------- */

.com-container {
	max-width: 1100px;
	padding-left: 15px;
	padding-right: 15px;
	margin-left: auto;
	margin-right: auto;
}

@media screen and (max-width: 767px) {
	/**
   * Modificador de para las columnas de Bootstrap.
   * Elimina el padding en movil convirtiendo la columna en 'wide-screen'
   */
	.col-xs-full {
		padding-left: 0;
		padding-right: 0;
	}
}


/* Page */


/*.com-page {}*/

.com-page-bg {
	background-color: #fcfcfc;
}

.com-page-header {
	padding: 2rem 0;
	background-color: #eee;
}

.com-page-title {
	font-size: 3rem;
}

@media screen and (min-width: 993px) {
	.com-page-header {
		padding: 3rem 0;
	}
	.com-page-title {
		font-size: 4rem;
		padding-left: 3rem;
	}
}


/* Hero */

.com-hero {
	border-bottom: 1px solid #eee;
	background-color: #fcfcfc;
	background-image: -webkit-radial-gradient(circle, #fff 65%, #d5d5d5);
	background-image: radial-gradient(circle, #fff 65%, #d5d5d5);
}

.com-hero-with-video {
	position: relative;
	overflow: hidden;
}

.com-hero-with-bg {
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}

.com-hero-video {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	transform: translate(-50%, -50%);
}

.com-hero-video-overlay {
	position: absolute;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAAEFsT2yAAAACXBIWXMAAAsSAAALEgHS3X78AAAAFElEQVR4nGNhYGBwYIET////ZwAAETIDym2lzEcAAAAASUVORK5CYII=);
	background-size: 2px 2px;
	background-repeat: repeat;
	background-position: 0 0;
	width: 100%;
	height: 100%;
}

.com-hero.com-hero-extra {
	background-repeat: no-repeat, no-repeat;
	background-size: auto, 100% 100%;
	background-position: center, center;
	background-image: radial-gradient(circle, rgba(255, 255, 255, 0.3) 65%, rgba(240, 240, 240, 0.2)), url(../cms/images/interfaz/headerBackground.jpg);
}

.com-hero-title-wrapper {
	margin-left: 1rem;
	margin-right: 1rem;
	padding-top: 1rem;
	padding-left: 1rem;
	padding-right: 1rem;
	border-left: 3px solid #093;
}

.com-hero-title-wrapper.no-border {
	border-left: 0;
}

.com-hero-title {
	padding-top: 3px;
	padding-bottom: 3px;
	font-size: 2.85rem;
	font-family: 'Roboto', sans-serif;
	font-weight: 400;
	color: #222;
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
}

.com-hero-subtitle {
	padding-left: 2px;
	padding-right: 2px;
	font-size: 1.45rem;
	font-weight: 400;
	color: #444;
}

@media screen and (min-width: 768px) {
	.com-hero-title-wrapper {
		position: absolute;
		left: 0;
		top: 3rem;
		margin-top: 1.5rem;
	}
	.com-hero-title-wrapper.com-hero-title-wrapper-bottom {
		top: auto;
		bottom: 3rem;
	}
	.com-hero-title-wrapper.com-hero-title-wrapper-right {
		left: auto;
		right: 0;
	}
	.com-hero-title-wrapper.com-hero-title-wrapper-top {
		margin-top: 12%;
	}
}

@media screen and (min-width: 1170px) {
	.com-hero-with-video {
		min-height: 70vh;
	}
	.com-hero-title-wrapper {
		left: -0.75rem;
	}
	.com-hero-title-wrapper.com-hero-title-wrapper-right {
		left: auto;
		right: -0.75rem;
	}
	.com-hero-extra .com-hero-title-wrapper {
		max-width: 540px;
	}
}


/* Section */

.com-section-title {
	color: #222;
	border-left: 3px solid #093;
	padding-left: 1rem;
	font-size: 2rem;
	text-transform: uppercase;
}


/* ------------------------------------------------------------------------- */
/*                                 Objects                                   */
/* ------------------------------------------------------------------------- */


/* .com-pills extends  BS nav*/

.com-pills {
	display: flex;
	flex-direction: row;
}

.com-pills-seq {
	flex: 1 0 0;
	line-height: 1;
}

.com-pills-seq:not(.disabled)>a {
	background-color: #080;
}

.com-pills-seq:disabled,
.com-pills-seq.disabled {
	cursor: not-allowed;
	pointer-events: none;
}

.com-pills-item {
	flex: 1 0 0;
}

.com-pills>li>a {
	color: #090;
	border-radius: 0;
}

.com-pills>li.active>a,
.com-pills>li.active>a:hover,
.com-pills>li.active>a:focus {
	background-color: #090;
	color: #fff;
	border-radius: 0;
}

.com-pills-seq:not(.disabled)>a:hover {
	background-color: #0a0;
}

@media (min-width: 768px) {
	.com-pills-seq {
		flex: 0 0 0;
	}
}


/* .com-tabs extends BS nav-tabs */

.com-tabs>li>a,
.com-tabs>li>a:hover,
.com-tabs>li>a:focus,
.com-tabs>li>a:active {
	position: relative;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	color: #fff;
	background-color: #444;
	border: 0 !important;
	border-radius: 0 !important;
	z-index: 2;
}

.com-tabs>li.active>a,
.com-tabs>li.active>a:hover,
.com-tabs>li.active>a:focus,
.com-tabs>li.active>a:active {
	background-color: #111;
	color: #fff;
}

.com-tabs>li:not(.active)>a::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 1px;
	z-index: -1;
	background-color: #093;
	-webkit-transition-duration: 200ms;
	transition-duration: 200ms;
}

.com-tabs>li:not(.active)>a:hover::before,
.com-tabs>li:not(.active)>a:not(.active):focus::before {
	width: 100%;
}

.com-tabs-wrapper {
	background-color: #444;
}


/* Separador Espacial con efecto fade */

.com-separator {
	border: 0;
	height: 1px;
	background-image: -webkit-radial-gradient(circle, #e0e0e0 55%, transparent);
	background-image: radial-gradient(circle, #e0e0e0 55%, transparent);
}


/* menus desplegables del navbar */

.com-nav-dropdown-menu {
	border: 0 !important;
	border-top: 3px solid #0c0 !important;
	padding: 0.5rem;
}

.com-nav-dropdown-menu>li {
	border-bottom: 1px solid #666 !important;
}

.com-nav-dropdown-menu>li:last-child {
	border-bottom: 0 !important;
}

.com-nav-dropdown-menu>li>a {
	padding-top: 0.75rem !important;
	padding-bottom: 0.75rem !important;
	padding-left: 6px !important;
}

/* EU Logo */

@media screen and (min-width: 768px) {
	.com-eu-logo {
		float: right
	}
}

/* ------------------------------------------------------------------------- */
/*                                 Compnents                                 */
/* ------------------------------------------------------------------------- */


/* Cards */

.com-card {
	position: relative;
	transition-duration: 250ms;
	margin-top: 0.75rem;
	margin-bottom: 0.75rem;
}

.com-card:hover {
	box-shadow: 0 0 0 5px rgba(232, 232, 232, 0.75);
	transform: translateY(-0.365rem);
}

.com-card-header {
	background-color: #fff;
}

.com-card-body {
	padding: 1rem;
	background-color: #f0f0f0;
	overflow-y: hidden;
}

.com-card-footer {
	text-align: right;
	padding: 1rem;
	background-color: #f0f0f0;
}

@media (min-width: 576px) {
	.com-card-columns {
		-webkit-column-count: 3;
		-moz-column-count: 3;
		-ms-column-count: 3;
		column-count: 3;
		-webkit-column-gap: 1.25rem;
		-moz-column-gap: 1.25rem;
		-ms-column-gap: 1.25rem;
		column-gap: 1.25rem;
	}
	.com-card-columns .com-card {
		display: inline-block;
	}
}



/* modal message accept legal  */

.vxc-marketing-popup-wrapper .iframeViewerContainer {
	height: 60vh;
	margin: 0;
	max-width: none;
	overflow: scroll;
	width: 100%;
}

.vxc-marketing-popup-wrapper .iframeViewerContainer .iframeViewer {
	height: 60vh;
	margin: 0;
	width: 100%;
}


/* Configurator */


/* .com-config modal modifier class */

.com-config .modal-dialog {
	height: 100vh;
	margin: 0;
	max-width: none;
	overflow: hidden;
	width: 100%;
}

.com-config .modal-content {
	background-color: #fff;
	color: #333;
}

.com-config .modal-body {
	padding-top: 0;
}

.com-config-sidebar {
	height: 100vh;
	overflow-y: auto;
	padding-left: 15px;
	padding-right: 15px;
}

.com-config-main {
	border-left: 1px solid #eee;
	padding-left: 15px;
	padding-right: 15px;
}

.com-config-header {
	border-bottom: 1px solid #eee;
	position: relative;
}

.com-config-tab-content {
	height: calc(100vh - 7.75rem);
	overflow-y: auto;
}

.com-config-img {
	cursor: pointer;
	position: relative;
}

.com-config-img.active:before {
	display: block;
	position: absolute;
	bottom: 0;
	right: 0;
	padding: 1rem;
	content: url('../cms/images/interfaz/tick.svg');
	color: #090;
	font-size: 2rem;
	line-height: 2rem;
	z-index: 1;
}

@media (min-width: 768px) {
	.com-config-sidebar,
	.com-config-main {
		float: left;
	}
	.com-config-sidebar {
		width: 290px;
	}
	.com-config-main {
		width: calc(100% - 290px);
	}
}

/* Plans */

.com-hero-plans {
	padding: 5rem 0;
	background: url('../cms/images/plans/plansHero-sm.jpg') center / cover no-repeat #eee;
}

@media screen and (min-width: 768px) {
	.com-hero-plans {
		padding: 8rem 0;
		background: url('../cms/images/plans/plansHero-md.jpg') center / cover no-repeat #eee;
	}
}

@media screen and (min-width: 1200px) {
	.com-hero-plans {
		padding: 12rem 0;
		background: url('../cms/images/plans/plansHero-xl.jpg') center / cover no-repeat #eee;
	}
}

.com-hero-plans .com-hero-title-wrapper {
	position: static;
	display: inline-block;
}

.com-list-plans .list-group-item:first-child {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.com-list-plans .list-group-item:last-child {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

/* .com-table-plans {} */
.com-list-plans .light,
.com-table-plans tbody {
	background-color: #f1f1f0;
}

.com-list-plans .dark,
.com-table-plans tr.dark {
	background-color: #e8e8e8;
}

.com-table-plans > tbody > tr > td:first-child {
	padding-left: 2rem;
}

.com-bg-services {
	background-color: #4cae32
}

.com-bg-standalone {
	background-color: #176d94
}

.com-bg-franchise {
	background-color: #cf4b61
}

.com-icon-services svg {
	fill: #4cae32
}

.com-icon-standalone svg {
	fill: #176d94
}

.com-icon-franchise svg {
	fill: #cf4b61
}

/* ------------------------------------------------------------------------- */
/*                             Pages                                         */
/* ------------------------------------------------------------------------- */


/* Contact Page */

.com-page-contact-header {
	color: #fff;
	background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url('../cms/images/contact/contactBg.jpg') center / cover no-repeat #292929;
}


/* About Page */

.com-contact-bg {
	background: #ebebeb;
	padding: 1rem;
}

@media screen and (min-width: 768px) {
	.com-contact-bg {
		padding: 3rem 4rem;
	}
}

.com-about-hero {
	background: url('../cms/images/about/headerBg.jpg') center / cover no-repeat #eee;
	background-attachment: fixed;
}

.com-about-subtitle {
	color: rgba(255, 255, 255, 0.52);
}

.com-about-hero-overlay {
	background-color: rgba(41, 41, 41, 0.9);
	max-width: 695px;
}

.com-about-logos {
	background-color: #eee;
	box-shadow: 0 0 3px;
}

.com-about-cta {
	background: url('../cms/images/contact/contactBg.jpg') center / cover no-repeat #292929;
	background-attachment: fixed;
	color: white;
}

.com-about-cta-overlay {
	background-color: rgba(41, 41, 41, 0.9);
	max-width: 1440px;
}


/* Education Page */

.com-education-title {
	color: #222;
	border-left: 3px solid #093;
	padding-left: 12px;
}

.com-education-subtitle {
	color: #444;
	border-bottom: 1px dotted #ccc;
	font-weight: 600;
}

.com-education-desc {
	font-size: 13px;
	margin-bottom: 15px;
}

.com_education_list {
	padding-left: 15px;
	margin-bottom: 30px;
}

.com-education-list-item {
	list-style: inside;
}


/*  Product Detail */

.com-product-header {
	padding-top: 1rem;
	padding-right: 3rem;
}

.com-product-title {
	font-size: 1.25rem;
	font-weight: 400;
	font-family: 'Roboto';
	line-height: 2;
}

.com-product-subtitle {
	font-size: 1.1rem;
	font-weight: normal;
	margin-top: -5px;
}


/* ------------------------------------------------------------------------- */
/*                            Theme & Helpers                                */
/* ------------------------------------------------------------------------- */

.com-theme-dark {
	background: #292929;
	color: #cbcbcb;
}

.com-theme-dark a {
	color: #cbcbcb;
}

.com-white {
	color: #fff;
	text-shadow: 3px 3px 3px rgba(0, 0, 0, 0.3);
}

.com-ornament {
	background-color: #ccc;
	height: 3px;
	width: 60px;
}

.com-ornament-primary {
	background-color: #0c0;
	height: 3px;
	width: 60px;
}

.bordered-bottom {
	border-bottom: 1px dotted #ccc;
}

.text-white {
	color: #fff !important;
}

.text-sm {
	font-size: 1.175rem;
	line-height: 1.5;
}


/* extend queries to 1600 with xl infix */

@media (min-width: 1600px) {
	.visible-lg-block {
		display: none !important;
	}
	.visible-xl-block {
		display: block !important;
	}
	.col-xl-3 {
		float: left;
		width: 25%;
	}
}

/* ---------------------------------------------------------- */
/*              ionicapp styles & Overides                    */
/* ---------------------------------------------------------- */

.positive,
a.positive,
.button.button-positive.button-clear,
.tab-item.activated.tab-item-positive,
.tab-item.active.tab-item-positive,
.tab-item.tab-item-active.tab-item-positive {
	color: #459d3a;
}

.ionic .checkbox input:checked+.checkbox-icon:before,
.ionic .checkbox input:checked:before {
	background: #459d3a;
	border-color: #459d3a;
}

.button.button-positive {
	background-color: #459d3a;
}

.button.button-positive.activated,
.button.button-positive.active {
	background-color: #377b2e;
}

.button.button-positive.button-clear.activated,
.button.button-positive.button-clear.active {
	color: white;
	opacity: 1;
}

.ionic .vx-steps li.current>* {
	color: #459d3a;
}

.ionic .vx-steps.text-top li.visited>*::before,
.ionic .vx-steps.text-top li.current>*::before,
.ionic .vx-steps.text-bottom li.visited>*::before,
.ionic .vx-steps.text-bottom li.current>*::before {
	background-color: #459d3a;
}

.ionic .vx-steps li.visited::after {
	background-color: #459d3a;
}

.tf-item-icn.positive-bg {
	background: #459d3a;
}