/*
	Theme Name: Masajes
	Author: Arn
	Version: 1.1
*/

/* 3rd party packages */

/*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */

/**
	* 1. Change the default font family in all browsers (opinionated).
	* 2. Correct the line height in all browsers.
	* 3. Prevent adjustments of font size after orientation changes in
	*    IE on Windows Phone and in iOS.
*/


.msj-menu{
	display: flex;
	justify-content: center;
	padding: 0px 0;
	margin: 0;
	flex-direction: row; 
	
font-size: 15px}
.msj-menu li{
    list-style: none;
	font-size: 15px
    /* margin: 0 15px; */
}
.slider img{
    /* width: 100%; */
    display: block;
    margin: auto;
    display: none;
    /* height: 80vh; */
}
.slider{
	
	width: 100%; 
	height: 100%;
/* 	background-image: url('/wp-content/themes/masajes-theme/images/escarlata_cabecera-3.webp');   */
	background-image: url('/wp-content/uploads/2023/03/imagen_fondo.jpg');  
	background-position:  center;
	/* mix-blend-mode: luminosity; */
	position: relative; 
	background-size: content ;
	background-repeat: no-repeat; 
	/*min-height: 80vh*/ ;
	display: block;
	background-size: contain !important;
/* 	padding-top: 112%; */
	padding-top: 629px;
}
.slider-container{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);  
}

color: black;
}

.slider h1{
    text-align: center;
    font-size: xxx-large;
    /* background-color: #000000b5; */
    padding: 10px 30px;
}
:root {
    --msj-bg: #472973;
}

html{
    scroll-behavior: smooth;
}

body{
	
}
hr{
    background-color: #ff0299;
}

.thanks{
    text-align: center;
    padding: 15vh 0;
}

.sub{
    border-bottom: solid #8bfc90;
    width: fit-content;
    padding-bottom: 5px;
    margin-bottom: 3vh;
}

.massage-picture{}
.massage-picture img{
/*     object-fit: cover;
    max-height: 40vh;
    width: 100%; */
	object-fit: contain;
    max-height: 40vh;
    width: auto;
    border: solid 2px #eb7f58;
    margin: 0 auto;
    display: block;
}

.msj-home h1{
    border-bottom: solid;
    width: max-content;
    margin: auto;
    border-bottom: solid #8bfc90;
} 

.msj-fade{
	background: rgb(24,4,45);
	background: linear-gradient(180deg, rgba(24,4,45,1) 0%, rgba(24,4,45,0) 25%);  
}

.current-page{
    /* background-color: #feb062!important; */
    border: solid 2px #feb062;
} 

.submit{
    background-color: #331158!important;
    width: 100%;
}  

input, textarea{
    border-radius: 0px!important;
    outline: none;
    border: solid 2px #ff0299!important;
    background-color: #fff;
}  

.sticky-column{
    position: sticky;
    top: 10%;
}

.masseur {
    width: 24%;
    /* min-height: 80vh; */
    /* height: 100%; */
    /* height: fit-content; */
    /* display: flex; */
    /* flex-direction: column; */
    /* justify-content: space-around; */
    margin: 0 1% 1% 0;
    border: solid 4px #ff0299;
    padding: 1%;
    background-color: #2f0f548a;
    -webkit-box-shadow: 2px 2px 10px 2px #4a4a4a;
    box-shadow: 2px 2px 10px 2px #00000047;
    align-self: stretch;
    /* flex: 1; */
    position: relative;
}

.masseur::hover{}


.map-container{}
.map-container iframe{
    width: 100%;
}

.trans{
	-webkit-transition: all 150ms ease-in-out;
    -moz-transition: all 150ms ease-in-out;
    -ms-transition: all 150ms ease-in-out;
    -o-transition: all 150ms ease-in-out;
    transition: all 150ms ease-in-out;
}

.header-bg{
    width: 100%;
    height: 100%;
    background-color: #4b1365d4;
    position: absolute;
    top: 0;
    z-index: -1;
    left: 0;
    /* mix-blend-mode: unset; */
}

.inner-links{
    font-family: 'Manrope';
    color: #fff;
    border: solid 2px #ff0299;
    padding: 10px;
}

.inner-links:hover{
    border: solid 2px #fb10a8;
    background-color: #fff!important;
    text-decoration: none;
    color: #fe0086;
}

.place-holder{
    width: 100%;
    /* height: 95%; */
    margin-bottom: 10px;
}

.slider img{
    /* width: 100%; */
    display: block;
    margin: auto;
    display: none;
    /* height: 80vh; */
}

.slider-container{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);    
}

.slider-container h1{
    
	text-align: center;
    
	font-size: x-large;
    
	background-color: #f3f3f3;
    
	padding: 10px 30px;
    
	/* width: max-content; */
    
	color: black;
}

.slider h1{
    text-align: center;
    font-size: xxx-large;
    /* background-color: #000000b5; */
    padding: 10px 30px;
}

/*.slider{background-image: url('/wp-content/themes/masajes-theme/images/04.webp');   background-position: center;position: relative;}*/

#msj-body{
    /* background-image: url('images/06.svg'); */
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 5;
    z-index: -1;
    opacity: 0.1;
}

body {
    background: linear-gradient(180deg, hsl(267deg 70% 18%), #36135d, #380c6d);
    background-size: 600% 600%;
    -webkit-animation: AnimationName 10s ease infinite;
    -moz-animation: AnimationName 10s ease infinite;
    animation: AnimationName 10s ease infinite;
}

@-webkit-keyframes AnimationName {
    0%{background-position:52% 0%}
    50%{background-position:49% 100%}
    100%{background-position:52% 0%}
}
@-moz-keyframes AnimationName {
    0%{background-position:52% 0%}
    50%{background-position:49% 100%}
    100%{background-position:52% 0%}
}
@keyframes AnimationName {
    0%{background-position:52% 0%}
    50%{background-position:49% 100%}
    100%{background-position:52% 0%}
}
/*
	@-webkit-keyframes AnimationName {
    0%{background-position:52% 0%}
    50%{background-position:49% 100%}
    100%{background-position:52% 0%}
	}
	@-moz-keyframes AnimationName {
    0%{background-position:52% 0%}
    50%{background-position:49% 100%}
    100%{background-position:52% 0%}
	}
	@keyframes AnimationName {
    0%{background-position:52% 0%}
    50%{background-position:49% 100%}
    100%{background-position:52% 0%}
	}
*/

.msj{
    max-height: 70vh;
    overflow: hidden;
    margin-bottom: 7%;
    position: relative;
    -webkit-box-shadow: 2px 2px 10px 2px #4A4A4A;
    box-shadow: 2px 2px 10px 2px #00000047;
}
.msj img{
    width: 100%;
    object-fit: cover;
    max-height: 55vh;
}

.section-text{
    width: 70%;
}

main{
    min-height: 100vh;
}
header{
    /*background-color: var(--msj-bg);*/
    border-bottom: solid 2px #ff0099;
    position: sticky;
    top: 0;
    z-index: 200;
    /* background-color: #4b1265; */
}
footer{
    
	background-color: #ffffff;
    
	border-top: solid 1px #ff0099;
    
	padding: 10vh 0;
}

h1{
    font-family: 'Playfair';
    color: hsl(0deg 0% 98%);
}

h2{
    font-family: 'Playfair';
    color: hsl(0deg 0% 98%);
}

h3{
    font-family: 'Manrope';
    color: hsl(0deg 0% 98%);
}

h4{
    font-family: 'Manrope';
    color: hsl(0deg 0% 98%);
}

h5{
    font-family: 'Playfair';
    color: hsl(273deg 75% 16%);
}

footer p, footer li{
    color: #8e8e8e;
}

footer a{
    color: #ff0299!important;
    text-decoration: underline;
}

footer ul{
    padding: 0;
}
footer li{
    list-style: none;
    font-family: 'Manrope';
}
.massage-row{
    display: flex;
    flex-flow: wrap;
    justify-content: center;
}

.massage-row:after {
	/* content: ""; */
	/* flex: 0 1 30%; */
}

.massage{
    width: 30%;
    display: flex;
    flex-direction: column;
    /*justify-content: space-between;*/
    margin: 0 3% 3% 0;
    border: solid 4px #ff0299;
    padding: 2%;
    background-color: #2f0f548a;
    -webkit-box-shadow: 2px 2px 10px 2px #4A4A4A;
    box-shadow: 2px 2px 10px 2px #00000047;
}
.massage .description{
    /* width: 50%; */
    padding-right: 5%;
    /* display: flex; */
    /* flex-direction: column; */
    /* justify-content: space-between; */
    /* height: -webkit-fill-available; */
}
.massage-picture{
    /* width: 100%; */
    /* height: 80%; */
    margin-bottom: 20px;
/*     border: solid 2px #eb7f58; */
}

.msj-prices-container{
    text-align: center;
    margin: 25px 0;
}

.msj-prices{
    display: flex;
    justify-content: center;
}

.msj-prices p{
    padding-right: 10px;
    border-right: solid 1px #8bfc90;
    padding-left: 10px;
    text-align: center;
}
.pedi-prices p{
	font-size:25px;
}

.msj-prices p:last-child{
    border-right: none;
}



.msj video{
    height: 80vh;
}

.contact-stripe a{
    display: block;
    margin:auto;
    text-align: center;
    font-family: 'Manrope';
    color: #ffffff;
    width: fit-content;
    border: solid 3px #ff0299;
    /* border-radius: 40px; */
    padding: 10px 22px;
    -webkit-transition: all 150ms ease-in-out;
    -moz-transition: all 150ms ease-in-out;
    -ms-transition: all 150ms ease-in-out;
    -o-transition: all 150ms ease-in-out;
    transition: all 150ms ease-in-out;
}

.contact-stripe a:hover{
    text-decoration: none;
    background-color: #fff;
    color: #2c0943;
    border: solid 3px #952992;
}

.contact-stripe{
    display: block;
    margin: auto;
    /* flex-direction: column; */
    justify-content: center;
    padding: 5vh;
    background: #252525;
    /* width: fit-content; */
    border-top: solid 2px #ff0299;
}
.contact-stripe a{
}

.msj-card-info h3{
    font-family: 'Playfair';
    color: hsl(0deg 0% 98%);
    border-bottom: solid #7dffc5;
    padding-bottom: 8px;
}

.center-text{
    text-align: center;
    width: 50%;
    margin: auto;
}
.extra-pad{
    padding: 10vh 0;
}

.msj-card-info-container{
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    background-color: #9a37dde0;
    border: solid 4px #a249d7;
    bottom: 0;
    -webkit-transition: all 500ms ease-in-out;
    -moz-transition: all 500ms ease-in-out;
    -ms-transition: all 500ms ease-in-out;
    -o-transition: all 500ms ease-in-out;
    transition: all 500ms ease-in-out;
}

.msj-card-info-container p{
    opacity: 0;
    /* font-weight: bold; */
    font-size: 15px;
    /* display: none; */
}

.msj-card-info-container a{
    opacity: 0;
    font-family: 'Manrope';
    border: solid 2px;
    padding: 10px 15px;
    /* border-radius: 39px; */
    /* background-color: #ffffff66; */
    border: solid 3px #ff459f;
    margin-right: 5px;
    -webkit-transition: all 150ms ease-in-out;
    -moz-transition: all 150ms ease-in-out;
    -ms-transition: all 150ms ease-in-out;
    -o-transition: all 150ms ease-in-out;
    transition: all 150ms ease-in-out;
}

.action-buttons-container-visible a {
    font-family: 'Manrope';
    color: #fff;
    padding: 10px 15px;
    border-radius: 39px;
    /* background-color: #ffffff; */
    border: solid 2px #ff459f;
    /* margin-right: 5px; */
    -webkit-transition: all 150ms ease-in-out;
    -moz-transition: all 150ms ease-in-out;
    -ms-transition: all 150ms ease-in-out;
    -o-transition: all 150ms ease-in-out;
    transition: all 150ms ease-in-out;
    width: 100%;
}

.action-buttons-container a:hover{
    color: #fff!important;
    background-color: #2d0942;
    border: solid 3px #2d0942;
    text-decoration: none;
}


.msj-card-info-container:hover{
	background-color: #83088e00;
}

.msj-card-info-container:hover h3{color: #2d0942;border-bottom: solid #ff45a0;}

.msj-card-info-container:hover p{color: black;opacity: 1;display: block;}
.msj-card-info-container:hover a{color: #000000;opacity: 1;margin-bottom: 10px;}

.msj-card-info-container:hover .msj-card-info{background-color: #ffffffbd;bottom: 0;transform: translate(0,0);}

.msj-card-info{
    padding: 10%;
    position: absolute;
    bottom: 0%;
    width: 100%;
    transform: translate(0, 50%);
    -webkit-transition: all 500ms ease-in-out;
    -moz-transition: all 500ms ease-in-out;
    -ms-transition: all 500ms ease-in-out;
    -o-transition: all 500ms ease-in-out;
    transition: all 500ms ease-in-out;
}

.msj-container{
    padding: 0px 9%;
    /* background: rgb(24,4,45); */
    /* background: linear-gradient(180deg, rgb(24 4 45) 0%, rgba(24,4,45,0) 25%); */
}

.pattern{
    background-image: url('/wp-content/themes/masajes-theme/images/palms_pattern.svg');
    background-size: 30%;
    /* background-color: #16042a; */
}

.pattern-white{
    background-image: url('/wp-content/themes/masajes-theme/images/palms_pattern_white.svg');
    background-size: 30%;
    /* background: rgb(105,105,105); */
    /* background-color: #16042a; */
    background-attachment: fixed;
}



.msj-main-logo{
    /* display: block; */
    /* margin: auto; */
    height: 10vh;
    width: auto;
}
.msj-menu{display: flex;justify-content: center;padding: 0px 0;margin: 0;flex-direction: row;}
.msj-menu li{
    list-style: none;
    /* margin: 0 15px; */
}
p{
    font-family: 'Manrope', sans-serif;
    color:#fff;
    font-size: medium;
    text-align: left;
}

.msj-menu li a{
    font-family: 'Manrope', sans-serif;
    color: #fff;
}

.msj-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 15vh;
}


.hvr-shutter-out-horizontal {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgb(0 0 0 / 0%);
    position: relative;
    background: #e1e1e1;
    -webkit-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
}


/*------------------------------
	Reservas
-------------------------------*/

.ea-standard{
	margin-left:auto;
	margin-right:auto;
	background-color:rgb(255,255,255,0);
	color:white;
	max-width:420px !important;
	width:auto !important;
}
.ea-standard .disabled .block{
	opacity:0.4 !important;
}
.ea-standard .step{
	text-align:center;
	margin-top:10px;
	
}
.ea-standard .step select{
	width: 80% !important;
	text-align: center !important;	
}
.ea-standard .time-value:hover{
	background-color:#000 !important;
}
.ea-standard .calendar{
	padding-top:10px;
	
}
.ea-standard .step a.time-value{
	
	color:white;
}

.ui-datepicker th{
	color:white !important;
}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default{
	background:none !important;
	color:white !important;
}
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {
    background: green !important;
	color:white !important;
	text-align:center !important;
}
.ea-standard .time-value:focus{
	background-color:green !important;
}

.ea-label{
	display:block !important;
	text-align:center !important;
}
.ea-standard .step label{
	width:100% !important;
	padding:0 !important;
	font-size: 22px !important;
}
.ea-standard .final label{
	
	font-size: 16px !important;
}
.ui-datepicker-inline{
	background:none !important;
}
.ea-standard .final label{
	text-align:left !important;
}
.ea-standard .final label{
	margin-top:0px !important;
	margin-bottom:0px !important;
	display:block !important;
}
.ea-standard .final input{
	width:100% !important;
	margin-top:0px !important;
	margin-bottom:10px !important;
}
.ea-standard .final small{
	margin-bottom:20px;
}
input, textarea{
	border:none !important;
}
.ea-standard .step input {
	height:38px;
}

#booking-overview{
	padding-top: 0px;
	margin-bottom:20px !important;	
}

#booking-overview table{
	width:100% !important;
}

.ea-btn{
	border: solid 2px #fb10a8 !important;
	background: none !important;
	Color: white !important;
	padding: 5px 20px !important;
}
.ea-standard .section {
    color: #6ef76e !important;
	font-size:17px;
}

.ea-standard #booking-overview .ea-label{
	text-align:left !important;
}

.ea-standard h4{
	color:#6ef76e !important;
	font-size:24px !important;
	font-weight:700 !important;
}

.hvr-shutter-out-horizontal:hover, .hvr-shutter-out-horizontal:focus, .hvr-shutter-out-horizontal:active {
    color: white;
}


[class^="hvr-"] {
    margin: .4em;
    padding: 1em;
    cursor: pointer;
    background: #ffffff00;
    text-decoration: none;
    color: #666;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.hvr-shutter-out-horizontal:hover:before, .hvr-shutter-out-horizontal:focus:before, .hvr-shutter-out-horizontal:active:before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
}

.hvr-shutter-out-horizontal:before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: hsl(30deg 99% 69%);
    /* border: solid; */
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

@font-face {
	font-family: Playfair;
	src: url('fonts/PlayfairDisplay-BoldItalic.ttf');
}

.masseurs-picture{
	width: 100%;
	height: 60vh;
	margin-bottom: 20px;
	border: solid 2px #eb7f58;
	position: relative;
	/* margin: 0; */
	background-color: #fff;
}

.masseurs-picture img{
    object-fit: cover;
    height: 100%;
    position: absolute;
    width: 100%;
    top: 0;
    opacity: 0;
    
}
.masseur h2, .masseur p{
    text-align: center;
    display: block;
    margin: 0 auto 20px auto;
}

.masseurs-picture img:first-child{
    z-index: 1;
}

.masseurs-picture img:first-child{
	animation-name: currentImage;
	animation-duration: 1s;
	opacity: 1;
}

@keyframes currentImage {
	0%   {opacity: 0;}
	100%   {opacity: 1;}
}

section{
    padding: 6vh 0px;
}

.action-buttons-container{
    
	display: flex;
    
	flex-wrap: nowrap;
    
	flex-direction: row;
    
	justify-content: center;
}

.masseur nav{
    position: absolute;
    z-index: 5;
    width: 90%;
    padding: 10%;
    display: flex;
    justify-content: space-between;
    top: calc(50vh - 25vh);
}

.bb,.ff{
    width: 35px;
    height:auto;
}
.ff{
    transform: rotate(180deg);
}
/*----------------------------------------------------------------------------------------------------------------*/
@media (min-width: 800px) and (max-width: 1400px) {
	
	.masseur nav{
		position: absolute;
		z-index: 5;
		width: 90%;
		padding: 10%;
		display: flex;
		justify-content: space-between;
		top: calc(50vh - 30vh);
	}
	
	.bb,.ff{
		width: 35px;
		height:auto;
	}
	.ff{
		transform: rotate(180deg);
	}
	
	
	.masseurs-picture {
		width: 100%;
		height: 50vh;
		margin-bottom: 20px;
		border: solid 2px #eb7f58;
		position: relative;
		/* margin: 0; */
	}
	
	.masseur {
		width: 33%;
		/* min-height: 100%; */
		/* height: fit-content; */
		/* display: flex; */
		/* flex-direction: column; */
		/* justify-content: space-around; */
		margin: 0 1% 1% 0;
		border: solid 4px #ff0299;
		padding: 1%;
		background-color: #2f0f548a;
		-webkit-box-shadow: 2px 2px 10px 2px #4a4a4a;
		box-shadow: 2px 2px 10px 2px #00000047;
		align-self: stretch;
	}
	
	[class^="hvr-"] {
		margin: .4em;
		padding: 1em;
		cursor: pointer;
		background: #ffffff00;
		text-decoration: none;
		color: #666;
		-webkit-tap-highlight-color: rgba(0,0,0,0);
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}
	
	
	.sub{
		border-bottom: solid #8bfc90;
		width: fit-content;
		padding-bottom: 5px;
		margin-bottom: 5vh;
	}
	
	.msj-home h1{
		border-bottom: solid;
		width: max-content;
		margin: auto;
		border-bottom: solid #8bfc90;
	} 
	
	.msj-fade{
		background: rgb(24,4,45);
		background: linear-gradient(180deg, rgba(24,4,45,1) 0%, rgba(24,4,45,0) 25%);  
	}
	
	.current-page{
		/* background-color: #feb062!important; */
		border: solid 2px #feb062;
	} 
	
	.submit{
		background-color: #331158!important;
		width: 100%;
	}  
	
	input, textarea{
		border-radius: 0px!important;
		outline: none;
		/*border: solid 2px #ff0299;*/
		background-color: #fff;
	}  
	
	.sticky-column{
		position: sticky;
		top: 10%;
	}
	
	.map-container{}
	.map-container iframe{
		width: 100%;
	}
	
	.trans{
		-webkit-transition: all 150ms ease-in-out;
		-moz-transition: all 150ms ease-in-out;
		-ms-transition: all 150ms ease-in-out;
		-o-transition: all 150ms ease-in-out;
		transition: all 150ms ease-in-out;
	}
	
	.header-bg{
		width: 100%;
		height: 100%;
		background-color: #391365d4;
		position: absolute;
		top: 0;
		z-index: -1;
		left: 0;
		/* mix-blend-mode: unset; */
	}
	
	.inner-links{
		font-family: 'Manrope';
		color: #fff;
		border: solid 2px #ff0299;
		padding: 10px;
	}
	
	.inner-links:hover{
		border: solid 2px #fb10a8;
		background-color: #fff!important;
		text-decoration: none;
		color: #fe0086;
	}
	
	.place-holder{
		width: 100%;
		max-height: 45vh;
		margin-bottom: 10px;
	}
	.slider img{
		/* width: 100%; */
		display: block;
		margin: auto;
		display: none;
		/* height: 80vh; */
	}
	
	.slider-container{
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);    
	}
    
	color: black;
}

.slider h1{
    text-align: center;
    font-size: xxx-large;
    /* background-color: #000000b5; */
    padding: 10px 30px;
}



#msj-body{
    /* background-image: url('images/06.svg'); */
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 5;
    z-index: -1;
    opacity: 0.1;
}

body {
    background: linear-gradient(180deg, hsl(267deg 70% 18%), #36135d, #380c6d);
    background-size: 600% 600%;
    -webkit-animation: AnimationName 10s ease infinite;
    -moz-animation: AnimationName 10s ease infinite;
    animation: AnimationName 10s ease infinite;
}

@-webkit-keyframes AnimationName {
    0%{background-position:52% 0%}
    50%{background-position:49% 100%}
    100%{background-position:52% 0%}
}
@-moz-keyframes AnimationName {
    0%{background-position:52% 0%}
    50%{background-position:49% 100%}
    100%{background-position:52% 0%}
}
@keyframes AnimationName {
    0%{background-position:52% 0%}
    50%{background-position:49% 100%}
    100%{background-position:52% 0%}
}
/*
	@-webkit-keyframes AnimationName {
    0%{background-position:52% 0%}
    50%{background-position:49% 100%}
    100%{background-position:52% 0%}
	}
	@-moz-keyframes AnimationName {
    0%{background-position:52% 0%}
    50%{background-position:49% 100%}
    100%{background-position:52% 0%}
	}
	@keyframes AnimationName {
    0%{background-position:52% 0%}
    50%{background-position:49% 100%}
    100%{background-position:52% 0%}
	}
*/

.msj{
    max-height: 70vh;
    overflow: hidden;
    margin-bottom: 10%;
    position: relative;
    -webkit-box-shadow: 2px 2px 10px 2px #4A4A4A;
    box-shadow: 2px 2px 10px 2px #00000047;
}
.msj img{
    width: 100%;
    object-fit: cover;
    max-height: 65vh;
}

.section-text{
    width: 70%;
}

main{
    min-height: 100vh;
}
header{
    /*background-color: var(--msj-bg);*/
    border-bottom: solid 2px #ff0099;
    position: sticky;
    top: 0;
    z-index: 200;
    /* background-color: #4b1265; */
}
footer{
    
	background-color: #ffffff;
    
	border-top: solid 1px #ff0099;
    
	padding: 10vh 0;
}

h1{
    font-family: 'Playfair';
    color: hsl(0deg 0% 98%);
}

h2{
    font-family: 'Playfair';
    color: hsl(0deg 0% 98%);
}

h3{
    font-family: 'Manrope';
    color: hsl(0deg 0% 98%);
}

h4{
    font-family: 'Manrope';
    color: hsl(0deg 0% 98%);
}

h5{
    font-family: 'Playfair';
    color: hsl(273deg 75% 16%);
}

footer p, footer li{
    color: #8e8e8e;
}

footer a{
    color: #ff0299!important;
    text-decoration: underline;
}

footer ul{
    padding: 0;
}
footer li{
    list-style: none;
    font-family: 'Manrope';
}
.massage-row{
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
}

.massage-row:after {
	/* content: ""; */
	/* flex: 0 1 30%; */
}

.massage{
    width: 47%;
    /* display: flex; */
    margin: 0 3% 3% 0;
    border: solid 4px #ff0299;
    padding: 2% 2% 5% 2%;
    background-color: #2f0f548a;
    -webkit-box-shadow: 2px 2px 10px 2px #4A4A4A;
    box-shadow: 2px 2px 10px 2px #00000047;
}
.massage .description{
    /* width: 50%; */
    padding-right: 5%;
}
.massage-picture{
    /* width: 50%; */
}

.msj-prices-container{
    text-align: center;
}

.msj-prices{
    display: flex;
    justify-content: center;
}

.msj-prices p{
    padding-right: 10px;
    border-right: solid 1px #8bfc90;
    padding-left: 10px;
}

.msj-prices p:last-child{
    border-right: none;
}



.msj video{
    height: 80vh;
}

.contact-stripe a{
    display: block;
    margin:auto;
    text-align: center;
    font-family: 'Manrope';
    color: #ffffff;
    width: fit-content;
    border: solid 3px #ff0299;
    /* border-radius: 40px; */
    padding: 10px 22px;
    -webkit-transition: all 150ms ease-in-out;
    -moz-transition: all 150ms ease-in-out;
    -ms-transition: all 150ms ease-in-out;
    -o-transition: all 150ms ease-in-out;
    transition: all 150ms ease-in-out;
}

.contact-stripe a:hover{
    text-decoration: none;
    background-color: #fff;
    color: #2c0943;
    border: solid 3px #952992;
}

.contact-stripe{
    display: block;
    margin: auto;
    /* flex-direction: column; */
    justify-content: center;
    padding: 5vh;
    /* background: #252525; */
    /* width: fit-content; */
    border-top: solid 2px #ff0299;
}
.contact-stripe a{
}

.msj-card-info h3{
    font-family: 'Playfair';
    color: hsl(0deg 0% 98%);
    border-bottom: solid #7dffc5;
    padding-bottom: 8px;
}

.center-text{
    text-align: center;
    width: 80%;
    margin: auto;
}
.extra-pad{
    padding: 10vh 0;
}

.msj-card-info-container{
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    background-color: #9a37dde0;
    border: solid 4px #a249d7;
    bottom: 0;
    -webkit-transition: all 500ms ease-in-out;
    -moz-transition: all 500ms ease-in-out;
    -ms-transition: all 500ms ease-in-out;
    -o-transition: all 500ms ease-in-out;
    transition: all 500ms ease-in-out;
}

.msj-card-info-container p{
    opacity: 0;
    /* font-weight: bold; */
    font-size: 15px;
    /* display: none; */
}

.msj-card-info-container a{
    opacity: 0;
    font-family: 'Manrope';
    border: solid 2px;
    padding: 10px 15px;
    /* border-radius: 39px; */
    /* background-color: #ffffff66; */
    border: solid 3px #ff459f;
    margin-right: 5px;
    -webkit-transition: all 150ms ease-in-out;
    -moz-transition: all 150ms ease-in-out;
    -ms-transition: all 150ms ease-in-out;
    -o-transition: all 150ms ease-in-out;
    transition: all 150ms ease-in-out;
}

.action-buttons-container-visible a {
    font-family: 'Manrope';
    color: #fff;
    padding: 10px 15px;
    border-radius: 39px;
    /* background-color: #ffffff; */
    border: solid 2px #ff459f;
    /* margin-right: 5px; */
    -webkit-transition: all 150ms ease-in-out;
    -moz-transition: all 150ms ease-in-out;
    -ms-transition: all 150ms ease-in-out;
    -o-transition: all 150ms ease-in-out;
    transition: all 150ms ease-in-out;
    width: 100%;
}

.action-buttons-container a:hover{
    color: #fff!important;
    background-color: #2d0942;
    border: solid 3px #2d0942;
    text-decoration: none;
}


.msj-card-info-container:hover{
	background-color: #83088e00;
}

.msj-card-info-container:hover h3{color: #2d0942;border-bottom: solid #ff45a0;}

.msj-card-info-container:hover p{color: black;opacity: 1;display: block;}
.msj-card-info-container:hover a{color: #000000;opacity: 1;margin-bottom: 10px;width: 100%;text-align: center;/* background-color: #ffffffa3; */}

.msj-card-info-container:hover .msj-card-info{background-color: #ffffffbd;bottom: 0;transform: translate(0,0);}

.msj-card-info{
    padding: 10%;
    position: absolute;
    bottom: 0%;
    width: 100%;
    transform: translate(0, 65%);
    -webkit-transition: all 500ms ease-in-out;
    -moz-transition: all 500ms ease-in-out;
    -ms-transition: all 500ms ease-in-out;
    -o-transition: all 500ms ease-in-out;
    transition: all 500ms ease-in-out;
}

.msj-container{
    padding: 0px 9%;
    /* background: rgb(24,4,45); */
    /* background: linear-gradient(180deg, rgb(24 4 45) 0%, rgba(24,4,45,0) 25%); */
}

.pattern{
    background-image: url('/wp-content/themes/masajes-theme/images/palms_pattern.svg');
    background-size: 30%;
    /* background-color: #16042a; */
}

.msj-main-logo{
    /* width: 148px; */
    /* display: block; */
    height: 11vh;
    width: auto;
    /* margin: auto; */
}
.msj-menu{display: flex;justify-content: center;padding: 10px 0;flex-direction: row;}
.msj-menu li{
    list-style: none;
    /* margin: 0 15px; */
}
p{
    font-family: 'Manrope', sans-serif;
    color:#fff;
    font-size: medium;
    line-height: initial;
}

.msj-menu li a{
    font-family: 'Manrope', sans-serif;
    color: #fff;
	
}

.msj-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 12vh;
}


.hvr-shutter-out-horizontal {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgb(0 0 0 / 0%);
    position: relative;
    background: #e1e1e1;
    -webkit-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
}


.hvr-shutter-out-horizontal:hover, .hvr-shutter-out-horizontal:focus, .hvr-shutter-out-horizontal:active {
    color: white;
}


[class^="hvr-"] {
    margin: .4em;
    padding: 1em;
    cursor: pointer;
    background: #ffffff00;
    text-decoration: none;
    color: #666;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

[class^="hvr-"] {
    margin: .4em;
    padding: 9px;
    cursor: pointer;
    background: #ffffff00;
    text-decoration: none;
    color: #666;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.hvr-shutter-out-horizontal:hover:before, .hvr-shutter-out-horizontal:focus:before, .hvr-shutter-out-horizontal:active:before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
}

.hvr-shutter-out-horizontal:before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: hsl(30deg 99% 69%);
    /* border: solid; */
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

@font-face {
	font-family: Playfair;
	src: url('fonts/PlayfairDisplay-BoldItalic.ttf');
}

section{
    padding: 6vh 0px;
}

.action-buttons-container{
    
	display: flex;
    
	flex-wrap: nowrap;
    
	flex-direction: row;
    
	justify-content: center;
}

}

.langs-list{
    display: inline;
	float: left;
    margin: 0;
    align-items: left;
}
.langs-list li{
    list-style: none;
    filter: grayscale(1);
    opacity: 0.5;
}

.langs-list li:hover{
    filter: none!important;
    opacity: 1!important;
}

.langs-list a{}
.langs-list img{width: 70px;margin-left: 10px; }
.lang-selected{
    filter: none!important;
    opacity: 1!important;
}

.super-header{
    display: flex;
    justify-content: flex-end;
    align-items: center;
    background-color: #290c4687;
    padding-top: 5px;
    padding-bottom: 5px;
    border-bottom: solid 2px #4a1266;
}
.super-header a{
    color: #fff;
    font-family: 'Manrope';
    font-size: small;
    margin-left: 15px;
    text-decoration: underline;
}

.super-header a img {
    width: 30px;
    margin-right: 5px;
}

.msj-disclaimer{
    /* position: sticky; */
    bottom: 0vh;
    width: 100%;
    /* background-color: #1d0530; */
    padding-top: 30px;
    padding-bottom: 10px;
    /* border-top: solid 2px #8bfc90; */
    z-index: 100;
}
.msj-disclaimer p{
    font-size: small;
    text-align: center;
    margin: 0;
}

.msj-footer-logo{
    width: 80%;
    margin-bottom: 20px;
}
.special-offer{
    text-align: center;
}
.special-offer h1{display: block;margin: auto;}
.special-offer h2{
    font-size: 5rem;
}
.special-offer h3{
    color: #8bfc90;
}
.before{
    text-decoration: line-through;
    color: #fff;
}
.now{
    font-weight: bold;
    font-size: larger;
}

.column-img{
    /* width: 80%; */
    /* height: auto; */
    /* object-fit: contain; */
    /* margin-bottom: 20px; */
    width: 80%;
    height: 70vh;
    object-fit: cover;
    margin-bottom: 20px;
    border: solid 3px #feb062;
}

.sep{
    color: #fff;
    margin: 0 0 0 12px;
    display: block;
}
.myIcon{
    display: inline;
}
/*----------------------------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 350px) {
    .special-offer{}
    .special-offer h1{}
    .special-offer h2{}
    .special-offer h3{}
	
    .super-header {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: center;
		background-color: #290c4687;
		padding-top: 5px!important;
		padding-bottom: 5px!important;
		border-bottom: solid 2px #4a1266;
	}
	
    .super-header a{
		margin-bottom: 5px;
	}
}
@media only screen and (max-width: 350px) {
	.super-header {
		display: block;
	}
}
@media only screen and (max-width: 800px) {
	
	.column-img {
		width: 100%;
		height: 50vh;
		object-fit: cover;
		margin-bottom: 20px;
		border: solid 3px #feb062;
	}
	.sep{display: none;}
	.myIcon{display: none;}
	
	.masseur nav{
		position: absolute;
		z-index: 5;
		width: 90%;
		padding: 10%;
		display: flex;
		justify-content: space-between;
		top: calc(50vh - 30vh);
	}
	
	.bb,.ff{
		width: 35px;
		height:auto;
	}
	.ff{
		transform: rotate(180deg);
	}
	
	.special-offer{}
    .special-offer h1{}
    .special-offer h2{
		font-size: 4rem;
	}
    .special-offer h3{}
	
	.msj-disclaimer{
		padding-top: 10px!important;
		padding-bottom: 10px!important;
	}
    .msj-disclaimer p{}
	
    .langs-list{
		padding: 0;
		margin-left: 0vw;
	}
	.langs-list li{}
	
	.langs-list a{
		margin-left: 5px!important;
	}
	.langs-list img{}
	.lang-selected{}
	
	.super-header a {
		color: #fff;
		font-family: 'Manrope';
		font-size: small;
		margin-left: 0vw;
		text-decoration: underline;
		display: flex;
		align-items: center;
	}
	
	.super-header a img{
		width: 20px;
		margin-right: 5px;
	}
	
	.super-header {
		display: flex;
		justify-content: space-around;
		align-items: center;
		background-color: #290c4687;
		padding-top: 0px!important;
		padding-bottom: 0px!important;
		border-bottom: solid 2px #4a1266;
		padding: 17px!important;
	}
	
	.masseur {
		width: 100%;
		height: 100vh;
		display: flex;
		flex-direction: column;
		margin: 0 0% 5% 0;
		border: solid 4px #ff0299;
		padding: 3%;
		background-color: #2f0f548a;
		-webkit-box-shadow: 2px 2px 10px 2px #4a4a4a;
		box-shadow: 2px 2px 10px 2px #00000047;
		flex: auto;
	}
	
	.masseurs-picture{
        width: 100%;
        height: 60vh;
        margin-bottom: 20px;
        border: solid 2px #eb7f58;
        position: relative;
        /* margin: 0; */
	}
	
	.masseurs-picture img{
		object-fit: cover;
		height: 100%;
		position: absolute;
		width: 100%;
		top: 0;
		left: 0;
	}
	.masseur h2, .masseur p{
		text-align: center;
		display: block;
		margin: 0 auto 20px auto;
	}
	
	.masseurs-picture img:first-child{
		z-index: 1;
	}
	
	[class*="col-"]{
		padding-bottom: 6vh;
	}
	
	.massage p, .masseur p{
	}
	
	.pattern-white {
		/* background-image: url(/wp-content/themes/masajes-theme/images/palms_pattern_white.svg); */
		/* background-size: 30%; */
		/* background: none; */
		/* background-color: #16042a; */
		/* background-attachment: fixed; */
		background-image: url(/wp-content/themes/masajes-theme/images/palms_pattern_white.svg);
		background-size: 166%;
		/* background: rgb(105,105,105); */
		background-color: #252525;
		background-attachment: fixed;
	}
	
	.msj-menu li:last-child{
		border-bottom: none;
	}
	
	.show-mobile-menu{
		left: 0!important;
	}
	
	.menu-trigger-container{
		width: 53px;
		height: 53px;
		padding: 10px;
		margin-right: 15px;
	}
	.menu-trigger-container img{}
	
	.sub{
		border-bottom: solid #8bfc90;
		width: fit-content;
		padding-bottom: 5px;
		margin-bottom: 5vh;
	}
	
	.msj-home h1{
		border-bottom: solid;
		width: auto;
		margin: auto;
		padding-bottom: 10px;
		border-bottom: solid #8bfc90;
	} 
	
	.msj-fade{
		background: rgb(24,4,45);
		background: linear-gradient(180deg, rgba(24,4,45,1) 0%, rgba(24,4,45,0) 25%);  
	}
	
	.current-page{
		/* background-color: #feb062!important; */
		border: solid 2px #feb062;
	} 
	
	.submit{
		background-color: #331158!important;
		width: 100%;
	}  
	
	input, textarea{
		border-radius: 0px!important;
		outline: none;
		/*border: solid 2px #ff0299!important;*/
		background-color: #fff;
	}  
	
	.sticky-column{
		position: sticky;
		top: 10%;
	}
	
	.map-container{}
	.map-container iframe{
		width: 100%;
	}
	
	.mobile-menu-active{
		/* background-color: #ffffff30; */
		border: solid 2px #feb062;
	}
	
	.trans{
		-webkit-transition: all 150ms ease-in-out;
		-moz-transition: all 150ms ease-in-out;
		-ms-transition: all 150ms ease-in-out;
		-o-transition: all 150ms ease-in-out;
		transition: all 150ms ease-in-out;
	}
	
	.header-bg{
		width: 100%;
		height: 100%;
		background-color: #391365d4;
		position: absolute;
		top: 0;
		z-index: -1;
		left: 0;
		/* mix-blend-mode: unset; */
	}
	
	.inner-links{
		font-family: 'Manrope';
		color: #fff;
		border: solid 3px #ff0299;
		padding: 10px;
		width: 100%;
		width: 100%;
		display: block;
	}
	
	.inner-links:hover{
		border: solid 2px #fb10a8;
		background-color: #fff!important;
		text-decoration: none;
		color: #fe0086;
	}
	
	.place-holder{
		width: 100%;
		max-height: 45vh;
		margin-bottom: 10px;
	}
	
	.slider img{
		/* width: 100%; */
		display: block;
		margin: auto;
		display: none;
		/* height: 80vh; */
	}
	
	.slider-container{
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);    
	}
	
	.slider-container h1{
		
		text-align: center;
		
		font-size: x-large;
		
		background-color: #f3f3f3;
		
		padding: 10px 30px;
		
		/* width: max-content; */
		
		color: black;
	}
	
	.slider h1{
		text-align: center;
		font-size: xxx-large;
		/* background-color: #000000b5; */
		padding: 10px 30px;
	}
	
	.slider{
		padding-top: 112%;
		width: 100%;
		background-image: url('/wp-content/themes/masajes-theme/images/escarlata_cabecera-3.webp');  background-position:  relative;/* mix-blend-mode: luminosity; */position: relative; background-size: cover  ;background-repeat: no-repeat; /*min-height: 20vh;*/
	display: block}
	
	#msj-body{
		/* background-image: url('images/06.svg'); */
		width: 100vw;
		height: 100vh;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 5;
		z-index: -1;
		opacity: 0.1;
	}
	
	body {
		background: linear-gradient(180deg, hsl(267deg 70% 18%), #36135d, #380c6d);
		background-size: 600% 600%;
		-webkit-animation: AnimationName 10s ease infinite;
		-moz-animation: AnimationName 10s ease infinite;
		animation: AnimationName 10s ease infinite;
	}
	
	@-webkit-keyframes AnimationName {
		0%{background-position:52% 0%}
		50%{background-position:49% 100%}
		100%{background-position:52% 0%}
	}
	@-moz-keyframes AnimationName {
		0%{background-position:52% 0%}
		50%{background-position:49% 100%}
		100%{background-position:52% 0%}
	}
	@keyframes AnimationName {
		0%{background-position:52% 0%}
		50%{background-position:49% 100%}
		100%{background-position:52% 0%}
	}
	/*
		@-webkit-keyframes AnimationName {
		0%{background-position:52% 0%}
		50%{background-position:49% 100%}
		100%{background-position:52% 0%}
		}
		@-moz-keyframes AnimationName {
		0%{background-position:52% 0%}
		50%{background-position:49% 100%}
		100%{background-position:52% 0%}
		}
		@keyframes AnimationName {
		0%{background-position:52% 0%}
		50%{background-position:49% 100%}
		100%{background-position:52% 0%}
		}
	*/
	
	.msj{
		max-height: 70vh;
		overflow: hidden;
		margin-bottom: 7%;
		position: relative;
		-webkit-box-shadow: 2px 2px 10px 2px #4A4A4A;
		box-shadow: 2px 2px 10px 2px #00000047;
	}
	.msj img{
		width: 100%;
		object-fit: cover;
		max-height: 65vh;
	}
	
	.section-text{
		width: 70%;
	}
	
	main{
		min-height: 100vh;
	}
	header{
		/*background-color: var(--msj-bg);*/
		border-bottom: solid 2px #ff0099;
		position: sticky;
		top: 0;
		z-index: 200;
		/* background-color: #4b1265; */
	}
	footer{
		
		background-color: #ffffff;
		
		border-top: solid 1px #ff0099;
		
		padding: 10vh 0;
	}
	
	h1{
		font-family: 'Playfair';
		color: hsl(0deg 0% 98%);
	}
	
	h2{
		font-family: 'Playfair';
		color: hsl(0deg 0% 98%);
	}
	
	h3{
		font-family: 'Manrope';
		color: hsl(0deg 0% 98%);
	}
	
	h4{
		font-family: 'Manrope';
		color: hsl(0deg 0% 98%);
	}
	
	h5{
		font-family: 'Playfair';
		color: hsl(273deg 75% 16%);
	}
	
	footer p, footer li{
		color: #8e8e8e;
		text-align: center;
	}
	
	footer a{
		color: #ff0299!important;
		text-decoration: underline;
	}
	
	footer ul{
		padding: 0;
	}
	footer li{
		list-style: none;
		font-family: 'Manrope';
	}
	.massage-row{
		display: flex;
		flex-flow: row wrap;
		justify-content: center;
	}
	
	.massage-row:after {
		/* content: ""; */
		/* flex: 0 1 30%; */
	}
	
	.massage{
		width: 100%;
		/* display: flex; */
		margin: 0 0% 5% 0;
		border: solid 4px #ff0299;
		padding: 5% 5% 5% 5%;
		background-color: #2f0f548a;
		-webkit-box-shadow: 2px 2px 10px 2px #4A4A4A;
		box-shadow: 2px 2px 10px 2px #00000047;
	}
	.massage .description{
		/* width: 50%; */
		padding-right: 5%;
	}
	.massage-picture{
		/* width: 50%; */
	}
	
	.msj-prices-container{
		text-align: center;
	}
	
	.msj-prices{
		display: flex;
		justify-content: center;
		margin-bottom: 20px;
	}
	
	.msj-prices p{
		padding-right: 10px;
		border-right: solid 1px #8bfc90;
		padding-left: 10px;
	}
	
	.msj-prices p:last-child{
		border-right: none;
	}
	
	
	
	.msj video{
		height: 80vh;
	}
	
	.contact-stripe a{
		display: block;
		margin:auto;
		text-align: center;
		font-family: 'Manrope';
		color: #ffffff;
		width: fit-content;
		border: solid 3px #ff0299;
		/* border-radius: 40px; */
		padding: 10px 22px;
		-webkit-transition: all 150ms ease-in-out;
		-moz-transition: all 150ms ease-in-out;
		-ms-transition: all 150ms ease-in-out;
		-o-transition: all 150ms ease-in-out;
		transition: all 150ms ease-in-out;
	}
	
	.contact-stripe a:hover{
		text-decoration: none;
		background-color: #fff;
		color: #2c0943;
		border: solid 3px #952992;
	}
	
	.contact-stripe{
		display: block;
		margin: auto;
		/* flex-direction: column; */
		justify-content: center;
		padding: 5vh;
		/* background: #252525; */
		/* width: fit-content; */
		border-top: solid 2px #ff0299;
	}
	.contact-stripe a{
	}
	
	.msj-card-info h3{
		font-family: 'Playfair';
		color: hsl(0deg 0% 98%);
		border-bottom: solid #7dffc5;
		padding-bottom: 8px;
	}
	
	.center-text{
		text-align: center;
		width: 100%;
		margin: auto;
	}
	.extra-pad{
		padding: 5vh 0;
	}
	
	.msj-card-info-container{
		position: absolute;
		z-index: 1;
		width: 100%;
		height: 100%;
		background-color: #9a37dde0;
		border: solid 4px #a249d7;
		bottom: 0;
		-webkit-transition: all 500ms ease-in-out;
		-moz-transition: all 500ms ease-in-out;
		-ms-transition: all 500ms ease-in-out;
		-o-transition: all 500ms ease-in-out;
		transition: all 500ms ease-in-out;
	}
	
	.msj-card-info-container p{
		opacity: 0;
		/* font-weight: bold; */
		font-size: 15px;
		/* display: none; */
	}
	
	.msj-card-info-container a{
		opacity: 0;
		font-family: 'Manrope';
		border: solid 2px;
		padding: 10px 15px;
		/* border-radius: 39px; */
		/* background-color: #ffffff66; */
		border: solid 3px #ff459f;
		margin-right: 5px;
		-webkit-transition: all 150ms ease-in-out;
		-moz-transition: all 150ms ease-in-out;
		-ms-transition: all 150ms ease-in-out;
		-o-transition: all 150ms ease-in-out;
		transition: all 150ms ease-in-out;
	}
	
	.action-buttons-container-visible a {
		font-family: 'Manrope';
		color: #fff;
		padding: 10px 15px;
		border-radius: 39px;
		/* background-color: #ffffff; */
		border: solid 2px #ff459f;
		/* margin-right: 5px; */
		-webkit-transition: all 150ms ease-in-out;
		-moz-transition: all 150ms ease-in-out;
		-ms-transition: all 150ms ease-in-out;
		-o-transition: all 150ms ease-in-out;
		transition: all 150ms ease-in-out;
		width: 100%;
	}
	
	.action-buttons-container a:hover{
		color: #fff!important;
		background-color: #2d0942;
		border: solid 3px #2d0942;
		text-decoration: none;
	}
	
	
	.msj-card-info-container:hover{
		background-color: #83088e00;
	}
	
	.msj-card-info-container:hover h3{color: #2d0942;border-bottom: solid #ff45a0;}
	
	.msj-card-info-container:hover p{color: black;opacity: 1;display: block;}
	.msj-card-info-container:hover a{color: #000000;opacity: 1;margin-bottom: 10px;width: 100%;text-align: center;/* background-color: #ffffffa3; */}
	
	.msj-card-info-container:hover .msj-card-info{background-color: #ffffffbd;bottom: 0;transform: translate(0,0);}
	
	.msj-card-info{
		padding: 10%;
		position: absolute;
		bottom: 0%;
		width: 100%;
		transform: translate(0, 65%);
		-webkit-transition: all 500ms ease-in-out;
		-moz-transition: all 500ms ease-in-out;
		-ms-transition: all 500ms ease-in-out;
		-o-transition: all 500ms ease-in-out;
		transition: all 500ms ease-in-out;
	}
	
	.msj-container{
		padding: 0px 6.3%;
		/* background: rgb(24,4,45); */
		/* background: linear-gradient(180deg, rgb(24 4 45) 0%, rgba(24,4,45,0) 25%); */
		text-align: center;
	}
	
	.pattern{
		background-image: url('/wp-content/themes/masajes-theme/images/palms_pattern.svg');
		background-size: 200%;
		/* background-color: #16042a; */
	}
	
	.msj-main-logo{
		/* width: 148px; */
		/* display: block; */
		/* margin: auto; */
	}
	.msj-menu{display: flex;justify-content: center;padding: 0;flex-direction: column;position: absolute;top: 21vh;width: 100%;left: -100%;background-color: #272727ed;border-top: solid 2px #a73aa4;z-index: -1;border-bottom: solid 2px #a73aa4;-webkit-transition: all 150ms ease-in-out;-moz-transition: all 150ms ease-in-out;-ms-transition: all 150ms ease-in-out;-o-transition: all 150ms ease-in-out;transition: all 200ms ease-in-out;}
	.msj-menu li{
		list-style: none;
		/* margin: 0 15px; */
		text-align: center;
		border-bottom: solid 1px #a73aa4;
	}
	p{
		font-family: 'Manrope', sans-serif;
		color:#fff;
		font-size: medium;
		line-height: initial;
	}
	
	.msj-menu li a{
		font-family: 'Manrope', sans-serif;
		color: #fff;
		/* text-align: center; */
		width: 100%;
		margin: 0;
	}
	
	.msj-header{
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	
	
	.hvr-shutter-out-horizontal {
		display: inline-block;
		vertical-align: middle;
		-webkit-transform: perspective(1px) translateZ(0);
		transform: perspective(1px) translateZ(0);
		box-shadow: 0 0 1px rgb(0 0 0 / 0%);
		position: relative;
		background: #e1e1e1;
		-webkit-transition-property: color;
		transition-property: color;
		-webkit-transition-duration: 0.5s;
		transition-duration: 0.5s;
	}
	
	
	.hvr-shutter-out-horizontal:hover, .hvr-shutter-out-horizontal:focus, .hvr-shutter-out-horizontal:active {
		color: white;
	}
	
	
	
	[class^="hvr-"] {
		margin: .4em;
		padding: 1em;
		cursor: pointer;
		background: #ffffff00;
		text-decoration: none;
		color: #666;
		-webkit-tap-highlight-color: rgba(0,0,0,0);
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}
	
	.hvr-shutter-out-horizontal:hover:before, .hvr-shutter-out-horizontal:focus:before, .hvr-shutter-out-horizontal:active:before {
		-webkit-transform: scaleX(1);
		transform: scaleX(1);
	}
	
	.hvr-shutter-out-horizontal:before {
		content: "";
		position: absolute;
		z-index: -1;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		background: hsl(30deg 99% 69%);
		/* border: solid; */
		-webkit-transform: scaleX(0);
		transform: scaleX(0);
		-webkit-transform-origin: 50%;
		transform-origin: 50%;
		-webkit-transition-property: transform;
		transition-property: transform;
		-webkit-transition-duration: 0.5s;
		transition-duration: 0.5s;
		-webkit-transition-timing-function: ease-out;
		transition-timing-function: ease-out;
	}
	
	@font-face {
		font-family: Playfair;
		src: url('fonts/PlayfairDisplay-BoldItalic.ttf');
	}
	
	section{
		padding: 6vh 0px;
	}
	
	.action-buttons-container{
		
		display: flex;
		
		flex-wrap: wrap;
	}
	
}	

@media only screen and (max-width: 500px) {
	.super-header {
	}
}	

.address-escarlata{
	float:right;
	margin-right:40px;
	
}
.address-escarlata span{
	color:white;font-size:20px;margin-left:20px;
	
}
.address-escarlata a{
	color:#feb062;
}
@media only screen and (max-width: 500px) {
	.address-escarlata span{
		font-size:16px;
		
	}
	
}	




/*------------------------------------*\
    Side Phone - whastsapp
\*------------------------------------*/


.side-phone, .side-whastsapp {
	position: fixed;	
	width: 48%;
	text-decoration: none;
	font-size: 12px;
	color: white;
	border-radius: 50px;
	z-index:30;
	font-weight:600;
	display:none;
	text-align:center;
}
.side-phone{
	right:0;
	bottom:0;
	background-color:#ff0299;
	margin:0px 4px 4px 4px;
}
.side-whastsapp{
	left:0;
	bottom:0;
	background-color: #1fa150;
	margin:0px 4px 4px 4px;
}
.side-phone a, .side-whastsapp a, .side-phone a:hover, .side-whastsapp a:hover {
	color:#fff;
	text-decoration:none;
	font-size:16px;
}
.side-phone p, .side-whastsapp p{
	font-size: 12px;
	line-height: 0;
	
}

.side-phone:hover, .side-whastsapp:hover{
	right: 0;
}

.side-phone i, .side-whastsapp i{
	display:inline;
	font-size:27px;
	margin-right:2px;
}	

.side-phone img, .side-whastsapp img{
	display:inline;
	width:20px;
	filter: invert(100%);
	vertical-align:inherit ;
}


.side-whastsapp i{
	font-size:3px;
}	
.side-whastsapp div, .side-phone div{
	margin-top:2px;
	margin-bottom:2px;
}
.bottom-btn-bg{
	position: fixed;
	bottom: 0;
	height: 53px;
	background-color: rgba(0, 0, 0, 0.0);
	width: 100%;
	display:none;
	z-index:29;
}

@media (max-width: 767px) {

	.side-phone, .side-whastsapp {
		display:block;
	}
	.bottom-btn-bg{
		display:block;
	}
}