/* CSS Document */

* {
	margin: 0;
	padding: 0;
	border: 0;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-text-size-adjust: none;
	-ms-text-size-adjust: none;
	font-family: Gotham-Book;
	color: #333;
	outline: 0;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

/*GENERALES*/
h1 {
	font-family: Clarins;
	font-size: 8vw;
	font-weight: normal;
	text-align: center;
}
h2 {
	font-family: Clarins;
	font-size: 5.555555555555555vw;
	text-align: center;
	font-style: italic;
}
h3 {
	font-family: 'Gotham-Book';
	font-size: 3.6vw;
	text-align: center;
}
h2.heading {
	font-family: 'Gotham-Book';
	font-size: 5vw;
	font-style: normal;
}
p {
	font-size: 4vw;
	margin: 5px 0;
}
.txtCenter {
	text-align: center;
}
a {
	color: #000;
	text-decoration: none;
}
strong {
	font-weight: bold;
}

/*FORMULARIOS*/
input[type="text"], input[type="email"], input[type="tel"], select {
	width: 100%;
	background-color: #eee;
	border: 1px solid #eee;
	padding: 5px;
	font-family: Gotham-Book;
	font-size: 15px;
	color: #000000;
	height: 50px;
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
	-webkit-border-radius: 0;
	border-radius: 0;
}
select {
	background-image: url(../images/select.png);
	background-repeat: no-repeat;
	background-position: 96% center;
}
input[type="checkbox"] {
	content: url(../images/checkbox.gif);
	width: 23px;
	height: 23px;
	vertical-align: middle;
}
input[type="checkbox"]:checked {
	content: url(../images/checkbox_on.gif);
}
input[type="button"], input[type="submit"] {
	width: 100%;
	padding: 15px 30px;
	font-family: Gotham-Book;
	font-size: 4vw;
	color: #fff;
	cursor: pointer;
	text-transform: uppercase;
	-webkit-border-radius: 0;
	border-radius: 0;
}
.uiBtn.redBtn {
	background-color: #b61e27;
	background: linear-gradient(to top, #b61e27, #b61e27) repeat scroll 0 0 #b61e27;
}
.uiBtn.blackBtn {
	background-color: #000;
	background: linear-gradient(to top, #000, #000) repeat scroll 0 0 #000;
}
::-webkit-input-placeholder {
	font-family: Gotham-Book;
	color: #b3b3b3;
}
::-moz-placeholder {
	font-family: Gotham-Book;
	color: #b3b3b3;
}
:-moz-placeholder {
	font-family: Gotham-Book;
	color: #b3b3b3;
}
/*diferentes dispositivos*/
.mobile {
	display: block;
}
.desktop {
	display: none;
}
.rwd {
	width: 100%;
	max-width: 100%;
}
.corp {
	color: #be0f34!important;
}
.corp strong {
	color: #be0f34 !important;
}
.italic {
	font-style: italic
}
.uppercase {
	text-transform: uppercase;
}
.dest {
	font-size: 5.333333333333334vw;
}
.hide{ display:block;}

.corp {
	color: #3be0f34;
}
.contSVG {
	height: 0;
	width: 0;
	position: absolute;
}
/*wrapper*/
.wrapper {
	position: relative;
}
.promo {
	position: relative;
}
.promo .disabled {
	position: absolute;
	z-index: 10;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-color: rgba(255,255,255,.8);
}
.promo .disabled p {
	font-size: 17px;
	color: #fff;
	text-align: center;
}
.promo .disabled .contMsg {
	position: absolute;
	width: 300px;
	padding: 15px;
	top: 20%;
	left: calc(50% - 150px);
	background-color: rgba(182,30,39,1);
}
/*header*/
.wrapper .headerMain {
	position: relative;
}
.wrapper .headerMain .top {
	position: relative;
	background-color: #b61e27;
	padding: 2.7777777777777777%;
	text-align: center;
}
.wrapper .headerMain .logo {
	width: 57.407407407407405%;
}
.wrapper .headerMain .banner {
	width: 100%;
	max-width: 980px;
	margin: 0 auto;
	height: 43.46666666666666vw;
	background-image: url(/images/mobile/unicabyclarins.jpg);
	background-size: 100%;
}
/*main*/
.wrapper .mainCont {
	max-width: 1250px;
	margin: 0 auto;
}
.wrapper .mainCont .block {
	display: none;
	padding: 15px 0;
}
.wrapper .mainCont .block .cont {
	width: 80%;
	max-width: 1250px;
	margin: 0 auto;
	padding: 15px 0 0 0;
}
.wrapper .mainCont .block .cont p {
	text-align: center;
}
.wrapper .mainCont .block .cont fieldset .control {
	padding: 5px 0;
}
.wrapper .mainCont .block .cont fieldset .row .control.date .dateTime {
	display: flex;
}
.wrapper .mainCont .block .cont fieldset .row .control.date .dateTime> * {
	margin: 0 5px;
}
.wrapper .mainCont .block .cont fieldset .row .control.date .dateTime select:nth-of-type(1) {
	width: 15%;
}
.wrapper .mainCont .block .cont fieldset .row .control.date .dateTime select:nth-of-type(2) {
	width: 50%;
}
.wrapper .mainCont .block .cont fieldset .row .control.date .dateTime select:nth-of-type(3) {
	width: 25%;
}
.wrapper .mainCont .block .cont fieldset .control .option {
	padding: 15px 15px 0 15px;
}
.wrapper .mainCont .block .cont fieldset .control.acepto {
	font-size: 3.4666666666666663vw;
}
.wrapper .mainCont .block .cont fieldset .control.acepto label {
	vertical-align: middle;
	margin: 0 0 0 5px;
}
.wrapper .mainCont .block .cont fieldset .control.acepto .terminos {
	text-decoration: underline;
	cursor: pointer;
}
/*block-1*/
.wrapper .mainCont .block-1 {
	display: block;
}
.wrapper .mainCont .block-1 .cont figure {
	margin: 15px 0 15px 0;
}
/*block-2*/
.wrapper .mainCont .block-2 .conectate {
	width: 90%;
	max-width: 290px;
	/*display: block;
	margin: 15px auto;*/
}
.subChecks{
	margin-left:30px;
}
#suscribeteContent{
	padding:15px 25px;
	margin:10px 0px;
	display:none;
}
.mt20{
	margin-top:20px;
}
.mt30 {
	margin-top: 30px;
}
/*block-3*/
.wrapper .mainCont .block-3 .cont figure {
	margin: 30px auto;
	cursor: pointer;
}
.wrapper .mainCont .block-3 .cont figure .producto .foto {
	border: 1px solid #cacbcb;
}
.wrapper .mainCont .block-3 .cont figure .producto .sel {
	width: 22%;
	border: none;
	position: absolute;
	z-index: 2;
	top: calc(50% - 11%);
	left: calc(50% - 11%);
	display: none;
}
.wrapper .mainCont .block-3 .cont figure .producto .sel.on {
	display: block;
}
.wrapper .mainCont .block-3 .cont figure .producto.selected .foto {
	border: 1px solid #000;
}
.wrapper .mainCont .block-3 .cont figure .producto.agotado .foto {
	opacity: .4;
}
.wrapper .mainCont .block-3 .cont figure .producto .label {
	border-bottom: 1px solid #000;
	padding: 2px 0 5px 0;
	font-weight: bold;
	text-align: center;
	display: none;
}
.wrapper .mainCont .block-3 .cont figure .producto.agotado .label {
	display: block;
}
.wrapper .mainCont .block-3 .cont figure .producto {
	width: 50vw;
	max-width: 50vw;
	display: block;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	margin: 0 auto;
	position: relative;
}
.wrapper .mainCont .block-3 .cont figure figcaption {
	text-align: center;
	margin: 15px auto;
}
.wrapper .mainCont .block-3 .cont figure figcaption strong {
	font-size:18px;
	display: block;
	margin: 0 auto 10px auto;
}
.wrapper .mainCont .block-3 .cont .opciones {
	text-align: center;
	padding: 15px 0;
}
.wrapper .mainCont .block-3 .cont .opciones .uiBtn {
	display: inline-block;
	width: auto;
}
/*block-4*/
.wrapper .mainCont .block-4 .cont figure {
	margin: 30px 0 30px 0;
}
/*block-5*/
.wrapper .mainCont .block-5 {
}
.wrapper .mainCont .block-5 .cont.final {
	padding: 50px 0;
}
.wrapper .mainCont .block-5 .cont.final p {
	font-family: Clarins;
	font-size: 8vw;
	font-weight: normal;
	text-align: center;
}
/*footer*/
.wrapper footer {
	background-color: #e5e5e5;
	padding: 5vw 0;
}
.wrapper footer .followUs {
	font-size: 4vw;
	font-weight: 700;
	text-align: center;
	background-color: #e5e5e5;
}
.wrapper footer .legales ul li {
	font-size: 2.933333333333333vw;
	font-weight: 700;
	list-style: none;
	position: relative;
	padding: 2vw 0;
	cursor: pointer;
}
.wrapper footer .legales ul li:after {
	content: "__";
	position: relative;
	display: block;
	width: 100%;
	text-align: center;
}
.wrapper footer .legales ul li:last-child:after {
	content: "";
}
/*rss*/
footer .rss {
	text-align: center;
	margin: 5vw 0;
}
footer .rss a, footer .rss svg {
	position: relative;
	height: 30px;
	width: 30px;
	display: inline-block;
	margin: 4px 0;
}
footer .rss .icon {
	color: #fff;
	fill: #fff;
	border-radius: 100%;
	background: #000;
	margin: 0 2px;
	width: 40px;
	height: 40px;
}
footer .rss .icon:hover {
	-webkit-transform: scale(1.25);
	transform: scale(1.25);
	fill: #fff;
}
footer .rss .facebook:hover {
	background: #3C5A98;
}
footer .rss .twitter:hover {
	background: #2DAAE4;
}
footer .rss .instragram:hover {
	background: #ee3d8c;
}
/*COOKIES*/
.cookies {
	position: fixed;
	bottom: -50%;
	left: 0;
	width: 100%;
	opacity: 0;
	background-color: rgba(30, 42, 50, 0.96);
	z-index: 100;
	-webkit-transition: all 2ms ease-in;
	-moz-transition: all 2s ease-in;
	-ms-transition: all 2s ease-in;
	-o-transition: all 2s ease-in;
	transition: all 2s ease-in;
}
.cookies.on {
	bottom: 0;
	opacity: 1;
}
.cookies .cont {
	width: 100%;
	max-width: 1140px;
	padding: 15px;
	position: relative;
	margin: 0 auto;
}
.cookies .cont p {
	font-size: 12px;
	color: #fff;
	clear: both;
	margin: 5px auto;
	text-align: center;
}
.cookies .cont a {
	font-size: 12px;
	color: #fff;
}
.cookies .cont .cerrar {
	font-size: 15px;
	text-align: center;
	padding: 10px 15px;
	border-radius: 3px;
	box-shadow: 0 1px 1px rgba(0,0,0,.15), inset 0 0 1px rgba(30,42,50,.5);
	background-color: #ccc;
	background-image: -webkit-gradient(linear, left 0, left 100%, from(#ccc), to(#ccc));
	background-image: -webkit-linear-gradient(top, #ccc, 0, #ccc, 100%);
	background-image: -moz-linear-gradient(top, #ccc 0, #ccc 100%);
	background-image: linear-gradient(to bottom, #ccc 0, #ccc 100%);
	background-repeat: repeat-x;
	color: #000;
	text-decoration: none;
	cursor: pointer!important;
	display: block;
	margin: 5px auto;
	clear: both;
}
.cookies .cont .cerrar a {
	text-decoration: none;
}
.cookies .cont .cerrar::after {
	content: "ENTENDIDO";
}
/*mask*/
.mask {
	background-color: rgba(0,0,0,.5);
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 100;
	overflow: scroll;
	display: none;
}
.mask .wrappFixed {
	width: 100%;
	height: 100%;
	background-color: rgba(255,255,255,1);
	position: fixed;
	/*overflow: scroll;*/
	overflow-x:hidden;
	overflow-y:auto;
	padding: 10px;
}
.mask .cont {
	background-color: rgba(255,255,255,1);
	width: 100%;
	position: relative;
	height: 100%;
	padding: 40px 0;
	margin: 0 auto;
	display: none;
}
.mask .cont .top {
	width: 100%;
	top: 0;
	left: 0;
	right: 0;
	height: 50px;
	position: fixed;
	z-index: 20;
	background-color: rgba(255,255,255,1);
}
.mask .cont .close {
	position: absolute;
	top: 5px;
	right: 5px;
	width: 40px;
	height: 40px;
	background-color: #000;
	color: #fff;
	text-align: center;
	line-height: 40px;
	-webkit-border-radius: 100px;
	border-radius: 100px;
	cursor: pointer;
}
.mask .cont figure {
	margin: 10px auto;
}
.mask .cont figure .producto .foto {
	border: 1px solid #cacbcb;
}
.mask .cont figure .producto {
	width: 50vw;
	max-width: 50vw;
	display: block;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	margin: 0 auto;
	position: relative;
}
.mask .cont figure figcaption {
	text-align: center;
	margin: 5px auto;
}
.mask .cont figure figcaption strong {
	display: block;
	margin: 0 auto 10px auto;
}
.mask .cont .sabiasQue {
	width: 100%;
	display: flex;
	padding: 0 0 100px 0;
	margin: 15px auto;
  -webkit-align-content: center;
  align-content:         center;
}
.mask .cont .sabiasQue h3 {
	font-family: 'Gotham-Book';
	font-size: 4vw;
	text-align: left;
	font-weight: 900;
}
.mask .cont .sabiasQue h3 .bigger{ font-size:4.2vw}
.mask .cont .sabiasQue .ilust {
	width: 25%;
	padding: 0 0;
}
.mask .cont .sabiasQue .introText {
	width: 75%;
	text-align: left;
	padding: 10px 10px 0 10px;
	-webkit-border-radius: 15px;
	border-radius: 15px;
}
.mask .cont .sabiasQue .introText.lightBlue {
	background-color: #deebf7;
	border: 1px solid #00b0f0;
}
.mask .cont .txtBlue {
	color: #00b0f0;
}
.mask .cont .txtBeige {
	color: #bf9000;
}
.mask .cont .txtGreen{ color: #91c384;}
.mask .cont .txtRed{ color:#c00000;}

.mask .cont .txtBrown{ color:#814e38}
.mask .cont .sabiasQue .introText.lightBeige {
	background-color: #ffe699;
	border: 1px solid #bf9000;
}
/*Legal*/
.legal {
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.86);
	position: fixed;
	overflow-y: scroll;
	z-index: 100;
	top: 0;
	left: 0;
	display: none;
}
.legal .texto .top {
	position: relative;
	background-color: #b61e27;
	padding: 2.7777777777777777%;
	text-align: center;
}
.legal .texto .top .cont {
	max-width: 100%;
	margin: 0 auto;
	padding: 0;
}
.legal .texto .logo {
	width: 57.407407407407405%;
}
.legal .texto {
	width: 96%;
	position: absolute;
	margin: 0 2%;
	top: -100%;
	background-color: #fff;
	font-family: 'Gotham-Book', Arial, Helvetica, sans-serif;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	display: block;
	-webkit-transition: all 2s ease-in;
	-moz-transition: all 0.4s ease-in;
	-ms-transition: all 0.4s ease-in;
	-o-transition: all 0.4s ease-in;
	transition: all 0.4s ease-in;
}
.legal .texto .cont {
	padding: 15px 15px 65px 15px;
}
.legal .texto.on {
	top: 2%;
}
.legal .texto h2 {
	clear: both;
	font-family: 'Gotham-Book', Arial, Helvetica, sans-serif;
	color: #333;
	text-transform: uppercase;
	text-align: left;
	font-style: normal;
	margin: 0 0 10px 0;
	font-size: 14px;
}
.legal .texto p {
	clear: both;
	text-align: justify;
	color: #333;
	font-size: 12px;
	margin: 0 0 15px 0;
}
.legal .texto .opciones {
	text-align: center;
	position: absolute;
	bottom: 30px;
	width: 100%;
}
.legal .texto ul {
	margin: 15px 0 15px 30px;
	font-family: 'Gotham-Book', Arial, Helvetica, sans-serif;
	font-size: 12px;
}
.legal .texto .cerrar {
	font-weight: normal;
	text-align: center;
	clear: both;
	padding: 15px 30px;
	font-family: Gotham-Book;
	font-size: 3.2vw;
	color: #fff;
	cursor: pointer;
	text-transform: uppercase;
	-webkit-border-radius: 0;
	border-radius: 0;
	background-color: #000;
	background: linear-gradient(to top, #000, #000) repeat scroll 0 0 #000
}
/*Alert*/
.alert {
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.86);
	position: fixed;
	overflow-y: scroll;
	z-index: 100;
	top: 0;
	left: 0;
	display: none;
}
.alert .texto .cont {
	padding: 50px 0 0 0;
	font-size: 12px;
	text-align: center;
}
.alert .texto .top {
	position: relative;
	background-color: #b61e27;
}
.alert .texto .top .cont {
	max-width: 100%;
	margin: 0 auto;
	padding: 10px!important;
}
.alert .texto .logo {
	width: 57.407407407407405%;
}
.alert .texto {
	width: 90%;
	min-height: 250px;
	position: absolute;
	margin: 0 5%;
	top: -100%;
	background-color: #fff;
	font-family: 'Clarins', Arial, Helvetica, sans-serif;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	display: block;
	-webkit-transition: all 2s ease-in;
	-moz-transition: all 0.4s ease-in;
	-ms-transition: all 0.4s ease-in;
	-o-transition: all 0.4s ease-in;
	transition: all 0.4s ease-in;
}
.alert .texto.on {
	top: 2%;
}
.alert .texto .opciones {
	text-align: center;
	position: absolute;
	bottom: 40px;
	width: 100%;
}
.alert .texto .cerrar {
	font-weight: normal;
	text-align: center;
	clear: both;
	padding: 15px 30px;
	font-family: Gotham-Book;
	font-size: 3.2vw;
	color: #fff;
	cursor: pointer;
	text-transform: uppercase;
	-webkit-border-radius: 0;
	border-radius: 0;
	background-color: #000;
	background: linear-gradient(to top, #000, #000) repeat scroll 0 0 #000
}
.alert .texto h2 {
	clear: both;
	color: #333;
	text-transform: uppercase;
	margin: 0 0 10px 0;
	font-size: 12px;
}
.alert .texto p {
	clear: both;
	color: #000;
	font-size: 11px;
	margin: 0 0 5px 0;
}
#continuar {
	display: none
}
/*
==============================================
slide
==============================================
*/


.slide {
	animation-name: slide;
	-webkit-animation-name: slide;
	animation-duration: 0.5s;
	-webkit-animation-duration: 0.5s;
	animation-timing-function: ease-in-out;
	-webkit-animation-timing-function: ease-in-out;
	visibility: visible !important;
}
 @keyframes slide {
 0% {
 transform: translateX(150%);
}
 100% {
 transform: translateX(0%);
}
}
 @-webkit-keyframes slide {
 0% {
 -webkit-transform: translateX(150%);
}
 100% {
 -webkit-transform: translateX(0%);
}
}
/* Customize the label (the customCheckbox) */
.customCheckbox {
	display: block;
	position: relative;
	padding-left: 32px;
	margin-bottom: 12px;
	cursor: pointer;
	font-size: 14px;
	line-height: 24px;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
/* Hide the browser's default checkbox */
.customCheckbox input {
	position: absolute;
	opacity: 0;
	cursor: pointer;
	height: 0;
	width: 0;
}
/* Create a custom checkbox */
.customCheckbox .checkmark {
	position: absolute;
	top: 0;
	left: 0;
	height: 24px;
	width: 24px;
	background-color: #eee;
}
/* On mouse-over, add a grey background color */
.customCheckbox:hover input ~ .checkmark {
}
/* When the checkbox is checked, add a blue background */
.customCheckbox input:checked ~ .checkmark {
}
/* Create the checkmark/indicator (hidden when not checked) */
.customCheckbox .checkmark:after {
	content: "";
	position: absolute;
	display: none;
}
/* Show the checkmark when checked */
.customCheckbox input:checked ~ .checkmark:after {
	display: block;
}
/* Style the checkmark/indicator */
.customCheckbox .checkmark:after {
	left: 5px;
	top: -10px;
	width: 10px;
	height: 24px;
	border: solid #c00730;
	border-width: 0 5px 5px 0;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}
/* Customize the label (the customRadioButton) */
.customRadioButton {
	display: block;
	position: relative;
	padding-left: 32px;
	margin-bottom: 12px;
	cursor: pointer;
	font-size: 14px;
	line-height: 24px;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
/* Hide the browser's default radio button */
.customRadioButton input {
	position: absolute;
	opacity: 0;
	cursor: pointer;
	height: 0;
	width: 0;
}
/* Create a custom radio button */
.customRadioButton .checkmark {
	position: absolute;
	top: 0;
	left: 0;
	height: 26px;
	width: 26px;
	background-color: #eee;
	border-radius: 50%;
}
/* On mouse-over, add a grey background color */
.customRadioButton:hover input ~ .checkmark {
	background-color: #eee;
}
/* When the radio button is checked, add a blue background */
.customRadioButton input:checked ~ .checkmark {
	background-color: #c00730;
}
/* Create the indicator (the dot/circle - hidden when not checked) */
.customRadioButton .checkmark:after {
	content: "";
	position: absolute;
	display: none;
}
/* Show the indicator (dot/circle) when checked */
.customRadioButton input:checked ~ .checkmark:after {
	display: block;
}
/* Style the indicator (dot/circle) */
.customRadioButton .checkmark:after {
	top: 9px;
	left: 9px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: white;
}
 @media (min-width:768px) {
/*diferentes dispositivos*/
.mobile {
	display: none;
}
.desktop {
	display: block;
}
.dest {
	font-size: inherit;
}
.cookies .cont .cerrar {
	width: auto;
	display: inline-block;
	margin: 5px 46%;
}
/*FORMULARIOS*/
input[type="text"], input[type="email"], input[type="tel"], select {
	font-size: 14px;
	height: 50px;
	padding: 0 5px;
}
input[type="button"], input[type="submit"] {
	font-size: 14px;
	color: #fff;
	height: 50px;
}
/*GENERALES*/
h1 {
	font-size: 40px;
}
h3 {
	font-size: 20px;
}
h2.heading {
	font-size: 20px;
}
p {
	font-size: 16px;
	margin: 5px 0;
}
/*header*/
.wrapper .headerMain .top {
	position: relative;
	background-color: #b61e27;
	padding: 10px 0 0 0;
	height: 40px;
}
.wrapper .headerMain .logo {
	width: 57.407407407407405%;
	max-width: 178px;
}
.wrapper .headerMain .banner {
	width: 100%;
	max-width: 728px;
	margin: 0 auto;
	height: 233px;
	background-image: url(/images/tablet/unicabyclarins.jpg);
	background-size: cover;
}
/*header*/
.wrapper .headerMain .top {
	position: relative;
	background-color: #b61e27;
	padding: 10px 0 0 0;
	height: 40px;
}
.wrapper .headerMain .logo {
	width: 57.407407407407405%;
	max-width: 178px;
}
/*main cont*/
.wrapper .mainCont {
	position: relative;
	overflow: hidden;
}
.wrapper .mainCont .block .cont {
	width: 100%;
	max-width: 748px;
	margin: 0 auto;
	padding: 0 0 15px 0;
}
	.wrapper .mainCont .block-1 .cont figure {
		margin: 0 auto;
		/*tamaño para promoción*/
		/*max-width: 464px;*/
		/*tamaño para sorteo*/
		max-width: 488px;
	}
	.wrapper .mainCont .block-1 .cont fieldset {
		/*promocion*/
		/*margin: 15px auto;*/
		/*sorteo*/
		margin: 5px auto;
		max-width: 550px;
	}
	.wrapper .mainCont .block .cont fieldset {
		/*promocion*/
		/*padding: 30px 0;*/
		/*sorteo*/
		padding:  0;
	}
.wrapper .mainCont .block-2 .cont fieldset p {
	font-size: 13px
}
	.wrapper .mainCont .block .cont fieldset .row {
		margin: 0;
		overflow: hidden;
		/*promocion*/
		/*padding: 15px 0;*/
		/*sorteo*/
		padding: 5px 0;
	}
.wrapper .mainCont .block .cont fieldset .row legend {
	padding: 0 15px;
}
.wrapper .mainCont .block .cont fieldset .control {
	padding: 15px;
	display: inline-block;
	float: left;
}
.wrapper .mainCont .block .cont fieldset .control.flex {
	display: block;
	float: none;
	padding: 0 15px;
}
.wrapper .mainCont .block .cont fieldset .row .control .wrappFlex {
	display: flex;
}
.wrapper .mainCont .block .cont fieldset .row .control.date {
	padding: 0 15px 30px 15px;
}
.wrapper .mainCont .block .cont fieldset .row .control.date label {
	display: block;
	line-height: 40px;
	padding: 5px;
}
.wrapper .mainCont .block .cont fieldset .row .control.date .dateTime {
	display: flex;
	width: 65%;
}
.wrapper .mainCont .block .cont fieldset .row .control.date .dateTime > * {
	margin: 0 5px;
}
.wrapper .mainCont .block .cont fieldset .row .control .wrappFlex .label {
	width: 25%;
}
.wrapper .mainCont .block .cont fieldset .row .control .wrappFlex .options {
	width: 75%;
	display: flex;
}
.wrapper .mainCont .block .cont fieldset .row .control .wrappFlex .options> * {
	padding: 0 15px;
}
.wrapper .mainCont .block .cont fieldset .control.w5 {
	width: 5%;
}
.wrapper .mainCont .block .cont fieldset .control.w10 {
	width: 10%;
}
.wrapper .mainCont .block .cont fieldset .control.w15 {
	width: 15%;
}
.wrapper .mainCont .block .cont fieldset .control.w20 {
	width: 20%;
}
.wrapper .mainCont .block .cont fieldset .control.w30 {
	width: 30%;
}
.wrapper .mainCont .block .cont fieldset .control.w25 {
	width: 25%;
}
.wrapper .mainCont .block .cont fieldset .control.w15 {
	width: 15%;
}
.wrapper .mainCont .block .cont fieldset .control.w35 {
	width: 35%;
}
.wrapper .mainCont .block .cont fieldset .control.w40 {
	width: 40%;
}
.wrapper .mainCont .block .cont fieldset .control.w50 {
	width: 50%;
}
.wrapper .mainCont .block .cont fieldset .control.w65 {
	width: 65%;
}
.wrapper .mainCont .block .cont fieldset .control.opciones {
	padding: 30px 5px 0 5px;
	display: block;
	float: none;
	clear: both;
	text-align: center;
}
.wrapper .mainCont .block .cont fieldset .control.opciones .uiBtn {
	width: auto;
	display: block;
	margin: 0 auto;
}
.wrapper .mainCont .block .cont fieldset .control.acepto {
	font-size: 14px;
	padding: 15px 15px 0 15px;
	clear: both;
}
.wrapper .mainCont .block .cont fieldset .control.acepto label {
	vertical-align: middle;
	margin: 0 0 0 5px;
}
.wrapper .mainCont .block .cont fieldset .control.acepto .legal {
	text-decoration: underline;
}
/*block-3*/
.wrapper .mainCont .block-3 .cont .productos {
	width: 100%;
	margin: 0 auto;
	overflow: hidden;
	display: flex;
}
.wrapper .mainCont .block-3 .cont figure {
	-webkit-flex-basis: 40%;
	flex-basis: 40%;
	-webkit-align-content: space-around;
	align-content: space-around;
}
.wrapper .mainCont .block-3 .cont figure .producto .foto {
	border: 1px solid #cacbcb;
}
.wrapper .mainCont .block-3 .cont figure .producto .sel {
	width: 22%;
	border: none;
	position: absolute;
	z-index: 2;
	top: calc(50% - 11%);
	left: calc(50% - 11%);
	display: none;
}
.wrapper .mainCont .block-3 .cont figure .producto.selected .foto {
	border: 1px solid #000;
}
.wrapper .mainCont .block-3 .cont figure .producto.agotado .foto {
	opacity: .6
}
.wrapper .mainCont .block-3 .cont figure .producto .label {
	border-bottom: 1px solid #000;
	padding: 2px 0 5px 0;
	font-weight: bold;
	text-align: center;
	display: none;
}
.wrapper .mainCont .block-3 .cont figure .producto.agotado .label {
	display: block;
}
.wrapper .mainCont .block-3 .cont figure .producto {
	width: 100%;
	max-width: 100%;
	display: block;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	margin: 0 auto;
	position: relative;
}
.wrapper .mainCont .block-3 .cont figure figcaption {
	text-align: center;
	margin: 15px auto;
}
.wrapper .mainCont .block-3 .cont figure figcaption strong {
	display: block;
	margin: 0 auto 10px auto;
}
/*block-4*/
.wrapper .mainCont .block-4 .cont figure {
	margin: 30px auto;
	max-width: 570px;
}
/*block-6*/
.wrapper .mainCont .block-6 .cont.final {
	padding: 100px 0;
}
/*footer*/
.wrapper footer {
	padding: 30px 0;
}
.wrapper footer .followUs {
	font-size: 15px;
	font-weight: 700;
	text-align: center;
}
.wrapper footer .followUs {
	background-color: #e5e5e5;
}
.wrapper footer .legales ul li {
	font-size: 11px;
	font-weight: 700;
	list-style: none;
	position: relative;
	padding: 0 5px;
	display: inline-block
}
.wrapper footer .legales ul li:after {
	content: "|";
	position: static;
	display: inline;
	width: auto;
	margin: 0 0 0 10px
}
/*.wrapper footer .legales ul li:nth-child(2):after {
	color: #e5e5e5;
}*/
.wrapper footer .legales ul li:last-child {
	display: block;
	padding: 30px 0 0 0;
}
	.wrapper footer .legales ul li:nth-child(3):after {
		content: "";
	}
.wrapper footer .legales ul li:last-child:after {
	content: "";
}
/*rss*/
footer .rss {
	text-align: center;
	margin: 15px 0;
}
 ./*Legal*/
.legal {
overflow-y:scroll;
}
.legal::-webkit-scrollbar {
width: 1px;
}
.legal .texto {
	width: 50%;
	min-height: 300px;
	position: absolute;
	margin: 0 25%;
}
.legal .texto .top {
	padding: 10px 0 0 10px;
	height: 40px;
}
.legal .texto .logo {
	width: 57.407407407407405%;
	max-width: 178px;
}
.legal .texto {
	width: 70%;
	position: absolute;
	margin: 0 15%;
}
.legal .texto .cerrar {
	width: 15%;
	font-size: 14px;
}
.legal .texto h2 {
	font-size: 18px;
	font-weight: bold;
	text-align: left;
	margin: 30px 0 0 0;
}
.legal .texto p {
	font-size: 14px;
	line-height: 20px;
	margin: 10px 0 10px 0;
}
.legal .texto ul li {
	font-size: 14px;
	line-height: 20px;
	margin: 0 0 0 30px;
}
 ./*Alert*/
.alert {
overflow-y:scroll;
}
.alert::-webkit-scrollbar {
width: 1px;
}
.alert .texto {
	width: 50%;
	min-height: 300px;
	position: absolute;
	margin: 0 25%;
}
.alert .texto .logo {
	width: 57.407407407407405%;
	max-width: 178px;
}
.alert .texto .cerrar {
	width: 15%;
	font-size: 14px;
}
.alert .texto h2 {
	font-size: 18px;
	font-weight: bold;
	text-align: left;
	margin: 30px 0 0 0;
}
.alert .texto p {
	font-size: 14px;
	line-height: 20px;
	margin: 10px 0 10px 0;
}
.alert .texto ul li {
	font-size: 14px;
	line-height: 20px;
	margin: 0 0 0 30px;
}
.mask .cont .wrappFlex {
	display: flex;
	width: 90%;
	margin: 0 auto;
	-webkit-justify-content: space-around;
	justify-content: space-around;
}
	.mask .cont .wrappFlex > * {
		/*width: 44%;*/
	flex:1;
	margin:30px;
	}
.mask .cont figure .producto {
	width: 100%;
	max-width: 100%;
	display: block;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	margin: 0 auto;
	position: relative;
}
/*sabiasQue*/
.mask .cont .sabiasQue {
	width: 100%;
	display: inline;
	padding: 0;
	margin: 15px auto;
}
.mask .cont .sabiasQue h3 {
	font-family: 'Gotham-Book';
	font-size: 20px;
	text-align: left;
	font-weight: 900;
}
.mask .cont .sabiasQue .ilust {
	width: 20%;
	padding: 15px 0 15px 15px;
	float: left;
}
.mask .cont .sabiasQue .introText {
	float: left;
	width: 80%;
	padding: 15px;
	margin: 15px 0 0 0;
}
/*ANIMATIONS*/

/*
==============================================
slide
==============================================
*/


.slide {
	animation-name: slide;
	-webkit-animation-name: slide;
	animation-duration: 1s;
	-webkit-animation-duration: 1s;
	animation-timing-function: ease;
	-webkit-animation-timing-function: ease;
	visibility: visible !important;
}
 @keyframes slide {
 0% {
 transform: translateY(100%);
}
 100% {
 transform: translateY(0%);
}
}
 @-webkit-keyframes slide {
 0% {
 -webkit-transform: translateY(100%);
}
 100% {
 -webkit-transform: translateY(0%);
}
}
}
 @media (min-width:980px) {
/*header*/

.wrapper .headerMain .banner {
	max-width: 1250px;
	height: 400px;
	background-image: url(/images/desktop/unicabyclarins.jpg);
	background-size: cover;
}
	.wrapper .mainCont .block .cont {
		/*promoción*/
		/*max-width: 1000px;*/
		/*sorteo*/
		max-width: 900px;
	}
.wrapper .mainCont .block-3 .cont figure {
	-webkit-flex-basis: 30%;
	flex-basis: 30%;
	-webkit-align-content: space-around;
	align-content: space-around;
}
/*mask*/
.mask {
	background-color: rgba(0,0,0,.5);
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 100;
	overflow: hidden;
	display: none;
}
.mask .cont {
	background-color: transparent;
	width: 750px;
	position: absolute;
	top: 1%;
	left: calc(50% - 325px);
	margin: 0 auto;
	display: none;
	text-align: center;
	padding: 0;
	height: 100%;
}
.mask .cont .top {
	background-color: transparent;
	width: 750px!important;
	left: auto;
	right: auto;
	top: auto;
	padding: 0;
	position: fixed;
	margin: -20px 0 0 -20px;
}
.mask .wrappFixed {
	width: 750px;
	height: 100%;
	padding: 30px 15px 15px 15px;
}
/* width */
.mask .wrappFixed::-webkit-scrollbar {
 width: 0;
}

/* Track */
.mask .wrappFixed::-webkit-scrollbar-track {
 box-shadow: inset 0 0 5px grey;
 border-radius: 10px;
}
 
/* Handle */
.mask .wrappFixed::-webkit-scrollbar-thumb {
 background:#ccc;
}

/* Handle on hover */
.mask .wrappFixed::-webkit-scrollbar-thumb:hover {
 background: #ccc;
}
.mask .cont .productos {
	width: 550px;
	margin: 0 auto;
	overflow: hidden;
}
.mask .cont figure .producto .foto {
	border: 1px solid #cacbcb;
}
.mask .cont figure .producto {
	width: 230px;
	max-width: 230px;
	display: block;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	margin: 0 auto;
	position: relative;
}
.mask .cont figure figcaption {
	text-align: center;
	margin: 15px auto;
	padding: 15px;
}
.mask .cont figure figcaption p {
	font-size: 14px;
}
.mask .cont figure figcaption strong {
	display: block;
	margin: 0 auto 10px auto;
}
.mask .cont .control.opciones {
	padding: 0 5px;
	display: block;
	float: none;
	clear: both;
	text-align: center;
}
.mask .cont .control.opciones .uiBtn {
	width: auto;
	display: block;
	margin: 0 auto;
}
.mask .cont figure .producto {
	-webkit-border-radius: 3px;
	border-radius: 3px;
	margin: 0 auto;
	position: relative;
}
.mask .cont figure figcaption {
	text-align: center;
	margin: 5px auto;
}
.mask .cont figure figcaption strong {
	display: block;
	margin: 0 auto 10px auto;
}
.mask .cont .sabiasQue {
	margin: 0 auto;
	padding: 0 30px;
}
.mask .cont .sabiasQue h3 {
	font-size: 20px;
}
}
/*easing*/
.easing {
	-webkit-transition: all 800ms cubic-bezier(0.095, 0.435, 0.000, 0.960);
	-moz-transition: all 800ms cubic-bezier(0.095, 0.435, 0.000, 0.960);
	-o-transition: all 800ms cubic-bezier(0.095, 0.435, 0.000, 0.960);
	transition: all 800ms cubic-bezier(0.095, 0.435, 0.000, 0.960);
}


/*#block-3 p.corp {display:none;}*/

.column{
	display:flex;
	flex-direction:column;
}

.text-left{
	text-align:left!important;
}
.text-center{
	text-align:center;
}

.mask .cont .wrappFlex > * {
	width: auto !important;
}

.linkunderline{
	text-decoration:underline;
}

.rowLoginRedes{
	display:flex;
	flex-direction:row;
	grid-gap:20px;
	justify-content:center;
	align-items:center;
	flex-wrap:wrap;
	margin-top:20px;
	margin-bottom:20px;
}