:root {
--fr-red: #e83a54;
--fr-yellow: #fffde9;
--fr-dark: #202124;
--fr-border: #333333;
--fr-cyan: #0CBEE1;
} .fifteens-reservation {
background-color: var(--fr-yellow);
padding: 105px 30px 30px;
font-family:
"Albert Sans",
-apple-system,
BlinkMacSystemFont,
"Segoe UI",
sans-serif;
color: var(--fr-dark);
overflow-y: auto;
height: 100%;
} .fifteens-reservation__header {
margin-bottom: 30px;
text-align: center;
}
.fifteens-reservation__header h2 {
color: var(--fr-red);
font-weight: 700;
font-size: 2.1em;
margin: 0 0 15px;
line-height: 1.2;
}
.fifteens-reservation__header p {
margin: 0;
color: var(--fr-dark);
font-size: 0.85em;
line-height: 1.2em;
} .fifteens-reservation__notice {
margin: 0 0 20px;
padding: 10px 0;
color: var(--fr-red);
font-weight: 600;
font-size: 0.9rem;
text-align: center;
border-bottom: 1px solid var(--fr-red);
} .fifteens-reservation__steps {
display: flex;
gap: 6px;
margin: 0 0 30px;
}
.fifteens-step {
flex: 1;
height: 3px;
background: rgba(32, 33, 36, 0.2);
border-radius: 0;
transition: background 0.3s ease;
}
.fifteens-step.is-active {
background: var(--fr-red);
} .fifteens-reservation__step {
display: none;
}
.fifteens-reservation__step.is-active {
display: flex;
flex-direction: column;
gap: 15px;
} .fifteens-reservation__form{
margin:0;
}
.fifteens-field {
position: relative;
} .fifteens-field:not(.fifteens-field--checkbox) input[type="text"],
.fifteens-field:not(.fifteens-field--checkbox) input[type="email"],
.fifteens-field:not(.fifteens-field--checkbox) input[type="tel"],
.fifteens-field:not(.fifteens-field--checkbox) input[type="number"] {
display: block;
width: 100%;
background: transparent;
border: none;
border-bottom: 1px solid var(--fr-border);
color: var(--fr-dark);
font-size: 0.9rem;
font-family: inherit;
height: auto;
padding: 1.1rem 0 0.3rem;
margin-bottom: 0;
outline: none;
box-shadow: none;
border-radius: 0;
transition: border-color 0.3s ease;
}
.fifteens-field:not(.fifteens-field--checkbox) input:focus {
border-bottom-color: var(--fr-red) !important;
box-shadow: none !important;
outline: none !important;
} .fifteens-field:not(.fifteens-field--checkbox) > label {
position: absolute;
left: 0;
top: 0.85rem;
color: var(--fr-dark);
font-size: 0.9rem;
font-weight: 400;
opacity: 0.9;
transition:
top 0.15s ease,
font-size 0.15s ease,
color 0.15s ease,
opacity 0.15s ease;
pointer-events: none;
margin: 0;
padding: 0;
line-height: 1;
} .fifteens-field:not(.fifteens-field--checkbox) input:focus + label,
.fifteens-field:not(.fifteens-field--checkbox)
input:not(:placeholder-shown)
+ label {
top: 0;
font-size: 0.9rem;
color: var(--fr-red);
opacity: 1;
} .fifteens-field select {
display: block;
width: 100%;
background: transparent;
border: none;
border-bottom: 1px solid var(--fr-border);
color: var(--fr-dark);
font-size: 0.9rem;
font-family: inherit;
height: auto;
padding: 0.6rem 1.2rem 0.6rem 0;
margin-bottom: 0;
outline: none;
border-radius: 0;
appearance: none;
-webkit-appearance: none;
cursor: pointer;
transition: border-color 0.3s ease; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23202124' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: right 2px center;
background-size: 10px;
}
.fifteens-field select:focus {
background: transparent;
border-bottom-color: var(--fr-red);
outline: none;
box-shadow: none;
}
.fifteens-field select option {
color: var(--fr-dark);
background: #fff;
} .fifteens-field input:-webkit-autofill,
.fifteens-field input:-webkit-autofill:hover,
.fifteens-field input:-webkit-autofill:focus,
.fifteens-field input:-webkit-autofill:active {
-webkit-box-shadow: 0 0 0 30px var(--fr-yellow) inset !important;
-webkit-text-fill-color: var(--fr-dark) !important;
transition: background-color 5000s ease-in-out 0s;
} .fifteens-row {
display: flex;
gap: 15px;
}
.fifteens-row .fifteens-field {
flex: 1;
min-width: 0;
} .fifteens-btn {
display: inline-block;
line-height: 1em;
color: #fff;
border: none;
border-radius: 0;
background-color: var(--fr-red);
font-weight: 700;
font-size: 1.4em;
font-family: inherit;
padding: 15px 48px 15px 30px;
position: relative;
cursor: pointer;
transition: opacity 0.3s ease;
text-decoration: none;
margin-top: 30px;
}
.fifteens-btn:hover,
.fifteens-btn:focus {
opacity: 0.82;
color: #fff;
text-decoration: none;
outline: none;
} .fifteens-btn{
margin: 0;
}
.fifteens-btn::after {
position: absolute;
right: 18px;
top: 50%;
transform: translateY(-50%);
content: "";
width: 15px;
height: 15px;
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15 15'%3E%3Cpath fill='%23fff' d='M1 14L14 1M14 1H5M14 1v9' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")
no-repeat center / contain;
}
.fifteens-btn--back {
background: transparent;
color: var(--fr-red);
font-size: 0.9em;
font-weight: 600;
font-family: inherit;
padding: 0;
margin-top: 12px;
cursor: pointer;
border: none;
display: block;
text-decoration: underline;
text-underline-offset: 2px;
}
.fifteens-btn--back:hover {
opacity: 0.75;
} .fifteens-reservation__actions {
margin-top: 10px;
display: flex;
flex-direction: column;
align-items: center;
} .fifteens-field--checkbox {
margin-top: 20px;
margin-bottom: 0;
}
.fifteens-checkbox-label {
display: flex;
align-items: flex-start;
gap: 10px;
cursor: pointer;
font-size: 0.88rem;
color: var(--fr-dark);
line-height: 1.4;
}
.fifteens-checkbox-label input[type="checkbox"] {
flex-shrink: 0;
width: 18px;
height: 18px;
margin: 1px 0 0;
appearance: none;
-webkit-appearance: none;
border: 2px solid var(--fr-border);
background: transparent;
cursor: pointer;
position: relative;
transition:
border-color 0.2s ease,
background 0.2s ease;
}
.fifteens-checkbox-label input[type="checkbox"]:checked {
background: var(--fr-red);
border-color: var(--fr-red);
}
.fifteens-checkbox-label input[type="checkbox"]:checked::after {
content: "";
display: block;
position: absolute;
left: 4px;
top: 1px;
width: 5px;
height: 10px;
border: 2px solid #fff;
border-top: none;
border-left: none;
transform: rotate(45deg);
}
.fifteens-checkbox-label input[type="checkbox"]:focus {
outline: 2px solid var(--fr-red);
outline-offset: 2px;
}
.fifteens-checkbox-label a {
color: var(--fr-red);
text-decoration: underline;
text-underline-offset: 2px;
}
.fifteens-checkbox-label a:hover {
opacity: 0.8;
} .fifteens-travel-rate-box {
margin-top: 60px;
font-size: 1.3rem;
color: #fff;
}
.fifteens-travel-rate-box > div {
display: flex;
justify-content: flex-start;
align-items: center;
flex-wrap: wrap;
}
.fifteens-travel-rate-box > div div {
padding: 7px 15px;
background: var(--fr-red);
color: #fff;
display: inline-block;
font-weight: 600;
}
.fifteens-travel-rate-box > div div#number-currency {
background: var(--fr-yellow);
color: #202124;
}
.fifteens-travel-rate-box > div div#number-currency span {
color: var(--fr-red);
}
.fifteens-travel-rate-box small {
width: 100%;
font-style: italic;
} .fifteens-thankyou {
margin: 40px auto;
font-size: 1rem;
color: var(--ft-dark);
}
.fifteens-thankyou section {
text-align: center;
padding:90px 50px
}
.payment-success .fifteens-thankyou__header {
color: #fff;
background-color: #000;
background-image: url(//reservas.fifteens.com.ar/wp-content/plugins/fifteens-plugin/assets/img/shapes/stroke_01.png), url(//reservas.fifteens.com.ar/wp-content/plugins/fifteens-plugin/assets/img/shapes/stroke_01-2.png);
background-position: left 50%, right bottom;
background-repeat: no-repeat;
background-size: 15%;
}
.fifteens-thankyou__header #logo{
margin:40px auto
}
.fifteens-thankyou__header h1{
font-size:4rem;
}
.payment-success .fifteens-thankyou__header h1{
color: var(--ft-yellow);
}
.payment-success .fifteens-thankyou__header h1 span{
color: #82D0D3
}
.payment-success #outline {
display: inline-block;
margin: 60px 0;
padding: 15px 30px;
border: 1px solid #F982AA;
font-weight: 700;
font-size: 1.3em;
}
.payment-success .woocommerce-order-overview {
border: 1px solid;
width: 50%;
margin: 0 auto -90px;
padding: 15px;
list-style: none;
}
.payment-success .generar-boardingpass h2 {
color: var(--ft-red);
font-size: 3em;
margin-bottom: 30px;
padding: 0;
}
.fifteens-thankyou p{
margin: 0;
font-size: 1.3em;
}
.payment-success .generar-boardingpass p {
margin-bottom: 60px;
}
.payment-success .generar-boardingpass p span {
color: var(--fr-cyan);
font-weight: 700;
}
.ft-card--bacs-instructions ul{
list-style: none;
}
.direct-access {
position: fixed;
bottom: 0;
right: 0;
width: auto;
max-width: none !important;
z-index: 99;
}
.direct-access .button{
font-weight: 400;
margin: 0 0 0 7px;
float:left;
} @media (max-width: 767px) {
.fifteens-reservation {
padding: 105px 15px 15px;
}
.fifteens-reservation__header h2 {
font-size: 1.4rem;
}
.fifteens-btn {
width: 100%;
font-size: 1.1em;
text-align: center;
}
.fifteens-row {
flex-direction: column;
gap: 0;
}
}
@media (min-width: 320px) and (max-width: 479px) {
.fifteens-reservation{
padding: 15px;
}
.fifteens-travel-rate-box{
margin-top: 30px;
font-size: 1rem;
}
.fifteens-travel-rate-box small{
font-size: 0.7rem;
}
}