@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600');

@font-face { font-family: "Capture"; src: url("template20/capture-it-webfont.eot?v=19"); src: url("template20/capture-it-webfont.eot?v=19#iefix") format("embedded-opentype"), url("template20/capture-it-webfont.woff?v=19") format("woff"), url("template20/capture-it-webfont.ttf?v=19") format("truetype"), url("template20/capture-it-webfont.svg?v=19#crossfit") format("svg"); font-weight: normal; font-style: normal; }

a.button.white { background: #fff; color: #000; font-weight: bold; }
    a.button.white:hover { background: #000; color: #fff; }

.WodDesc h1, .WodDesc h2 { font-family: Capture; text-transform: uppercase; }
.WodDesc h1 { text-align: center; }
.WodDesc h2 { margin-top: 0.5rem; }

.presentacion { background-size: cover; background-position: center; background-attachment: fixed; text-align: center; }
    .presentacion h1 { font-family: Capture; text-transform: uppercase; color: #fff; margin: 2rem 0 0 0; font-size: 3rem; overflow: hidden; }
    .presentacion h2 { font-family: Capture; text-transform: uppercase; color: #fff; position: relative; font-size: 2rem; padding-top: 1rem; margin: 1.5rem auto; overflow: hidden; }
        .presentacion h2:before { border-top: 1px solid #fff; content: ""; left: 25%; position: absolute; top: 0; width: 50%; }
        .presentacion h2:after { background: #fff; content: ""; height: 9px; left: 50%; margin: -4px 0 0 -9px; position: absolute; top: 0; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); width: 9px; }

    .presentacion .wrapper { width: 100%; height: 100%; background: rgba(0,0,0,0.5); padding: 2rem 0 3rem 0; }
ul.nav { list-style: none; padding: 0; margin: 1rem 0 0 0; }
.nav li { display: inline-block; list-style: none; color: #fff; padding: 0; margin: 0 1rem; transition: transform 0.2s; }
    .nav li:hover { transform: scale(1.3); transition: transform 0.2s; }
.nav i { font-size: 3rem; }
.nav a { color: #fff; }
.nav span { display: block; font-family: 'Open Sans', sans-serif; font-weight: 600; line-height: normal; }

.seccion { margin: 2rem 0 0 0; }
    .seccion h2 { font-family: Capture; text-transform: uppercase; text-align: center; overflow: hidden; }
        .seccion h2 span { color: #000; display: inline-block; padding: 0; position: relative; font-size: 2.75rem; }
            .seccion h2 span:before { border-top: 1px solid #d1d1d1; content: ""; display: block; height: 1px; left: -160px; position: absolute; top: 2.25rem; width: 160px; z-index: 0; }
            .seccion h2 span:after { border-top: 1px solid #d1d1d1; content: ""; display: block; height: 1px; right: -160px; position: absolute; top: 2.25rem; width: 160px; z-index: 0; }
    .seccion h3 { text-align: center; font-family: Capture; text-transform: uppercase; color: #a89c72; margin-bottom: 1rem; }
    .seccion video { cursor: pointer; }
    .seccion p { font-family: 'Open Sans', sans-serif; text-align: justify; color: #444; line-height: 2; }

#quees .flex-video { padding-top: 0; margin-bottom: 0; }

#elBox .photogrid { height: 20rem; }
    #elBox .photogrid * { height: 100%; }
    #elBox .photogrid a { display: block; background-size: cover; background-position: center; }
#elBox ul.gallery { margin: 0; padding: 0; list-style: none; width: 100%; height: 100%; position: relative; }
    #elBox ul.gallery li { margin: 0; padding: 0; list-style: none; width: 100%; height: 100%; position: absolute; display: none; border: 1px solid #fff; }
        #elBox ul.gallery li:nth-child(1) { width: 66.66%; height: 50%; top: 0; left: 0; border-width: 0 0.125rem 0.125rem 0; }
        #elBox ul.gallery li:nth-child(2) { width: 66.66%; height: 50%; top: 50%; left: 0; border-width: 0.125rem 0.125rem 0 0; }
        #elBox ul.gallery li:nth-child(3) { width: 33.33%; height: 33.33%; top: 0; left: 66.66%; border-width: 0 0 0.125rem 0.125rem; }
        #elBox ul.gallery li:nth-child(4) { width: 33.33%; height: 33.33%; top: 33.33%; left: 66.66%; border-width: 0.125rem 0 0.125rem 0.125rem; }
        #elBox ul.gallery li:nth-child(5) { width: 33.33%; height: 33.33%; top: 66.66%; left: 66.66%; border-width: 0.125rem 0 0 0.125rem; }
        #elBox ul.gallery li:nth-child(-n+5) { display: block; }

#coaches .row { padding: 0.9375rem; margin-bottom: 2rem; }
#coaches .column { padding: 0; }
#coaches { background-size: cover; background-position: center; background-attachment: fixed; padding-bottom: 4rem; }
    #coaches h2 { padding-top: 4rem; }
        #coaches h2 span, #coaches h3 { color: #fff; }
.coachtable { display: table; width: 100%; font-size: 1.15rem; }
    .coachtable .info { display: table-cell; width: 50%; text-align: center; vertical-align: middle; background: #fff; position: relative; padding: 0 1.5rem; }
    .coachtable .photo { display: table-cell; width: 50%; overflow: hidden; }
        .coachtable .photo img { animation-name: imgefxout; animation-duration: 1.5s; transform: none; }
    .coachtable:hover .photo img { animation-name: imgefx; animation-duration: 1.5s; transform: rotate(5deg) scale(1.3); }
    .coachtable .info hr { margin: 1rem auto 1rem auto !important; padding: 0 0 6px 0 !important; width: 80%; top: 0; border: none; border-top: 1px solid #d5d5d5; clear: both; display: block; position: relative; }
        .coachtable .info hr:before { background: #d5d5d5; content: ""; height: 9px; left: 50%; margin: -4px 0 0 -4px; position: absolute; top: -1px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); width: 9px; }
    .coachtable .button { background: #444; margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
        .coachtable .button:hover { background: #000; }

#actividades .event { overflow: hidden; text-overflow: ellipsis; line-height: 4; border-radius: 5px; text-align: center; white-space: nowrap; margin-bottom: 0.9375rem; margin-top: 0.9375rem; }
    #actividades .event.conhtml { cursor: pointer; transform: none; animation-name: divfxout; animation-duration: 0.5s; }
        #actividades .event.conhtml:hover { animation-name: divfx; animation-duration: 0.5s; transform: scale(1.1); }

#horario { padding: 0 0.9375rem; }
    #horario td { padding: 0; vertical-align: top; max-width: 0; overflow: hidden; }
        #horario td:nth-child(1) { max-width: initial; text-align: center; }
        #horario td span { text-overflow: ellipsis; overflow: hidden; display: block; }
    #horario .event { text-align: center; padding: 0.35rem; min-height: 1.5rem; }
    #horario th span { display: none; }
    #horario .event span { display: none; }

#contacto { background-size: cover; background-position: center; background-attachment: fixed; padding-bottom: 4rem; margin-top: 0; }
    #contacto h2 { padding-top: 4rem; margin-top: 0; }
        #contacto h2 span, #contacto h3 { color: #fff; }
    #contacto form { background: rgba(255,255,255,0.9); padding: 2rem; }
    #contacto textarea { height: 7rem; }

#tarifas { background: #173d50; padding-bottom: 4rem; }
    #tarifas h2 { padding-top: 2rem; margin-top: 0; }
        #tarifas h2 span { color: #fff; }
    #tarifas .text-center h3 { margin: 3rem 0 1rem 0; color: #fff; }
    #tarifas h3 { color: #ebe8de; margin-bottom: 2rem; }
.tarifa { background: #fff; border-radius: 2px; color: #173d50; padding: 0.5rem; }
    .tarifa .nombre { text-transform: uppercase; text-align: center; padding: 1rem 0 0 0; font-weight: 700; }
    .tarifa .precio { text-align: center; font-size: 2rem; font-weight: 700; margin: 0.5rem 0; }
        .tarifa .precio .dec { font-size: 0.75rem; font-weight: normal; }
        .tarifa .precio .per { font-size: 1.25rem; font-weight: normal; }
    .tarifa .qual { background: #f7fafb; line-height: 1.325rem; margin: 0 0 0.325rem 0; padding: 0.5rem 0.1rem 0.5rem 0.5rem; text-align: left; }
        .tarifa .qual:nth-child(2n+1) { background: #f1f4f5; }
    .tarifa .periodos { background: #0c1f28; color: #e6f0f7; text-align: center; padding: 0.325rem 0; margin: 0 0 0.325rem 0; }
        .tarifa .periodos .dec { font-size: 75%; }
    .tarifa .panelcontratar .button { margin: 0.25rem 0 0.25rem 0; }
#tarifas .columns { padding-bottom: 1.875rem; }
#tarifas .extraHtml { font-size: 80%; text-align: center; background: #173d50; color: #fff; padding: 0.15rem 0.25rem; margin-bottom: 0.25rem; }

.nosabado table.horarios td:nth-child(7),
.nosabado table.horarios th:nth-child(7),
.nodomingo table.horarios td:nth-child(8),
.nodomingo table.horarios th:nth-child(8) { display: none }

@media only screen and (max-width: 40.0624em) {
    #coaches .column:nth-child(2n+1) .coachtable .photoR { display: none; }
    #coaches .column:nth-child(2n) .coachtable .photoL { display: none; }
    #coaches .column:nth-child(2n+1) .info:before { border: 1rem solid #fff; border-bottom-color: transparent; border-left-color: transparent; border-top-color: transparent; content: ""; display: block; left: -2rem; position: absolute; top: calc(50% - 1rem); }
    #coaches .column:nth-child(2n) .info:before { border: 1rem solid #fff; border-bottom-color: transparent; border-right-color: transparent; border-top-color: transparent; content: ""; display: block; right: -2rem; position: absolute; top: calc(50% - 1rem); }
}

@media only screen and (min-width: 40.0625em) {
    #coaches .nolast .coachtable.verse .photoR { display: none; }
    #coaches .nolast .coachtable.reverse .photoL { display: none; }
    #coaches .nolast .coachtable.verse .info:before { border: 1rem solid #fff; border-bottom-color: transparent; border-left-color: transparent; border-top-color: transparent; content: ""; display: block; left: -2rem; position: absolute; top: calc(50% - 1rem); }
    #coaches .nolast .coachtable.reverse .info:before { border: 1rem solid #fff; border-bottom-color: transparent; border-right-color: transparent; border-top-color: transparent; content: ""; display: block; right: -2rem; position: absolute; top: calc(50% - 1rem); }

    #coaches .last { float: none; margin: 0 auto; clear: both; }
        #coaches .last .coachtable.verse .photoL { display: none; }
        #coaches .last .coachtable.reverse .photoR { display: none; }
        #coaches .last .coachtable.verse .info:before { border: 1rem solid #fff; border-bottom-color: transparent; border-right-color: transparent; border-top-color: transparent; content: ""; display: block; right: -2rem; position: absolute; top: calc(50% - 1rem); }
        #coaches .last .coachtable.reverse .info:before { border: 1rem solid #fff; border-bottom-color: transparent; border-left-color: transparent; border-top-color: transparent; content: ""; display: block; left: -2rem; position: absolute; top: calc(50% - 1rem); }

    #horario th span { display: inline; }
    #horario .event span { display: block; }
}

#whatsapp a { position: fixed; bottom: 1rem; right: 1rem; z-index: 1000; }
#whatsapp img { width: 4rem; height: 4rem; border-radius: 50%; }

@keyframes imgefx {
    from { transform: none; }
    to { transform: rotate(5deg) scale(1.3); }
}

@keyframes imgefxout {
    from { transform: rotate(5deg) scale(1.3); }
    to { transform: none; }
}

@keyframes divfx {
    from { transform: none; }
    to { transform: scale(1.1); }
}

@keyframes divfxout {
    from { transform: scale(1.1); }
    to { transform: none; }
}