@font-face{ font-family: "ChronicaPro"; src: url("../fonts/chronicapro-heavy.otf"); }
@font-face{ font-family: "CenturyGothic"; src: url("../fonts/CenturyGothic-01.otf"); }

:root {
	--color-pink: #fb5373;
	--color-purple: #6872f4;
	--color-gray-light: #f4f4f4;
	--color-gray-hard: #4e4e58;
}
/*=============================================================================
GENERAL
=============================================================================*/
body { overflow-x: hidden; position: relative; font-family: "CenturyGothic"; }
html { overflow-x: hidden; }
*::-moz-selection { background: var(--color-purple); color: #FFF; text-shadow: none; }
*::selection { background: var(--color-purple); color: #FFF; text-shadow: none; }
.bg-gray-light { background-color: var(--color-gray-light); }
.bg-gray-hard { background-color: var(--color-gray-hard); }
.bg-pink { background-color: var(--color-pink); }
.bg-purple { background-color: var(--color-purple); }

.text-black { color: #000; }
.text-pink { color: var(--color-pink); }
.text-purple { color: var(--color-purple); }

.bg-cover-index {
	background-image: url("http://placehold.it/1920x1080");
}

.font-chronicapro, .btn { font-family: "ChronicaPro"; }

.no-scroll { overflow: hidden !important; }
.small-text { font-size: 13px; }
.fc-custom {
	border-radius: 0;
	border-top: unset;
	border-left: unset;
	border-right: unset;
	border-bottom: 1px solid #b2b2b2;
}

.btn-white {
	background-color: #FFF;
	border: 1px solid transparent;
}

.btn-white.pink {
	color: var(--color-pink);
	border-color: var(--color-pink);
}
.btn-white.pink:hover,
.btn-white.pink:active,
.btn-white.pink:focus {
	color: #FFF;
	background-color: var(--color-pink);
}

.btn-pink {
	color: #FFF;
	background-color: var(--color-pink);
	border: 1px solid var(--color-pink);
}
.btn-pink:hover,
.btn-pink:active,
.btn-pink:focus {
	color: #FFF;
	background-color: var(--color-purple);
	border-color: var(--color-purple);
}
/*=============================================================================
THANKS PAGE
=============================================================================*/
.thanks-page { height: 80vh; min-height: 300px; }
/*.thanks-page img { width: 400px; max-width: 100%; }*/
/*=============================================================================
NAVBAR
=============================================================================*/
.navbar {
	background-color: var(--color-gray-light) !important;
	margin-bottom: 0;
	border: none;
	border-radius: 0;
}
/* colores items menu */
.navbar-light .navbar-nav .active > .nav-link,
.navbar-light .navbar-nav .nav-link.active,
.navbar-light .navbar-nav .nav-link.show,
.navbar-light .navbar-nav .show > .nav-link,
.navbar-light .navbar-nav .nav-link {
	color: #333;
	border-bottom: 2px solid transparent;
}
.navbar-light .navbar-nav .active .nav-link,
.navbar-light .navbar-nav .nav-link:focus,
.navbar-light .navbar-nav .nav-link:hover {
	color: var(--color-pink);
	border-color: transparent;
}
/* colores items menu */
/* separación items menu */
.navbar-nav > .nav-item {
	padding-left: 15px;
	padding-right: 15px;
}
/* separación items menu */
.navbar-brand img { width: 150px; }
.nav-item.nav-pink .nav-link { color: var(--color-pink) !important; }
.nav-item.nav-pink .nav-link:hover { color: var(--color-purple) !important; }
.nav-item.nav-btn { padding: .5rem; }
.nav-item.nav-btn .nav-link {
	color: #FFF;
	font-family: "ChronicaPro";
	background-color: var(--color-pink);
	padding: 4px 14px;
	border: 1px solid var(--color-pink) !important;
}
.nav-item.nav-btn .nav-link:hover,
.nav-item.nav-btn .nav-link:focus {
	color: var(--color-pink);
	background-color: #FFF;
}
/*=============================================================================
HOME
=============================================================================*/
.spacer { height: 215px; }
.spacer-2 { height: 115px; }
.form-container {
	background-color: #FFF;
	border-radius: 20px;
	-webkit-box-shadow: 5px 5px 31px -7px rgba(0,0,0,0.45);
	        box-shadow: 5px 5px 31px -7px rgba(0,0,0,0.45);
}
.form-main-container { bottom: -100px; position: relative; z-index: 10; }
.img-tyto-prods { position: absolute; bottom: -100px; }
.number-badge {
	width: 50px;
	height: 50px;
	border-radius: 100%;
	position: relative;
	background-color: #efefef;
}
.number-badge > span {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	    -ms-transform: translate(-50%, -50%);
	        transform: translate(-50%, -50%);
}
.bg-home-video {
	--bhv: 800px;
	height: var(--bhv);
	min-height: var(--bhv);
}
.bg-home-video .video-ico-container {
	opacity: 0.7;
	-webkit-transition: .2s;
	-o-transition: .2s;
	transition: .2s;
}
.bg-home-video:hover .video-ico-container { opacity: 1; }
.bg-home-video:hover { cursor: pointer; }
.img-section-video {
	position: absolute;
	right: 0;
	bottom: -100px;
}
.modal.transparent-modal button.close { color: #FFF; opacity: 1; }
.modal.transparent-modal .modal-footer { display: none; }
.modal.transparent-modal .modal-header h5 { display: none; }
.modal.transparent-modal .modal-content,
.modal.transparent-modal .modal-header,
.modal.transparent-modal .modal-footer {
	background-color: transparent;
	border: unset;
}
.modal.transparent-modal .modal-body { padding: 0; }

.tyto-selection-spacer { height: 100px; }
.tyto-selection img {
	-webkit-transition: .2s;
	-o-transition: .2s;
	transition: .2s;
}
.tyto-selection .tyto-hover,
.tyto-selection .tyto-main { cursor: pointer; }
.tyto-selection .tyto-hover {
	padding-left: 15px;
	padding-right: 15px;
	position: absolute;
	left: 50%;
	opacity: 0;
	visibility: hidden;
	-webkit-transform: translateX(-50%);
	    -ms-transform: translateX(-50%);
	        transform: translateX(-50%);
}
/*.tyto-selection .tyto-main,*/
.tyto-selection.active .tyto-hover,
.tyto-selection:hover .tyto-hover {
	opacity: 1;
	visibility: visible;
}
.tyto-selection p { color: #acabb3; }
.tyto-selection.active p,
.tyto-selection:hover p { color: var(--color-purple); }
/*.tyto-selection:hover .tyto-main {
	opacity: 0;
	visibility: hidden;
}*/
.tyto-indicator-container {
	height: 8px;
	position: relative;
}
.tyto-indicator {
	width: 150px;
	max-width: 100%;
	height: 8px;
	left: 50%;
	position: absolute;
	background-color: transparent;
	bottom: 0;
	border-top-right-radius: 5px;
	border-top-left-radius: 5px;
	-webkit-transform: translateX(-50%);
	    -ms-transform: translateX(-50%);
	        transform: translateX(-50%);
	-webkit-transition: .2s;
	-o-transition: .2s;
	transition: .2s;
}
.tyto-indicator-container.active .tyto-indicator {
	background-color: var(--color-purple);
}
hr.tyto-tab {
	border-top: 2px solid #c2c1c7;
	margin-top: 2px;
}
.full-circle-indicators .carousel-indicators li {
	background-color: #d1d0d5;
}
.full-circle-indicators .carousel-indicators .active {
	background-color: var(--color-purple);
}
.full-circle-indicators .inner-full-circle {
	background-color: var(--color-purple);
}
#tyto-selection-carousel { padding-bottom: 35px; }
#tyto-selection-carousel .carousel-indicators { margin-bottom: 12px; }
#tyto-selection-carousel .carousel-control-next-icon {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%236872f4' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/%3e%3c/svg%3e");
}
#tyto-selection-carousel .carousel-control-prev-icon {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%236872f4' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath d='M5.25 0l-4 4 4 4 1.5-1.5L4.25 4l2.5-2.5L5.25 0z'/%3e%3c/svg%3e");
}
.badges-container > a:hover { text-decoration: unset; }
.ts-spacer-bottom { height: 100px; }
/*=============================================================================
FOOTER
=============================================================================*/
footer * { color: #FFF; font-weight: lighter; }
.copyright-text { font-size: 12px; }
.footer-link { font-size: 10px; }
.footer-link a:hover { color: #FFF !important; }
/*=============================================================================
BLOG
=============================================================================*/
.blog-play-container { height: auto !important; }
.bg-widget-cover.bg-mh {
	background-image: url("http://placehold.it/1920x500.png?text=1920x500.jpg");
	height: 500px;
}
.bg-widget-cover {
	background-position: center;
	background-size: cover;
}
.play-container { position: relative; height: 100%; }
.play-container:hover .play-ico { opacity: 1; cursor: pointer; }
.play-container:hover { cursor: pointer; }
.play-ico {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	-webkit-transition: 0.2s;
	-o-transition: 0.2s;
	transition: 0.2s;
	z-index: 1;
	opacity: 0.5;
}
.img-blog {
	min-height: 800px;
	background-image: url("../img/Blog/header.jpg");
	background-position: center;
	background-size: cover;
}
.container-blog {
  padding-right: 30px;
  padding-left: 30px;
  padding-top: 100px;
  padding-bottom: 100px;
  width: 100%;
}
.i-text {
  background: #e2dede;
  border: none;
  border-radius: 10px;
  color: #757575;
  text-align: center;
  font-size: 12px;
  padding: 10px 40px;
  margin-right: 10px;
}
.bolder { font-weight: bolder !important; }
.hr-blog {
	max-width: 15%;
	border: 1px solid #e2dede;
	-webkit-box-shadow: 0px 2px 3px #e2e2e2;
	        box-shadow: 0px 2px 3px #e2e2e2;
}
.text-intblog { width: 100%; position: absolute; bottom: 10px; }
.btn-blog {
	width: 100%;
  background: black;
  border: none;
  font-weight: 100;
  font-family: sans-serif;
  color: #fff;
}
.btn-blog2 {
  background: black;
  border: none;
  font-weight: 100;
  font-family: sans-serif;
  color: #fff;
}
.btn-blog3 {
	background: black;
  border: 1PX solid #FFF;
  font-weight: 100;
  font-family: sans-serif;
  color: #fff;
  padding: 6px 50px;
  font-size: 16px;
  -webkit-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
}
.btn-blog3:hover { color: #000; background-color: #FFF; text-decoration: none; }
.text-initblogf { position: absolute; top: 30%; left: 30%; }
.img-finalblog {
	background-image: url("../img/Blog/footer.jpg");
	background-position: center;
	background-size: cover;
}
.custom-dropdown > li > .dropdown-menu, .dropdown-child { background-color: #333; }
.dropdown-child > a { color: #FFF; }
.custom-dropdown > li > .dropdown-menu > .nav-link:hover,
.custom-dropdown > li > .dropdown-menu > .dropdown-item:hover,
.dropdown-child > a:hover { background-color: #222; }
.dropdown-child > a:hover { color: #FFF; }
/*=============================================================================
MEDIA
=============================================================================*/
/* 1920 x 1080 */
@media( max-width: 1920px ) {}

/* 1600 x 900*/
@media( max-width: 1600px ) {}

/* 1440 x 900 */
@media( max-width: 1440px ) {
	.tyto-selection-spacer { height: 20px; }
	.spacer-2 { height: 100px; }
	.ts-spacer-bottom { height: 20px; }
}

/* 1280 x 800 */
@media( max-width: 1280px ) {}

/* 990 x 1000 */
@media( max-width: 990px ) {
	.bg-home-video { height: 600px; min-height: 600px; }
	.img-section-video { width: 250px; bottom: -80px; right: 1rem; }
}

/* 767 x 414 */
@media( max-width: 767px ) {
	.spacer { height: 0; }
	.spacer-2, .tyto-selection-spacer, .ts-spacer-bottom { height: 30px; }
	.bg-home-video { margin-top: 45px; }
	.img-tyto-prods { position: relative; margin: 0 auto; bottom: 0; }
	.form-main-container { bottom: 0; padding-left: 2rem; padding-right: 2rem; }
	.bg-home-video { height: 500px; min-height: 500px; }
	.img-section-video { display: none; }
	.tyto-selection p { font-size: 12px; }
	.tyto-indicator { width: 90px; }
	.copyright-text { font-size: 14px; }
	.footer-link { font-size: 14px; }
}

/* 576 x 320 */
@media( max-width: 576px ) {}

/* 375 x 320 */
@media( max-width: 375px ) {}
/*
	@media( max-width: 1920px ) {}
	@media( max-width: 1600px ) {}
	@media( max-width: 1440px ) {}
	@media( max-width: 1366px ) {}
	@media( max-width: 1280px ) {}
	@media( max-width: 1024px ) {}
	@media( max-width: 736px ) {}
	@media( max-width: 667px ) {}
	@media( max-width: 640px ) {}
	@media( max-width: 568px ) {}
*/
