@font-face {
    font-family: fenotype-vodka-sans;
    src:
        url('../../../fonts/mrwonderful_agendalandingpage/2018/fenotype-vodka-sans.ttf') format('truetype'),
        url('../../../fonts/mrwonderful_agendalandingpage/2018/fenotype-vodka-sans.eot?#iefix') format('embedded-opentype'),
        url('../../../fonts/mrwonderful_agendalandingpage/2018/fenotype-vodka-sans.otf') format("opentype"),
        url('../../../fonts/mrwonderful_agendalandingpage/2018/fenotype-vodka-sans.woff') format('woff'),
        url('../../../fonts/mrwonderful_agendalandingpage/2018/fenotype-vodka-sans.woff2') format('woff2'),
        url('../../../fonts/mrwonderful_agendalandingpage/2018/fenotype-vodka-sans.svg#trueNorth') format('svg')
}

@font-face {
    font-family: voster-font;
    src:
        url('../../../fonts/mrwonderful_agendalandingpage/2019/voster-font.ttf') format('truetype'),
        url('../../../fonts/mrwonderful_agendalandingpage/2019/voster-font.otf') format('opentype'),
        url('../../../fonts/mrwonderful_agendalandingpage/2019/voster-font.woff') format('woff'),
        url('../../../fonts/mrwonderful_agendalandingpage/2019/voster-font.woff2') format('woff2'),
        url('../../../fonts/mrwonderful_agendalandingpage/2019/voster-font.svg') format('svg')
}

@font-face {
    font-family: garris-light;
    src:
        url('../../../fonts/mrwonderful_agendalandingpage/2019/garris-light.ttf') format('truetype'),
        url('../../../fonts/mrwonderful_agendalandingpage/2019/garris-light.otf') format("opentype"),
        url('../../../fonts/mrwonderful_agendalandingpage/2019/garris-light.woff') format('woff'),
        url('../../../fonts/mrwonderful_agendalandingpage/2019/garris-light.woff2') format('woff2'),
        url('../../../fonts/mrwonderful_agendalandingpage/2019/garris-light.svg#trueNorth') format('svg')
}

@font-face {
    font-family: zeta-font-heavy;
    src:
        url('../../../fonts/mrwonderful_agendalandingpage/2019/Zetafonts-CocoGothic-Heavy.otf') format("opentype")
}

@-webkit-keyframes GradientAnimation {
    0%{background-position: 0% 50%}
    50%{background-position: 100% 50%}
    100%{background-position: 0% 50%}
}

@-moz-keyframes GradientAnimation {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}

@-o-keyframes GradientAnimation {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}

@keyframes GradientAnimation {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}

.header-box {position: relative; width: 100%}
.agenda-wrapper-2019 {width: 415px; margin: 0 auto; text-align: center; margin-bottom: 35px;}
.agenda-wrapper-2019 .category-sfere {width: 33%;}
.agenda-wrapper-2019 .category-sfere a {text-decoration: none;}
.agenda-wrapper-2019 .category-sfere a p {color: #747474; font-weight: 600;}
.agenda-wrapper-2019 .category-sfere:nth-child(1){float: left;}
.agenda-wrapper-2019 .category-sfere:nth-child(2){display: inline-block;}
.agenda-wrapper-2019 .category-sfere:nth-child(3){float: right;}
.agenda-wrapper-2019 .category-sfere img {width: 85%; border-radius: 100%; margin: 0 auto; margin-bottom: 8px; cursor: pointer; padding: 4px;}
.category-selected {border: 3px solid pink;}
.category-item {padding-top: 20px; display: inline-block; vertical-align: top;}
.category-item:not(.complete):not(:last-child) { margin-right: 0%; }
.category-container-box .row-padding-right { padding-right: 10px; }
.category-container-box .row-padding-left { padding-left: 10px; }
.category-container-box .row-padding-both { padding-right: 10px; padding-left: 10px; }
.category-item .category-name-container .category-name {border-radius: 25px; height: 45px; position: absolute; width: 100%; z-index: 0; top: 6%}
.category-item .category-name-container h2 span { position: relative; font-family: 'fenotype-vodka-sans'; text-transform: none; font-size: 40px; line-height: 35px; vertical-align: middle; }
.category-item .category-name-container h2.clas { padding: 7px; border-radius: 35px; color: #336daa; text-align: center; background-image: url(../../../images/mrwonderful_agendalandingpage/2019/patron/1.jpg); background-size: contain; }
.category-item .category-name-container h2.rotu { padding: 7px; border-radius: 35px; color: #005095; text-align: center; background-image: url(../../../images/mrwonderful_agendalandingpage/2019/patron/3.jpg); background-size: contain;}
.category-item .category-name-container h2.bull { padding: 7px; border-radius: 35px; color: #ffb4d2; text-align: center; background-image: url(../../../images/mrwonderful_agendalandingpage/2019/patron/4.jpg); background-size: contain;}
.category-item .category-name-container h2.pequ { padding: 7px; border-radius: 35px; color: #005095; text-align: center; background-image: url(../../../images/mrwonderful_agendalandingpage/2019/patron/2.jpg); background-size: contain;}
.category-item .category-name-container h2.clas span { background-color: #bfe6f4; }
.category-item .category-name-container h2.bull span { background-color: #005095; }
.category-item .category-name-container h2.pequ span { background-color: #ffb4d2; }
.category-item .category-name-container h2.rotu span { background-color: #aaecf0; }
.category-item.quarter {width: 25%;}
.category-item.medium {width: 50%;}
.category-item.threequarters {width: 72%;}
.category-item.complete {width: 100%;}
.products-grid .item.quarter {width: 100%;}
.products-grid .item.medium {width: 48%;}
.products-grid .item.threequarters {width: 31%;}
.products-grid .item.complete {width: 24%; margin-right: 0;}
.banner-2019 {display: none}
.category-name-container {position: relative;}
.page .products-grid .item { clear: none; }
.categories-footer-text p { column-count: 2; column-gap: 35px; text-align: justify; }

.reserve-landing-page-agenda-shcool {font-size: 26px; text-transform: uppercase; font-family: 'voster-font'; }
.reserve-header { background-color: #1BA7B2; padding: 2em 0; }
.reserve-header.nologin { padding: 1em 0; }
.reserve-header div { margin: 0 auto; color: white; text-shadow: 2px 2px 0px #CBA6B2; }
.reserve-header img, .reserve-header .pre-title { width: 80%; margin: 0 auto; font-weight: bold; }
.reserve-header img.header-1 { max-width: 349px; }
.reserve-header.nologin img.header-1 { max-width: 515px; } 
.reserve-header img.cwam-logo { margin-top: 0.8em; max-width: 329px; }
.reserve-header div span { font-size: 34px; }
.reserve-header .rotate { transform: rotate(-2deg); }
.reserve-header .pre-title { background-color: #FFCEDE; padding: 8px 8px 3px 8px; max-width: 500px; text-align: center; border-radius: 8px; -webkit-box-shadow: 5px 5px 0px 0px rgba(23,143,167,1); -moz-box-shadow: 5px 5px 0px 0px rgba(23,143,167,1); box-shadow: 5px 5px 0px 0px rgba(23,143,167,1); text-shadow: 1px 1px 0px #FFA1C3; }
.reserve-body { background-image: url(../../../images/mrwonderful_agendalandingpage/2019/patron/landing-page-pattern.jpg); padding: 1.5em 0; border-top: 5px solid white; }
.reserve-body .reserve-content { margin: 0 auto; max-width: 800px; text-align: center; padding: 0.5em 1em; background-color: #71ebfa; }
.reserve-body .reserve-content .text-style-1 { color: white; font-style: italic; text-transform: initial; position: relative; margin-top: 40px; font-family: 'garris-light'; font-size: 40px; line-height: 40px; text-shadow: 1px 1px 0px #02B6AF; font-weight: bold;}
.reserve-body .reserve-content .text-style-1:before { content: url(../../../images/mrwonderful_agendalandingpage/2019/reserve/text-style-1.png); position: absolute; top: -40px; left: 0; right: 0; }
.reserve-body .reserve-content .text-style-2 { color: #1BA8B3; font-size: 30px; }
.reserve-body .reserve-content.nologin .text-style-1:before { content: ''; }
.reserve-body .reserve-content.nologin .text-style-1 { font-family: 'voster-font'; font-style: normal; background-color: pink; width: 60%; margin: 0 auto; padding-top: 10px; transform: rotate(-2deg); border-radius: 10px; margin-bottom: 10px; box-shadow: 3px 4px rgb(78, 187, 209); text-shadow: 2px 2px 3px #e098a4; }
.reserve-body .reserve-content .text-style-3 { color: white; background-color: #FFCEDE; padding: 8px 8px 3px 8px; margin: 0 auto; border-radius: 25px; -webkit-box-shadow: 0px 5px 0px 0px rgba(23,143,167,1); -moz-box-shadow: 0px 5px 0px 0px rgba(23,143,167,1); box-shadow: 0px 5px 0px 0px rgba(23,143,167,1); max-width: 500px; text-shadow: 1px 1px 0px #FFA1C3; font-style: 30px; font-weight: bold; }
.reserve-body .reserve-content.nologin .text-style-3 { letter-spacing: 3px; background-color: #DAB0EA; box-shadow: 0px 5px 0px 0px #BA85D4; text-shadow: -2px 2px 0px #BA85D4; }
.reserve-body .reserve-content img { width: 80%; margin: 1em auto 0 auto; }
.reserve-body .reserve-form-content { padding: 0.5em; padding-bottom: 1em; max-width: 500px; background-color: #D2BCE9; color: white; margin: 2em auto 0 auto; border-radius: 25px; text-shadow: 2px 2px 0px #B1A9E0; -webkit-box-shadow: 3px 3px 0px 0px #52CAD0; -moz-box-shadow: 3px 3px 0px 0px #52CAD0; box-shadow: 3px 3px 0px 0px #52CAD0; }
.reserve-body .reserve-content img.mobile { display: none; }
#agendacode-submit { margin: 1em auto;  border-radius: 25px; font-weight: bold; font-family: 'voster-font'; font-size: 24px; padding: 18px 20px 12px 20px; font-weight: bold; }
.reserve-landing-page-agenda-shcool .message.error { font-size: 16px; }
.reserve-body .reserve-conditions { margin: 0 auto; max-width: 500px; font-size: 16px; color: white; }
.loading-icon { max-width: 160px; margin: 10em auto }
@media only screen and (max-width: 820px) {
    .page .agenda-wrapper-2019 {width: 60%; margin: unset; margin-bottom: 20px; display: inline-block; vertical-align: middle;}
    .page .agenda-wrapper-2019 .category-sfere a p {font-size: 8px; font-weight: 400; line-height: 12px; padding-top: 4px; overflow: hidden;}
    .page .agenda-wrapper-2019 .category-sfere img {margin-bottom: 0; padding: 2px;}
    .page .category-item.threequarters, .page .category-item.quarter, .page .category-item.medium {width: 100%}
    .page .category-item.quarter .category-products {width: 50%;}
    .page .category-item.medium .category-products {width: 100%;}
    .page .category-item.medium .category-products li {width: 47%;}
    .page .category-item.complete .category-products li {width: 47%; clear: none; margin-right: 8px;}
    .page .banner-2019 {width: 30%; height: 70px; display: inline-block; vertical-align: middle;}
    .page .products-grid .item { clear: none; margin-right: 2%; }
    .page .products-grid .threequarters { width: 48%; }
    .page .banner-2019 img {width: 100%;}
    .page h1 {font-size: 26px;}
    .categories-footer-text p { column-count: 1; }
    .category-item .category-name-container .category-name + h2 { font-size: 30px; }
}

@media only screen and (max-width: 959px) {
    .page .products-grid li.complete {
        width: 23%;
        margin-right: 2%;
        clear: none;
    }
}

@media only screen and (max-width: 500px) {
    .category-item .category-name-container .category-name + h2 { font-size: 25px; }
    .header-box.sticky-top-fixed {top: 51px; position: fixed; background-color: white; z-index: 998; padding-top: 10px;}
    .header-box.sticky-top-fixed .agenda-wrapper-2019 {margin-bottom: 0;}
    .reserve-body .reserve-content img.mobile { display: block; width: 100%; }
    .reserve-body .reserve-content img.desktop { display: none; }
    .reserve-body .reserve-form-content { margin-top: 1em; }
    .reserve-body .reserve-content { margin: 1em; }
    .reserve-landing-page-agenda-shcool { font-size: 24px; }
    .reserve-body .reserve-content .text-style-1 { font-size: 28px; }
    .reserve-body .reserve-content .text-style-2 { font-size: 24px; }
}

.reserve-landing-page-agenda-shcool {font-size: 26px; text-transform: uppercase; font-family: 'voster-font'; }
.reserve-landing-page-agenda-shcool .message.error { font-size: 16px; color: white }

.reserve-body { padding-top: 0; }
.reserve-body .reserve-content { max-width: none; padding: 0;  background-image: url(../../../images/mrwonderful_agendalandingpage/2019/patron/landing-page-pattern.jpg); margin:0 auto;}
.reserve-landing-content { max-width: 800px; text-align: center; margin: 0 auto; background-color: #71ebfa}
.reserve-body .reserve-content .header { position: relative; margin-bottom: 45px; padding: 20px 0 10px 0; background-color: #324490; height: auto; width: 100%; text-align: center; font-family: 'zeta-font-heavy'; color: #D6E1D0 }
.reserve-body .reserve-content .header:before { content: url(../../../images/mrwonderful_agendalandingpage/2020/flecha-izquierda.png); position: absolute; left: 265px; top: 40px;}
.reserve-body .reserve-content .header:after { content: url(../../../images/mrwonderful_agendalandingpage/2020/flecha-derecha.png); position: absolute; right: 265px; top: 40px;}
.reserve-body .reserve-content .title .first-text { font-family: 'zeta-font-heavy'; background-color: #32448f; color: #71ebfa; padding: 10px 20px 3px 20px; letter-spacing: 5px; border-radius: 20px; }
.reserve-body .reserve-content .title .second-text { color: #324490; background-color:#fef8c4; font-family: 'zeta-font-heavy'; max-width: 800px; margin: 0 auto;  padding: 6px 20px 0px 20px;}
.reserve-body .reserve-content .title .tercer-texto, .reserve-body .reserve-content .title .cuarto-texto { color: white; font-family: 'zeta-font-heavy'; letter-spacing: 2px; text-shadow: 2px 2px #4cd3e4; font-size: 30px; }
.reserve-body .reserve-content .title .tercer-texto span { border-radius: 30px; padding: 9px 20px 0px 20px; color: #d519a7; background-color: white; text-shadow: none;}
.reserve-body .reserve-content .reserve-form-content {background-color: #ff78d0; position: relative;}
.reserve-body .reserve-content .reserve-form-content .title { font-family: 'zeta-font-heavy'; font-size: 20px; text-shadow: none; }
.reserve-body .reserve-content .title img { width: 660px; margin-bottom: 45px; }
.reserve-body .reserve-content .title img.corazones { width: 200px; margin-right: 160px; }
.reserve-body .reserve-content .reserve-form-content:before {content: url(../../../images/mrwonderful_agendalandingpage/2020/flecha-izquierda.png); position: absolute; left: -115px; top: 45px;}
.reserve-body .reserve-content .reserve-form-content:after {content: url(../../../images/mrwonderful_agendalandingpage/2020/flecha-derecha.png); position: absolute; right: -115px; top: 45px;}
.reserve-body .reserve-content #agendacode-submit { font-family: 'zeta-font-heavy'; background-color: #324490; position: relative;}
.reserve-body .reserve-content #agendacode-submit:before { content: url(../../../images/mrwonderful_agendalandingpage/2020/confeti-izquierda.png); position: absolute; top: -8px; left: -45px;}
.reserve-body .reserve-content #agendacode-submit:after { content: url(../../../images/mrwonderful_agendalandingpage/2020/confeti-derecha.png); position: absolute; top: -8px; right: -45px;}


@media only screen and (max-width: 1100px) {
    .reserve-body .reserve-content .header:before { left: 190px; }
    .reserve-body .reserve-content .header:after { right: 190px; }
}

@media only screen and (max-width: 1050px) {
    .reserve-body .reserve-content .header:before { left: 150px; }
    .reserve-body .reserve-content .header:after { right: 150px; }
}

@media only screen and (max-width: 900px) {
    .reserve-body .reserve-content .header:before { left: 100px; }
    .reserve-body .reserve-content .header:after { right: 100px; }
}

@media only screen and (max-width: 800px) {
    .reserve-body .reserve-content .header:before,
    .reserve-body .reserve-content .header:after,
    .reserve-body .reserve-content .reserve-form-content:before,
    .reserve-body .reserve-content .reserve-form-content:after { display: none; }
    .reserve-body .reserve-content .title .first-text,
    .reserve-body .reserve-content .title .second-text,
    .reserve-body .reserve-content .title .tercer-texto,
    .reserve-body .reserve-content .title .cuarto-texto { font-size: 20px; }
}

@media only screen and (max-width: 680px) {
    .reserve-body .reserve-content .title img { width: 500px; }

}

@media only screen and (max-width: 600px) {
    .reserve-body .reserve-content .title img { width: 400px; margin-bottom: 20px;}
    .reserve-body .reserve-content img { margin: 0px 20px; }
    .reserve-body .reserve-content .title .first-text,
    .reserve-body .reserve-content .title .second-text,
    .reserve-body .reserve-content .title .tercer-texto,
    .reserve-body .reserve-content .title .cuarto-texto,
    .reserve-body .reserve-content .reserve-form-content .title,
    .reserve-body .reserve-content #agendacode-submit { font-size: 16px; }
    .reserve-body .reserve-form-content { max-width: 350px; }
    .reserve-body .reserve-content .header { font-size: 20px; }
    .reserve-body .reserve-content #agendacode-submit:before,
    .reserve-body .reserve-content #agendacode-submit:after { display: none; }
    .reserve-body .reserve-content .title img.corazones { width: 150px; }
}

@media only screen and (max-width: 500px) {
.reserve-body .reserve-content .title img { width: 330px; margin-bottom: 10px; }
    .reserve-body .reserve-content .title .first-text,
    .reserve-body .reserve-content .title .second-text,
    .reserve-body .reserve-content .title .tercer-texto,
    .reserve-body .reserve-content .title .cuarto-texto,
    .reserve-body .reserve-content .reserve-form-content .title { font-size: 14px; }
    .reserve-body .reserve-content .header { font-size: 16px; }
    .reserve-body .reserve-form-content { max-width: 280px; }
    .reserve-body .reserve-content .title .tercer-texto span { display: block; }
}


@media only screen and (max-width: 450px) {
    .reserve-body .reserve-content .title img { width: 290px; margin-bottom: 10px; }
    .reserve-body .reserve-content .title .first-text,
    .reserve-body .reserve-content .title .second-text,
    .reserve-body .reserve-content .title .tercer-texto,
    .reserve-body .reserve-content .title .cuarto-texto,
    .reserve-body .reserve-content .reserve-form-content .title { font-size: 12px; }
    .reserve-body .reserve-content .header { font-size: 14px; }
}