@font-face 
{
    font-family: Gill-Sans-Regular;
    src: url(../assets/fonts/GillSansMTPro-Book.woff);
}


@font-face 
{
    font-family: Gill-Sans-Medium;
    src: url(../assets/fonts/GillSansMTPro-Medium.woff);
}

@font-face 
{
    font-family: Gill-Sans-Light;
    src: url(../assets/fonts/GillSansMTPro-Light.woff);
}

@font-face 
{
    font-family: Canela;
    src: url(../assets/fonts/Canela-Regular.otf);
}


@font-face 
{
    font-family: Montserrat-SemiBold;
    src: url(../assets/fonts/Montserrat-SemiBold.woff);
}



@media only screen and (min-width: 1200px){
	html {
		font-size: 16px !important;
	}
}

@media only screen and (min-width: 992px){
	html {
		font-size: 14.5px;
	}
}
@media only screen and (min-width: 0){
	html {
		font-size: 14px;
	}
}

.list-idiom{
	display: none;
}

.list-idiom li {
	display: none;	
	animation-duration: 350ms;
	animation-delay: calc(var(--animation-order) * 100ms);
	animation-fill-mode: both;
	animation-timing-function: ease-in-out;
	color:#FFFFFF;
	text-align: left;
	padding-left: 0.1rem;

  }

.list-idiom li:hover{
	cursor: pointer;
}

@keyframes animateIn {
	0% {
	  opacity: 0;
	  transform: scale(1) translateY(-10px);
	}
	100% {
	  opacity: 1;
	}
  }

  @keyframes animateOut {
	0% {
	  opacity: 1;
	}
	100% {
	  opacity: 0;
	  transform: scale(1) translateY(-10px);
	}
  }

body {
	height: 100vh;
	width: 100% !important;
	box-sizing: border-box;
	font-family: 'Roboto', sans-serif;
	background-color: #2C2A24;
}

.preloader{
	display: flex;
	width: 40vw; 
	height: auto;
	justify-content: center;

}

.backRight {
	position: absolute;
	right: 0;
	width: 40%;
	height: 100vh;
	background: #2C2A24;
	background-image: url("../assets/stefan.jpg");
	background-repeat: no-repeat, repeat;
	background-size: cover;
	background-attachment: initial;
  	background-position: center;
	opacity: 1;
	
  }

  .backRight .shadow-img{
	height: 39%;width: 100%;
	position: absolute;
	bottom: 0;
	background: transparent linear-gradient(180deg, #2C2A2400 0%, #2C2A24D9 48%, #2C2A24 71%, #2C2A24 100%) 0% 0% no-repeat padding-box;

  }

  .backLeft .form-invited .submit-form-invited {
    margin-top: 3.5rem ;
	}

  #getMe{
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%,-50%);
  }

  #myProgress {
	display: none;
	width: 100%;
	background-color: grey;
	position: absolute;
	bottom:0
  }
  
  #myBar {
	width: 1%;
	height: 50px;
	background-color: #CA462D;
  }

  #myBar button{
	position: absolute;
	display: none;
	background: #CA462D;
	width: 100%;
	height: 50px;
	font-family: Montserrat-SemiBold;
  }
  
 
.backLeft {
	position: absolute;
	left: 0;
	width: 60%;
	height: 100vh;
	background: #2C2A24 0% 0% no-repeat padding-box;
	opacity: 1;
}

.backLeft .header-form .idiom {
	flex:1;
}
  
#back {
	display: none;
	width: 100%;
	height: 100vh;
}

.backRight .info-form{
	position:relative;
	top:23%;
	text-align: center;
}

.backRight .info-form h1{
	font-family: Gill-Sans-Regular;
	color: #FFFFFF;
	font-size: 3.2em;
	margin-bottom: 20%;
}

.backRight .info-form p{
	font-family: Gill-Sans-Light;
	color: #FFFFFF;
	font-size: 2.0rem;
	margin: 0;
}

.backRight .info-form .btn-guest{
	background: #CA462D;
	color:#FFFFFF;
	border-radius: 3px;
	border: none;
	width: 40%;
	margin-top: 8%;
}
.backRight .info-guest{
	position:relative;
	top:16%;
	text-align: center;
}

.backRight .info-guest h1{
	font-family: Gill-Sans-Regular;
	color: #FFFFFF;
	font-size: 3.2em;
	margin-bottom: 20%;
}

.backRight .info-guest p{
	font-family: Gill-Sans-Light;
	color: #FFFFFF;
	font-size: 2.0rem;
	margin: 0;
}

.backRight .info-guest .btn-invited{
	background: #CA462D;
	color:#FFFFFF;
	border-radius: 3px;
	border: none;
	width: 40%;
	margin-top: 8%;
}

.backLeft .form-guest .row{
	margin-bottom:0;
}



.backLeft .title-welcome{
	font-family: Gill-Sans-Light;
	color: #FFFFFF;
	text-align: center;
	letter-spacing: 1.8px;
	font-size: 4rem;
	margin:0;
}

.backLeft .title-form{
	font-family: Gill-Sans-Light;
	color: #FFFFFF;
	text-align: center;
	font-size: 1.8em;
	margin:0;
	margin-top: 3%;
    margin-bottom: 2%;
}

.backLeft .header-form{
	display: flex;
	flex-direction: row;
	align-items: center;
}

.backLeft .header-form  .logoD{
	flex:1;
	
}

.backLeft .header-form  .logom img{	
	margin-top: 5%;
	margin-left: 8%;
	width: auto;
	height: 7rem;
	visibility: hidden;
}

.backLeft .header-form  .logod img{	
	margin-top: 5%;
	margin-left: 8%;
	width: auto;
	height: 7rem;
	visibility: visible;
}



.backLeft .header-form .idiom{
	display:flex;
	flex-direction: column;
	align-items: flex-end;
	margin-right: 8%;
}

.backLeft .header-form .idiom .btn-idiom .current-idiom{
	font-size: 1.5rem;
	color: #FFFFFF;
	font-family: Gill-Sans-Regular;
	padding-bottom: 1.5rem;
	letter-spacing: 1.2px;
}

.backLeft .header-form .idiom .btn-idiom:hover{
	cursor:pointer;
}

.backLeft .header-form .idiom .btn-idiom img{
	position: relative;
	top: 0.6rem;
	padding-left: 2px;
	-moz-transition: transform 350ms;
	-webkit-transition: transform 350ms;
	transition: transform 350ms;
}

.backLeft .header-form .idiom ul{	
	position: absolute;
	font-family: Gill-Sans-Regular;
	font-size: 1.5rem;
	margin-top: 3rem;
	letter-spacing: 1.2px;
}

.backLeft .header-form .idiom ul li a{
	color:#FFFFFF;
	
	
}

.backLeft .form-guest{
	width: 50%;
	margin: auto;
	
}





.backLeft .form-guest .containerConditions{
	margin-top: 3rem;
}

.backLeft .form-invited .containerConditions{
	margin-top: 4rem;
}


.backLeft .form-guest .submit-form-guest{
	background: #CEAC66;
	width: 100%;
	margin-top: 10%;
	font-family: Gill-Sans-Medium;
}

.backLeft .form-invited{
	width: 50%;
	margin: auto;
}

.input-field>label{
	font-size: 1.25rem;
}

.backLeft .tabsMode{
	display: flex;
	justify-content: space-between;
	width: 50%;margin: auto;
	font-family: Gill-Sans-Regular;
	
	font-size: 1.25rem;
	margin-top: 3rem;
	margin-bottom: 3rem;
	padding: 0 1.5rem;
		
	text-transform: uppercase;
	letter-spacing: 0.55px;
}

.backLeft .tabsMode div{
	border-bottom: 2px solid #FFFFFF;
	
}

.backLeft .tabsMode div:hover{
	cursor: pointer;
}

.backLeft .tabsMode div a{
	color: #FFFFFF;
	
	
}

.backLeft .tabsMode .currentActive{
	border-bottom: 2px solid #CEAC66;
	font-family: Gill-Sans-Medium;
	

}.backLeft .header-form  .logom img{	
	margin-top: 5%;
	margin-left: 8%;
	width: auto;
	height: 7rem;
	visibility: hidden;
}

.backLeft .header-form  .logod img{	
	
	flex: 1;
	margin-top: -45%;
	margin-left: 25%;
	width: auto;
	height: 7rem;
	visibility: visible;
}

.backLeft .tabsMode .currentActive a{
	color: #CEAC66;
}

.first-condition a{
	color: #FFFFFF;
}

.backLeft .form-invited .second-condition{
	margin-top:5%;
	
}

.backLeft .form-guest .second-condition{
	margin-top: 0.5rem !important;
	letter-spacing: 0.5px !important;
	
}

.backLeft .form-invited .submit-form-invited{
	background:#CEAC66;
	width: 100%;
	margin-top: 10%;
	font-family: Gill-Sans-Medium;
	letter-spacing: 1px;
}

input[type=text]:not(.browser-default),
input.invalid[type=text]:not(.browser-default),
input.valid[type=text]:not(.browser-default),
input.invalid[type=text]:not(.browser-default):focus,
input[type=text]:not(.browser-default):focus:not([readonly]),
input[type=email]:not(.browser-default),
input.invalid[type=email]:not(.browser-default),
input.valid[type=email]:not(.browser-default),
input.invalid[type=email]:not(.browser-default):focus,
input[type=email]:not(.browser-default):focus:not([readonly]),
input[type=password]:not(.browser-default),
input.invalid[type=password]:not(.browser-default),
input.valid[type=password]:not(.browser-default),
input.invalid[type=password]:not(.browser-default):focus,
input[type=password]:not(.browser-default):focus:not([readonly])
{
	border-bottom: 1px solid #FFFFFF !important;
	color: #FFFFFF !important;
	box-shadow: 0 0 0 0 #FFFFFF;
}

#icon-password{
	right: 0;
    position: absolute;
    top: 0.3em;
    padding-right: 1.2rem;
}

#icon-password:hover{
	cursor:pointer;
}

.input-field{
	margin-top: 0.2rem !important;
	margin-bottom: 0.2rem !important;
}

.input-field label{
	color: #FFFFFF !important;
	font-family: Gill-Sans-Medium;
	left: 0rem !important;
}

.input-field input{
	font-family: Gill-Sans-Medium;
}


[type="checkbox"].filled-in:not(:checked)+span:not(.lever):after
{
	border: 2px solid #FFFFFF;
	height: 10px;
	width: 10px;
	top:2px !important;
	background-color: #FFFFFF !important;
	-webkit-transition: all .6s ease;
  	-moz-transition: all .6s ease;
  	-o-transition: all .6s ease;
  	-ms-transition: all .6s ease;
  	transition: all .6s ease;
}
[type="checkbox"].filled-in+span:not(.lever):after
{
	border-radius: 1px;
}
[type="checkbox"].filled-in:checked+span:not(.lever):after
{
	background-color: #B69759 !important;
	border: 2px solid #FFFFFF;
	width: 10px !important;
	height: 10px !important;
	top: 2px !important;	
	-webkit-transition: all .6s ease;
  	-moz-transition: all .6s ease;
  	-o-transition: all .6s ease;
  	-ms-transition: all .6s ease;
  	transition: all .6s ease;
}
[type="checkbox"].filled-in:checked+span:not(.lever):before {
	border-right: 2px solid transparent;
	border-bottom: 2px solid transparent;
	top: 2px !important;
	
}


[type="checkbox"]+span:not(.lever) {
	color: #FFFFFF;
	font-family: Gill-Sans-Medium;
	font-size:1rem !important;
	padding-left:20px !important;
	line-height: 1.25rem !important;
	text-align: left;
	margin-top: 1.5rem !important;

	
	
}

.error-message-name,
.error-message-lastname,
.error-message-room,
.error-message-condition,
.error-message-email,
.error-message-code,
.error-message-server{
	color: #BBAC7A;
	font-size: 14px;
	margin-bottom: 0rem;
	opacity: 0;	
	font-family: Gill-Sans-Medium;
	transition: opacity 0.3s;
	-webkit-transition: opacity 0.3s;
}

#error-img-name,
#error-img-lastname,
#error-img-room,
#error-img-condition,
#error-img-email,
#error-img-code,
#error-img-server{
	position: relative;
	top:3px;
	opacity: 0;
	transition: opacity 0.3s;
	  -webkit-transition: opacity 0.3s;
}


#modalTerms .modal-content{
	padding-top:0 !important;
	padding-bottom:1px !important;
	padding: 30px;
}

#modalTerms .modal-content .modal-close{
	background: #B69759;
    width: 2rem;
    text-align: center;
    position: absolute;
	right: 0;
	color:#FFFFFF;
	height: 2rem;
	padding-top: 0.3rem;
}

#modalTerms.modal{
	transform: translate(0%, 20%) !important;
	margin: 0 !important;
	margin-left: 5% !important;
	width: 50% !important;
	top:0% !important;
	max-height: 100% !important;
	overflow-y: hidden !important;
	background-color: #F4F4F4 !important;
}

#modalTerms .tabs{
	background-color: #F4F4F4;
	margin-bottom: 5%;
	margin-top: 5%;
}

#modalTerms .tabs .tab{
	text-transform:none;
}

#modalTerms .tabs .tab a active{
	font-family: Gill-Sans-Light;
	color:#000000;
	font-size: 1.3rem;
}

#modalTerms .tabs .tab a{
	font-family: Gill-Sans-Light;
	color:#000000;
	font-size: 1.3rem;
}

#modalTerms #terms-use{
	overflow-y: scroll;
	height: 20rem;
	font-family: Gill-Sans-Regular;
	font-size:1rem;
}

#modalTerms ::-webkit-scrollbar {
	width: 2px;
}

#modalTerms  ::-webkit-scrollbar-track {
	background: #FFFFFF;
}


#modalTerms  ::-webkit-scrollbar-thumb {
	background: #B69759;
}


#modalTerms ::-webkit-scrollbar-thumb:hover {
	background:#B69759; 
}
  
#modalTerms #terms-use h2{
	font-size:1rem;
}

#modalTerms #policy-privacy{
	overflow-y: scroll;
	height: 20rem;
	font-family: Gill-Sans-Regular;
	font-size:1rem;
}

#modalTerms #policy-privacy h2{
	font-size:1rem;
}

#modalTerms .indicator{
	display:none;
}

#modalTerms .tabs .tab a:hover, #modalTerms .tabs .tab a.active{
	background-color: #F4F4F4 !important;
}

#modalTerms .modal-footer{
	background-color: #F4F4F4;
	text-align: center;
}

#modalTerms .modal-footer a{
	font-family: Gill-Sans-Medium;
	color:#FFFFFF;
	background-color: #B69759;
}

#loading{
	display:none;
	height: 100%;
	flex-direction: column;
	background-color: #2C2A24;
}

#loading iframe{
	border: none;
}

#loading .header-loading{
    position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%,-50%);
}

#loading .header-loading .logo-header{
	flex:3
}

#loading .header-loading .logo-header img{
	width: 25%;
}

#loading .header-loading .msg-header{
	flex:1;
	display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

.lds-dual-ring {
	display: inline-block;
	width: 80px;
	height: 80px;
  }
  .lds-dual-ring:after {
	content: " ";
	display: block;
	width: 64px;
	height: 64px;
	margin: 8px;
	border-radius: 50%;
	border: 6px solid #C7B378;
	border-color: #C7B378 transparent #C7B378 transparent;
	animation: lds-dual-ring 1.2s linear infinite;
  }
  @keyframes lds-dual-ring {
	0% {
	  transform: rotate(0deg);
	}
	100% {
	  transform: rotate(360deg);
	}
  }


#loading .header-loading .msg-header img{
	width: 25%;
}

#loading .header-loading .msg-header span{
	color: #FFFFFF;
	font-family: Gill-Sans-Light;
	font-size: 2em;
}

#loading .footer-loading{
	height: 10%;
    background: #2C2A24;
    justify-content: flex-end;
}

#error{
	display:none;
	height: 100%;
	flex-direction: column;
	background-color: #2C2A24;
}

#error iframe{
	border: none;
}

#error .header-error{
    position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%,-50%);
}

#error .header-error .logo-header{
	flex:3
}

#error .header-error .logo-header img{
	width: 20%;
}

#error .header-error .msg-header{
	flex:1;
	display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

#error .header-error .msg-header img{
	width: 50%;
}

#error .header-error .msg-header span{
	color: #FFFFFF;
	font-family: Gill-Sans-Light;
	font-size: 2rem;
}

#error .footer-error{
	height: 10%;
    background: #2C2A24;
    justify-content: center;
}



#success{
	display:none;
	height: 100%;
	flex-direction: column;
	background-color: #2C2A24;
}

#success iframe{
	border:none;
}

#success .header-success{
    position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}

#success .header-success .logo-header{
	flex:3
}

#success .header-success .logo-header img{
	width: 50%;
}

#success .header-success .msg-header{
	flex:1;
	display: flex;
    flex-direction: row;
	align-items: center;
	justify-content: center;

   
}

#success .header-success .msg-header img{
	width: 20%;
    margin: 15px;

}

#success .header-success .msg-header span{
	color: #FFFFFF;
	font-family: Gill-Sans-Light;
	font-size: 2rem;
}

#success .footer-success{
	height: 10%;
    background: #2C2A24;
    justify-content: center;
}

.btn-large{
	font-size: 1.25rem ;
	letter-spacing: 1px;
}

@media (min-width: 992px) and (max-width: 1575px){


	.backLeft .header-form .idiom .btn-idiom .current-idiom {
		font-size: 1vw;
	}
	.backLeft .header-form .idiom .btn-idiom img {
		top: 0.85rem;
		padding-left: 0px;
		width: 49%;
	}
	.backLeft .header-form .idiom ul {

		font-size: 0.9vw;

	}
	.backLeft .header-form {
		margin-top: -1vw;
	}
	
	.backLeft .form-guest{
		width: 80%;
	}

	.backLeft .form-invited{
		width: 80%;
	}

	.backLeft .tabsMode{
		width: 80%;
		font-size: 1.5vw;
		margin-bottom: 3.5vh;
		margin-top: 4vh;
	}

	.input-field label{

		font-size: 1.2vw;
	}

	.input-field label{

		font-size: 1.2vw;
	}

	.input-field{
	margin-bottom: 0.5rem !important;
	
	}

	.backLeft .form-guest .containerConditions{

		margin-top: 2.5vh;
	}

	.backLeft .form-invited .containerConditions{

		margin-top: 4.5vh;
		
	
	}

	[type="checkbox"]+span:not(.lever) {
		font-size: 0.8vw !important;
		margin-top: 0.5vw !important;
	}

	.backLeft .title-welcome{
		font-size: 3vw;
		margin-top: 3vh;
	}

	.backLeft .form-guest .submit-form-guest {
		margin-top: 8%;
	}
	.backLeft .form-guest .submit-form-guest {
		width:90%;		
		font-size: 2vh;
		height: 44px;
		line-height: 44px;
		margin-left: 4%;
	}

	.backLeft .form-invited .submit-form-invited {
		width:90%;		
		font-size: 2vh;
		height: 44px;
		line-height: 44px;
		margin-left: 4%;
	}

	.btn-large {
		font-size: 3vh;
	}
}



@media (min-width: 992px) and (max-height: 790px){

	.backLeft .header-form .logod img {
		flex: 1;
		margin-top: -12%;
		margin-left: 5%;
		height: 5rem;    
		position: absolute;
	}

	.backLeft .header-form .idiom .btn-idiom .current-idiom {
		font-size: 1vw;
	}
	.backLeft .header-form .idiom ul {
		font-size: 0.9vw;
	}

	.backLeft .tabsMode{
		width: 60%;
		font-size: 2vh;
		padding: 0 8.5vh;
		margin-top: 4vh;
		margin-bottom: 4.5vh;

	}
	.backLeft .title-welcome{
		font-size: 6vh;
		margin-top: -4%;
	}

	.backLeft .form-guest{
		width: 60%;
		font-size: 0.5vh;
	}
	
	.backLeft .form-invited{
		width: 60%;
		font-size: 0.5vh;
	}

	.input-field label {
		font-size: 0.8vw;
	}
	.input-field label {

	margin-bottom: 0.7rem !important;

	}
	.error-message-name,
	.error-message-lastname,
	.error-message-room,
	.error-message-condition,
	.error-message-email,
	.error-message-code,
	.error-message-server{
		font-size: 1.5vh;
	}
	#error-img-name,
	#error-img-lastname,
	#error-img-room,
	#error-img-condition,
	#error-img-email,
	#error-img-code,
	#error-img-server{
		height: 11px;
	}





	.backLeft .form-guest .submit-form-guest{
		margin-top:6%;
	}

	

	.backLeft .header-form .logo img{
		height: 2.45rem;
	}
	input:not([type]), input[type=text]:not(.browser-default), input[type=password]:not(.browser-default), input[type=email]:not(.browser-default), input[type=url]:not(.browser-default), input[type=time]:not(.browser-default), input[type=date]:not(.browser-default), input[type=datetime]:not(.browser-default), input[type=datetime-local]:not(.browser-default), input[type=tel]:not(.browser-default), input[type=number]:not(.browser-default), input[type=search]:not(.browser-default), textarea.materialize-textarea {
		margin: 0 0 0 0;
		height: 2rem;
	}

	.backLeft .form-guest .containerConditions {
		margin-top: 3vh;
		
	}

	.backLeft .form-invited .containerConditions{

		margin-top: 4.5vh;
		
	
	}

	.backLeft .form-guest .submit-form-guest {
		width:90%;		
		font-size: 2vh;
		height: 44px;
		line-height: 44px;
		margin-left: 4%;
	}

	.backLeft .form-invited .submit-form-invited {
		width:90%;		
		font-size: 2vh;
		height: 44px;
		line-height: 44px;
		margin-left: 4%;
	}

	.btn-large {
		font-size: 3vh;
	}
}


@media (max-width: 991.98px) {

	.preloader{
		display: flex;
		width: 100vw; 
		height: auto;
		justify-content: center;
	
	}
	
	
	.backRight {
		display:none;
	}

	.backLeft .header-form  .logom img{	
		margin-top: 12px;
		margin-left: 12px;
		width: auto;		
		height: 4rem !important;
		visibility: visible;
	}
	
	.backLeft .header-form  .logod img{	
		margin-top: -60%;
		margin-left: 8%;
		width: auto;
		height: 0rem !important;
		visibility: hidden;
	}

	.backLeft .header-form .idiom ul{
		margin-top: 2rem !important;
	}
	[type="checkbox"]+span:not(.lever) {
		margin-top: 15px !important;
		margin-bottom: -12px !important;

	}	
	.backLeft .form-guest .second-condition{
		margin-top: 0.5rem !important;
		letter-spacing: 0px !important;
		
	}
	  
	.backLeft {
		position: absolute;
		left: 0;
		width: 100%;
		background: #2C2A240D;
		background-image: url(../assets/stefan.jpg);
		background-image: linear-gradient(180deg, #2C2A240D 0%, #2C2A2419 24%, #2C2A24D9 48%, #2C2A24 71%, #2C2A24 100%), url(../assets/stefan.jpg);
		background-repeat: no-repeat, repeat;
		background-size: cover;
		background-attachment: initial;
		background-position: center;
		opacity: 1;
	}

	.backLeft .title-welcome{
		font-size: 46px !important;
		margin-top: 0rem ;
	}

	.title-form{
		display:none;
	}

	.backLeft .form-guest{
		width: 70%;
	}

	.backLeft .form-invited{
		width: 70%;
	}
	#modalTerms .modal-content {

		padding: 0px 28px 28px 18px!important;

	}



	input:not([type]), 
	input[type=text]:not(.browser-default), 
	input[type=password]:not(.browser-default), 
	input[type=email]:not(.browser-default){
		height: 2.5rem !important;
		padding-top: 5px ;
		margin: 0 0 4px 0;
	}

	.input-field>label{
		font-size: 1.1rem !important;
		top: 10px;
	}

	#modalTerms.modal{
		width: 90% !important;
	}

	[type="checkbox"]+span:not(.lever){
		font-size:11px !important;
	}

	.backLeft .form-guest .submit-form-guest{
		margin-top:5%;
	}

	.backLeft .form-invited .submit-form-invited{
		margin-top:5%;
	}

	#loading .header-loading .logo-header img{
		width: 100%;
	}

	#loading .header-loading .msg-header img {
		width: 100%;
	}

	#success .header-success .logo-header img{
		width: 45%;
	}

	#success .header-success .msg-header img {
		width: 21%;
	}

	.backLeft .tabsMode{
		width: 70%;
		font-size: 1.8em;
		text-transform: capitalize !important;
		margin-top: 4rem;
		margin-bottom: 2.5rem;	
		letter-spacing: 1.2px;	
	}

	.backLeft .tabsMode div a{
		color: #FFFFFF !important;
	}

	.backLeft .tabsMode div{
		border-bottom: none !important; 
	}

	.backLeft .tabsMode div:after{
		content: '';
		display: block;
		margin: auto;
		height: 2px;
		width: 0px;
		background: transparent;
		transition: width .5s ease, border-bottom .5s 
	}

	.backLeft .tabsMode .currentActive:after{
		width: 100%;
		background: #FFFFFF;
	}




	.backLeft .form-invited .containerConditions{
		margin-top: 10em;
	}

	#icon-password {
		top: -0.2rem;
	}

	

}

@media (max-width: 767.98px) {
	.backLeft .title-welcome {
		font-size: 2.3rem;
		margin-top: 1rem;
	}

	.backLeft .form-guest{
		width: 70%;
	}

	#loading .header-loading .msg-header{
		flex:2;
	}

	#loading .header-loading .logo-header img{
		width: 100%;
	}

	#loading .header-loading .msg-header img {
		width: 100%;
	}

	#success .header-success .msg-header{
		flex:2;
	}

	#success.header-success .logo-header img{
		width: 64%;
	}

	#success .header-success .msg-header img {
		width: 17%;
	}

}


@media (max-width: 575.98px) and (min-height:700px) {
	body{
		overflow: hidden;
	}

	.backLeft .header-form .idiom .btn-idiom .current-idiom{
		font-size: 1rem;
	}

	.backLeft .header-form .idiom .btn-idiom img{
		width: 25px;
    	height: 25px;
	}

	.backLeft .header-form .idiom ul{
		font-size: 1rem;
	}

	.backLeft .title-welcome {
		font-size: 2rem;
		margin-top:5%;
	}

	.backLeft .form-guest{
		width: 85%;
	}

	.backLeft .form-invited{
		width: 85%;
	}

	.backLeft .header-form .idiom{
		margin-top: 0%;
	}

	#modalTerms .tabs .tab a{
		font-size: 0.688rem;
	}

	#modalTerms #terms-use{
		font-size: 0.7rem;
	}

	#modalTerms #policy-privacy{
		font-size: 0.7rem;
	}

	#modalTerms #terms-use h2{
		font-size: 0.8rem;
	}

	#modalTerms #policy-privacy h2{
		font-size: 0.8rem;
	}

	.backLeft .tabsMode{
		width: 85%;
		font-size: 1.4rem;
		margin-top: 2.75rem;
		margin-bottom: 2.75rem;
	}

	.backLeft .form-guest .containerConditions {

		margin-top: 1rem;
	
	}

	.backLeft .form-invited .containerConditions {

		margin-top: 4em;
	
	}

}

@media (max-width: 575.98px) and (max-height:699.98px) {
	body{
		overflow: hidden;
	}

	.backLeft .header-form  .logo img{
		
		
		height: 4rem !important;
	}

	.backLeft .header-form .idiom .btn-idiom .current-idiom{
		font-size: 1.1rem;
	}

	.backLeft .header-form .idiom .btn-idiom img{
		width: 25px;
    	height: 25px;
	}

	.backLeft .header-form .idiom ul{
		font-size: 1.1rem;
	}

	.backLeft .title-welcome {
		font-size: 2rem;
		margin-top:4%;
	}

	.error-message-name, 
	.error-message-lastname, 
	.error-message-room, 
	.error-message-condition, 
	.error-message-email, 
	.error-message-code,
	.error-message-server{
		font-size: 11px;
		line-height: 10px !important;
	}

	.btn-large{
		height: 46px;
		line-height: 50px;
	}

	.backLeft .form-invited .submit-form-invited {

		margin-top: 2.5rem ;
	}

	.backLeft .form-guest{
		width: 90%;
	}

	.backLeft .form-invited{
		width: 90%;
	}

	.backLeft .form-guest .containerConditions{
		margin-top: 1.5rem !important;
	}


	.backLeft .form-invited .containerConditions{
		margin-top: 4em !important;
	}

	.backLeft .header-form .idiom{
		margin-top: 0%;
	}

	#modalTerms .tabs .tab a{
		font-size: 0.688rem;
	}

	#modalTerms #terms-use{
		font-size: 0.7rem;
	}

	#modalTerms #policy-privacy{
		font-size: 0.7rem;
	}

	#modalTerms #terms-use h2{
		font-size: 0.8rem;
	}

	#modalTerms #policy-privacy h2{
		font-size: 0.8rem;
	}

	.backLeft .tabsMode{
		width: 85%;
		font-size: 1.70rem;
		margin-top: 2rem ;
		margin-bottom: 2.2rem ;
		padding: 0 0.1rem !important;
		letter-spacing: 0.48px;

	}

	

	.backLeft .title-welcome{
		margin-top: 0em;
		font-size: 3rem;
	}

	.backLeft .form-invited .containerConditions {

		margin-top: 0rem;
	
	}

}

@media (max-width: 575.98px) and (max-height:567.99px) {

	.backLeft .header-form .idiom .btn-idiom .current-idiom{
		font-size: 1rem;
	}

	.backLeft .header-form .idiom .btn-idiom img{
		width: 25px;
    	height: 25px;
	}

	.backLeft .header-form .idiom ul{
		font-size: 1rem;
	}

	.backLeft .title-welcome {
		font-size: 2.5rem;
		margin-top: -1rem;
	}

	.backLeft .tabsMode{
		
		margin-top: 0.2rem ;
		margin-bottom: 0.5rem ;
		font-size: 1.5rem !important;
	}
	[type="checkbox"]+span:not(.lever) {
		margin-top: 0.5rem !important;
	}

	.tab a {
		font-size: 11px !important;
	}

	[type="checkbox"]+span:not(.lever) {
		font-size: 11px !important;
		line-height: 16px !important;
		padding-left:22px;
	}

	.input-field>label {
		font-size: 0.89rem !important;
	}

	input:not([type]), 
	input[type=text]:not(.browser-default), 
	input[type=password]:not(.browser-default), 
	input[type=email]:not(.browser-default){
		height:2.1rem !important;
	}

	.input-field {
		margin-top: 0.4rem !important;
		margin-bottom: 0.4rem !important;
	}

	.btn-large{
		height: 31px;
		line-height: 35px;
		font-size:11px;
	}

	.error-message-name, 
	.error-message-lastname, 
	.error-message-room, 
	.error-message-condition, 
	.error-message-email, 
	.error-message-code,
	.error-message-server{
		font-size: 10px !important;
	}

	.backLeft .form-guest{
		width: 85%;
	}

	.backLeft .form-invited{
		width: 85%;
	}

	
	.backLeft .form-guest .containerConditions{
		margin-top: 1rem !important;
	}


	.backLeft .form-invited .containerConditions{
		margin-top: 1rem !important;
	}

	.input-field{
		height: 58px;
	}

	.backLeft .header-form .idiom{
		margin-top: 0%;
	}

	#modalTerms.modal{
		transform: translate(0%, 16%) !important;
	}

	#modalTerms .tabs .tab a{
		font-size: 0.53rem !important;
	}

	#modalTerms #terms-use{
		font-size: 0.6rem;
	}

	#modalTerms #policy-privacy{
		font-size: 0.6rem;
	}

	#modalTerms #terms-use h2{
		font-size: 0.7rem;
	}

	#modalTerms #policy-privacy h2{
		font-size: 0.7rem;
	}

}

@media (max-width: 375.98px) and (max-height:569.98px) {

	.backLeft .header-form .idiom .btn-idiom .current-idiom{
		font-size: 1rem;
	}

	.backLeft .header-form .idiom .btn-idiom img{
		width: 25px;
    	height: 25px;
	}

	.backLeft .header-form .idiom ul{
		font-size: 1rem;
	}
	
	[type="checkbox"]+span:not(.lever) {
		margin-top:0rem;
	}

	.backLeft .title-welcome {
		font-size: 1.8rem;
		margin-top: -10px;
	}

	.tab a {
		font-size: 1.5rem !important;
	}

	[type="checkbox"]+span:not(.lever) {
		font-size: 11px !important;
		line-height: 16px !important;
		padding-left:22px;
	}

	.input-field>label {
		font-size: 0.8rem !important;
	}

	input:not([type]), 
	input[type=text]:not(.browser-default), 
	input[type=password]:not(.browser-default), 
	input[type=email]:not(.browser-default){
		height: 2.5rem !important;
		padding-top: 5px ;
		margin: 0 0 0px 0;
	}

	.input-field {
		margin-top: 0.4rem !important;
		margin-bottom: 0.4rem !important;
	}
	

	.btn-large{
		height: 31px;
		line-height: 35px;
		font-size:11px;
	}

	.error-message-name, 
	.error-message-lastname, 
	.error-message-room, 
	.error-message-condition, 
	.error-message-email, 
	.error-message-code,
	.error-message-server{
		font-size: 10px !important;
	}

	.backLeft .form-guest{
		width: 90%;
	}

	.backLeft .form-invited{
		width: 90%;
	}

	

	.backLeft .form-guest .containerConditions{
		margin-top: 0.5rem !important;
	}


	.backLeft .form-invited .containerConditions{
		margin-top: 1em !important;
	}

	.input-field{
		height: 58px;
	}

	.backLeft .header-form .idiom{
		margin-top: 0%;
	}

	#modalTerms.modal{
		transform: translate(0%, 16%) !important;
	}
	#modalTerms .modal-content{
		padding: 10px 28px!important;
	}

	#modalTerms .tabs .tab a{
		font-size: 0.53rem !important;
	}

	#modalTerms #terms-use{
		font-size: 0.6rem;
		height: 15rem;
	}

	#modalTerms #policy-privacy{
		font-size: 0.6rem;
		height: 15rem;
	}

	#modalTerms #terms-use h2{
		font-size: 0.7rem;
	}

	#modalTerms #policy-privacy h2{
		font-size: 0.7rem;
	}

}

@media (max-width: 575.98px) {
	body{
		overflow: scroll;
	}

	#loading .header-loading .msg-header{
		flex:2;
	}

	#loading .header-loading .logo-header img {
		width: 73%;
	}

	#loading .header-loading .msg-header span {
		font-size: 1.5rem;
	}

	#loading .header-loading .msg-header img {
		width: 25%;
	}

	.lds-dual-ring:after {
		content: " ";
		display: block;
		width: 40px;
		height: 40px;
		margin: 20px;
	}
	

	#success .header-success .msg-header{
		flex:2;
	}

	#success .header-success .logo-header img {
		width: 73%;
	}

	#success .header-success .msg-header span {
		font-size: 1.5rem;
	}

	#success .header-success .msg-header img {
		width: 20%;
	}

	.backLeft .tabsMode{
		padding-right: 0;
		padding-left: 0;
		
	}
	

	

}