html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } /*! normalize.css v3.0.2 | MIT License | git.io/normalize */ /** * 1. Set default font family to sans-serif. * 2. Prevent iOS text size adjust after orientation change, without disabling * user zoom. */ html { font-family: sans-serif; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ touch-action: none; -ms-touch-action: none; } /** * Remove default margin. */ body { margin: 0; } /* HTML5 display definitions ========================================================================== */ /** * Correct `block` display not defined for any HTML5 element in IE 8/9. * Correct `block` display not defined for `details` or `summary` in IE 10/11 * and Firefox. * Correct `block` display not defined for `main` in IE 11. */ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; } /** * 1. Correct `inline-block` display not defined in IE 8/9. * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. */ audio, canvas, progress, video { display: inline-block; /* 1 */ vertical-align: baseline; /* 2 */ } /** * Prevent modern browsers from displaying `audio` without controls. * Remove excess height in iOS 5 devices. */ audio:not([controls]) { display: none; height: 0; } /** * Address `[hidden]` styling not present in IE 8/9/10. * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22. */ [hidden], template { display: none; } /* Links ========================================================================== */ /** * Remove the gray background color from active links in IE 10. */ a { background-color: transparent; } /** * Improve readability when focused and also mouse hovered in all browsers. */ a:active, a:hover { outline: 0; } /* Text-level semantics ========================================================================== */ /** * Address styling not present in IE 8/9/10/11, Safari, and Chrome. */ abbr[title] { border-bottom: 1px dotted; } /** * Address style set to `bolder` in Firefox 4+, Safari, and Chrome. */ b, strong { font-weight: bold; } /** * Address styling not present in Safari and Chrome. */ dfn { font-style: italic; } /** * Address variable `h1` font-size and margin within `section` and `article` * contexts in Firefox 4+, Safari, and Chrome. */ h1 { font-size: 2em; margin: 0.67em 0; } /** * Address styling not present in IE 8/9. */ mark { background: #ff0; color: #000; } /** * Address inconsistent and variable font size in all browsers. */ small { font-size: 80%; } /** * Prevent `sub` and `sup` affecting `line-height` in all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } /* Embedded content ========================================================================== */ /** * Remove border when inside `a` element in IE 8/9/10. */ img { border: 0; } /** * Correct overflow not hidden in IE 9/10/11. */ svg:not(:root) { overflow: hidden; } /* Grouping content ========================================================================== */ /** * Address margin not present in IE 8/9 and Safari. */ figure { margin: 1em 40px; } /** * Address differences between Firefox and other browsers. */ hr { -moz-box-sizing: content-box; box-sizing: content-box; height: 0; } /** * Contain overflow in all browsers. */ pre { overflow: auto; } /** * Address odd `em`-unit font size rendering in all browsers. */ code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; } /* Forms ========================================================================== */ /** * Known limitation: by default, Chrome and Safari on OS X allow very limited * styling of `select`, unless a `border` property is set. */ /** * 1. Correct color not being inherited. * Known issue: affects color of disabled elements. * 2. Correct font properties not being inherited. * 3. Address margins set differently in Firefox 4+, Safari, and Chrome. */ button, input, optgroup, select, textarea { color: inherit; /* 1 */ font: inherit; /* 2 */ margin: 0; /* 3 */ } /** * Address `overflow` set to `hidden` in IE 8/9/10/11. */ button { overflow: visible; } /** * Address inconsistent `text-transform` inheritance for `button` and `select`. * All other form control elements do not inherit `text-transform` values. * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. * Correct `select` style inheritance in Firefox. */ button, select { text-transform: none; } /** * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` * and `video` controls. * 2. Correct inability to style clickable `input` types in iOS. * 3. Improve usability and consistency of cursor style between image-type * `input` and others. */ button, html input[type="button"], /* 1 */ input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ } /** * Re-set default cursor for disabled elements. */ button[disabled], html input[disabled] { cursor: default; } /** * Remove inner padding and border in Firefox 4+. */ button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } /** * Address Firefox 4+ setting `line-height` on `input` using `!important` in * the UA stylesheet. */ input { line-height: normal; } /** * It's recommended that you don't attempt to style these elements. * Firefox's implementation doesn't respect box-sizing, padding, or width. * * 1. Address box sizing set to `content-box` in IE 8/9/10. * 2. Remove excess padding in IE 8/9/10. */ input[type="checkbox"], input[type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } /** * Fix the cursor style for Chrome's increment/decrement buttons. For certain * `font-size` values of the `input`, it causes the cursor style of the * decrement button to change from `default` to `text`. */ input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; } /** * 1. Address `appearance` set to `searchfield` in Safari and Chrome. * 2. Address `box-sizing` set to `border-box` in Safari and Chrome * (include `-moz` to future-proof). */ input[type="search"] { -webkit-appearance: textfield; /* 1 */ -moz-box-sizing: content-box; -webkit-box-sizing: content-box; /* 2 */ box-sizing: content-box; } /** * Remove inner padding and search cancel button in Safari and Chrome on OS X. * Safari (but not Chrome) clips the cancel button when the search input has * padding (and `textfield` appearance). */ input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } /** * Define consistent border, margin, and padding. */ fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } /** * 1. Correct `color` not being inherited in IE 8/9/10/11. * 2. Remove padding so people aren't caught out if they zero out fieldsets. */ legend { border: 0; /* 1 */ padding: 0; /* 2 */ } /** * Remove default vertical scrollbar in IE 8/9/10/11. */ textarea { overflow: auto; } /** * Don't inherit the `font-weight` (applied by a rule above). * NOTE: the default cannot safely be changed in Chrome and Safari on OS X. */ optgroup { font-weight: bold; } /* Tables ========================================================================== */ /** * Remove most spacing between table cells. */ table { border-collapse: collapse; border-spacing: 0; } td, th { padding: 0; }/** * Swiper 3.4.2 * Most modern mobile touch slider and framework with hardware accelerated transitions * * http://www.idangero.us/swiper/ * * Copyright 2017, Vladimir Kharlampidi * The iDangero.us * http://www.idangero.us/ * * Licensed under MIT * * Released on: March 10, 2017 */ .swiper-container{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;z-index:1}.swiper-container-no-flexbox .swiper-slide{float:left}.swiper-container-vertical>.swiper-wrapper{-webkit-box-orient:vertical;-moz-box-orient:vertical;-ms-flex-direction:column;-webkit-flex-direction:column;flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-transition-property:-webkit-transform;-moz-transition-property:-moz-transform;-o-transition-property:-o-transform;-ms-transition-property:-ms-transform;transition-property:transform;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}.swiper-container-android .swiper-slide,.swiper-wrapper{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-o-transform:translate(0,0);-ms-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.swiper-container-multirow>.swiper-wrapper{-webkit-box-lines:multiple;-moz-box-lines:multiple;-ms-flex-wrap:wrap;-webkit-flex-wrap:wrap;flex-wrap:wrap}.swiper-container-free-mode>.swiper-wrapper{-webkit-transition-timing-function:ease-out;-moz-transition-timing-function:ease-out;-ms-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out;margin:0 auto}.swiper-slide{-webkit-flex-shrink:0;-ms-flex:0 0 auto;flex-shrink:0;width:100%;height:100%;position:relative}.swiper-container-autoheight,.swiper-container-autoheight .swiper-slide{height:auto}.swiper-container-autoheight .swiper-wrapper{-webkit-box-align:start;-ms-flex-align:start;-webkit-align-items:flex-start;align-items:flex-start;-webkit-transition-property:-webkit-transform,height;-moz-transition-property:-moz-transform;-o-transition-property:-o-transform;-ms-transition-property:-ms-transform;transition-property:transform,height}.swiper-container .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-wp8-horizontal{-ms-touch-action:pan-y;touch-action:pan-y}.swiper-wp8-vertical{-ms-touch-action:pan-x;touch-action:pan-x}.swiper-button-next,.swiper-button-prev{position:absolute;top:50%;width:27px;height:44px;margin-top:-22px;z-index:10;cursor:pointer;-moz-background-size:27px 44px;-webkit-background-size:27px 44px;background-size:27px 44px;background-position:center;background-repeat:no-repeat}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-prev,.swiper-container-rtl .swiper-button-next{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");left:10px;right:auto}.swiper-button-prev.swiper-button-black,.swiper-container-rtl .swiper-button-next.swiper-button-black{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")}.swiper-button-prev.swiper-button-white,.swiper-container-rtl .swiper-button-next.swiper-button-white{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")}.swiper-button-next,.swiper-container-rtl .swiper-button-prev{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");right:10px;left:auto}.swiper-button-next.swiper-button-black,.swiper-container-rtl .swiper-button-prev.swiper-button-black{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")}.swiper-button-next.swiper-button-white,.swiper-container-rtl .swiper-button-prev.swiper-button-white{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")}.swiper-pagination{position:absolute;text-align:center;-webkit-transition:.3s;-moz-transition:.3s;-o-transition:.3s;transition:.3s;-webkit-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-container-horizontal>.swiper-pagination-bullets,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:10px;left:0;width:100%}.swiper-pagination-bullet{width:8px;height:8px;display:inline-block;border-radius:100%;background:#000;opacity:.2}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-moz-appearance:none;-ms-appearance:none;-webkit-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-white .swiper-pagination-bullet{background:#fff}.swiper-pagination-bullet-active{opacity:1;background:#007aff}.swiper-pagination-white .swiper-pagination-bullet-active{background:#fff}.swiper-pagination-black .swiper-pagination-bullet-active{background:#000}.swiper-container-vertical>.swiper-pagination-bullets{right:10px;top:50%;-webkit-transform:translate3d(0,-50%,0);-moz-transform:translate3d(0,-50%,0);-o-transform:translate(0,-50%);-ms-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:5px 0;display:block}.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 5px}.swiper-pagination-progress{background:rgba(0,0,0,.25);position:absolute}.swiper-pagination-progress .swiper-pagination-progressbar{background:#007aff;position:absolute;left:0;top:0;width:100%;height:100%;-webkit-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0);-webkit-transform-origin:left top;-moz-transform-origin:left top;-ms-transform-origin:left top;-o-transform-origin:left top;transform-origin:left top}.swiper-container-rtl .swiper-pagination-progress .swiper-pagination-progressbar{-webkit-transform-origin:right top;-moz-transform-origin:right top;-ms-transform-origin:right top;-o-transform-origin:right top;transform-origin:right top}.swiper-container-horizontal>.swiper-pagination-progress{width:100%;height:4px;left:0;top:0}.swiper-container-vertical>.swiper-pagination-progress{width:4px;height:100%;left:0;top:0}.swiper-pagination-progress.swiper-pagination-white{background:rgba(255,255,255,.5)}.swiper-pagination-progress.swiper-pagination-white .swiper-pagination-progressbar{background:#fff}.swiper-pagination-progress.swiper-pagination-black .swiper-pagination-progressbar{background:#000}.swiper-container-3d{-webkit-perspective:1200px;-moz-perspective:1200px;-o-perspective:1200px;perspective:1200px}.swiper-container-3d .swiper-cube-shadow,.swiper-container-3d .swiper-slide,.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-wrapper{-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;-ms-transform-style:preserve-3d;transform-style:preserve-3d}.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-container-3d .swiper-slide-shadow-left{background-image:-webkit-gradient(linear,left top,right top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-moz-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-right{background-image:-webkit-gradient(linear,right top,left top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-moz-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-top{background-image:-webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-moz-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-bottom{background-image:-webkit-gradient(linear,left bottom,left top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-moz-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-coverflow .swiper-wrapper,.swiper-container-flip .swiper-wrapper{-ms-perspective:1200px}.swiper-container-cube,.swiper-container-flip{overflow:visible}.swiper-container-cube .swiper-slide,.swiper-container-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-container-cube .swiper-slide .swiper-slide,.swiper-container-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-active .swiper-slide-active,.swiper-container-flip .swiper-slide-active,.swiper-container-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube .swiper-slide-shadow-bottom,.swiper-container-cube .swiper-slide-shadow-left,.swiper-container-cube .swiper-slide-shadow-right,.swiper-container-cube .swiper-slide-shadow-top,.swiper-container-flip .swiper-slide-shadow-bottom,.swiper-container-flip .swiper-slide-shadow-left,.swiper-container-flip .swiper-slide-shadow-right,.swiper-container-flip .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;backface-visibility:hidden}.swiper-container-cube .swiper-slide{visibility:hidden;-webkit-transform-origin:0 0;-moz-transform-origin:0 0;-ms-transform-origin:0 0;transform-origin:0 0;width:100%;height:100%}.swiper-container-cube.swiper-container-rtl .swiper-slide{-webkit-transform-origin:100% 0;-moz-transform-origin:100% 0;-ms-transform-origin:100% 0;transform-origin:100% 0}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-next,.swiper-container-cube .swiper-slide-next+.swiper-slide,.swiper-container-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-container-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0;width:100%;height:100%;background:#000;opacity:.6;-webkit-filter:blur(50px);filter:blur(50px);z-index:0}.swiper-container-fade.swiper-container-free-mode .swiper-slide{-webkit-transition-timing-function:ease-out;-moz-transition-timing-function:ease-out;-ms-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out}.swiper-container-fade .swiper-slide{pointer-events:none;-webkit-transition-property:opacity;-moz-transition-property:opacity;-o-transition-property:opacity;transition-property:opacity}.swiper-container-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-fade .swiper-slide-active,.swiper-container-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-zoom-container{width:100%;height:100%;display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-pack:center;-moz-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-moz-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center;text-align:center}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;object-fit:contain}.swiper-scrollbar{border-radius:10px;position:relative;-ms-touch-action:none;background:rgba(0,0,0,.1)}.swiper-container-horizontal>.swiper-scrollbar{position:absolute;left:1%;bottom:3px;z-index:50;height:5px;width:98%}.swiper-container-vertical>.swiper-scrollbar{position:absolute;right:3px;top:1%;z-index:50;width:5px;height:98%}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:rgba(0,0,0,.5);border-radius:10px;left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;-webkit-transform-origin:50%;-moz-transform-origin:50%;transform-origin:50%;-webkit-animation:swiper-preloader-spin 1s steps(12,end) infinite;-moz-animation:swiper-preloader-spin 1s steps(12,end) infinite;animation:swiper-preloader-spin 1s steps(12,end) infinite}.swiper-lazy-preloader:after{display:block;content:"";width:100%;height:100%;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");background-position:50%;-webkit-background-size:100%;background-size:100%;background-repeat:no-repeat}.swiper-lazy-preloader-white:after{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}@-webkit-keyframes swiper-preloader-spin{100%{-webkit-transform:rotate(360deg)}}@keyframes swiper-preloader-spin{100%{transform:rotate(360deg)}}@font-face { font-family: 'mss-icons'; src: url(fonts/mss-icons.eot); src: url(fonts/mss-icons.eot#iefix) format('embedded-opentype'), url(fonts/mss-icons.ttf) format('truetype'), url(fonts/mss-icons.woff) format('woff'), url(images/mss-icons.svg#mss-icons) format('svg'); font-weight: normal; font-style: normal; } [class^="mss-icon-"], [class*=" mss-icon-"] { /* use !important to prevent issues with browser extensions that change fonts */ font-family: 'mss-icons' !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .mss-icon-cross:before { content: "\e901"; } .mss-icon-drop-down-arrow:before { content: "\e900"; } @font-face { font-family: 'fes-icons'; src: url(fonts/fes-icons.eot); src: url(fonts/fes-icons.eot#iefix) format('embedded-opentype'), url(fonts/fes-icons.ttf) format('truetype'), url(fonts/fes-icons.woff) format('woff'), url(images/fes-icons.svg#fes-icons) format('svg'); font-weight: normal; font-style: normal; font-display: block; } [class^="icon-"], [class*=" icon-"] { /* use !important to prevent issues with browser extensions that change fonts */ font-family: 'fes-icons' !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-tec:before { content: "\e962"; } .icon-ab_core:before { content: "\e900"; } .icon-bal:before { content: "\e901"; } .icon-bbg:before { content: "\e902"; } .icon-bbl:before { content: "\e903"; } .icon-bdb:before { content: "\e904"; } .icon-bow:before { content: "\e905"; } .icon-box:before { content: "\e906"; } .icon-bpp:before { content: "\e907"; } .icon-brb:before { content: "\e908"; } .icon-brp:before { content: "\e909"; } .icon-bsu:before { content: "\e90a"; } .icon-bxg:before { content: "\e90b"; } .icon-cba:before { content: "\e90c"; } .icon-cbd:before { content: "\e90d"; } .icon-cmt:before { content: "\e90e"; } .icon-ddb:before { content: "\e90f"; } .icon-dkb:before { content: "\e910"; } .icon-dmb:before { content: "\e911"; } .icon-fmr:before { content: "\e912"; } .icon-gbl:before { content: "\e913"; } .icon-grd:before { content: "\e914"; } .icon-grp:before { content: "\e915"; } .icon-jrp:before { content: "\e916"; } .icon-ktb:before { content: "\e917"; } .icon-menu_arrow_left:before { content: "\e918"; } .icon-menu_arrow_right:before { content: "\e919"; } .icon-menu1_03:before { content: "\e91a"; } .icon-menu2_03:before { content: "\e91b"; } .icon-menu3_11:before { content: "\e91c"; } .icon-menu4_11:before { content: "\e91d"; } .icon-mgm:before { content: "\e91e"; } .icon-mob:before { content: "\e91f"; } .icon-my_workout1:before { content: "\e920"; } .icon-my_workout2:before { content: "\e921"; } .icon-my_workout4:before { content: "\e922"; } .icon-new_gear:before { content: "\e923"; } .icon-nog:before { content: "\e924"; } .icon-pause_button:before { content: "\e925"; } .icon-pbx:before { content: "\e926"; } .icon-play:before { content: "\e927"; } .icon-reload_button:before { content: "\e928"; } .icon-rfid_check_selections_button:before { content: "\e929"; } .icon-Row:before { content: "\e92a"; } .icon-Rower:before { content: "\e92b"; } .icon-rps:before { content: "\e92c"; } .icon-saq:before { content: "\e92d"; } .icon-single1_03:before { content: "\e92e"; } .icon-single2_03:before { content: "\e92f"; } .icon-single3_03:before { content: "\e930"; } .icon-slb:before { content: "\e931"; } .icon-space:before { content: "\e932"; } .icon-stc:before { content: "\e933"; } .icon-stp:before { content: "\e934"; } .icon-timers1_03:before { content: "\e935"; } .icon-timers2_03:before { content: "\e936"; } .icon-timers3_03:before { content: "\e937"; } .icon-timers4_03:before { content: "\e938"; } .icon-trx:before { content: "\e939"; } .icon-tsc:before { content: "\e93a"; } .icon-tub:before { content: "\e93b"; } .icon-tyr:before { content: "\e93c"; } .icon-uppercase:before { content: "\e93d"; } .icon-vbl:before { content: "\e93e"; } .icon-welcome_wizzard_03:before { content: "\e93f"; } .icon-welcome1_03:before { content: "\e940"; } .icon-welcome2_03:before { content: "\e941"; } .icon-woman:before { content: "\e942"; } .icon-workout_wizzard_03:before { content: "\e943"; } .icon-workout_wizzard1:before { content: "\e944"; } .icon-workout_wizzard2:before { content: "\e945"; } .icon-workout_wizzard3:before { content: "\e946"; } .icon-workout1_03:before { content: "\e947"; } .icon-workout2_03:before { content: "\e948"; } .icon-workout3_03:before { content: "\e949"; } .icon-workout4_03:before { content: "\e94a"; } .icon-workout5_03:before { content: "\e94b"; } .icon-workout6_03:before { content: "\e94c"; } .icon-miniband:before { content: "\e94d"; } .icon-a_back_arrow:before { content: "\e94e"; } .icon-a_delete:before { content: "\e94f"; } .icon-a_enter:before { content: "\e950"; } .icon-a_go_home_arrow:before { content: "\e951"; } .icon-a_group_icon:before { content: "\e952"; } .icon-a_man:before { content: "\e953"; } .icon-a-check-icon-yellow:before { content: "\e954"; } .icon-ot1:before { content: "\e955"; } .icon-bnd:before { content: "\e956"; } .icon-cnx:before { content: "\e957"; } .icon-brg:before { content: "\e958"; } .icon-sdr:before { content: "\e959"; } .icon-row:before { content: "\e95a"; } .icon-gam:before { content: "\e95b"; } .icon-krk:before { content: "\e95c"; } .icon-hts:before { content: "\e95d"; } .icon-sng:before { content: "\e95e"; } .icon-mtr:before { content: "\e95f"; } .icon-car:before { content: "\e960"; } .icon-air:before { content: "\e961"; } /* front blank */ .front.blank .cls-1 { fill: #4c4c4c; } .front.blank .cls-2 { fill: #605a56; } .front.blank .cls-3 { fill: #645c58; } .front.blank .cls-4 { fill: #60615e; } .front.blank .cls-5 { fill: #665c59; } .front.blank .cls-6 { fill: #60605d; } .front.blank .cls-7 { fill: #61635f; } .front.blank .cls-8 { fill: #775252; } .front.blank .cls-9 { fill: #636562; } .front.blank .cls-10 { fill: #646664; } .front.blank .cls-11 { fill: #605b5a; } .front.blank .cls-12 { fill: #6d7070; } .front.blank .cls-13 { fill: #9ea8a3; } .front.blank .cls-14 { fill: #9da7a2; } .front.blank .cls-15 { fill: #635d55; } /* back blank */ .back.blank .cls-1 { fill: #4c4c4c; } .back.blank .cls-2 { fill: #9ea8a3; } .back.blank .cls-3 { fill: #4f4f4e; } .back.blank .cls-4 { fill: #4e4f4f; } .back.blank .cls-5 { fill: #5a5957; } .back.blank .cls-6 { fill: #63635d; } .back.blank .cls-7 { fill: #6f6f6c; } .back.blank .cls-8 { fill: #696b64; } .back.blank .cls-9 { fill: #6b6a66; } .back.blank .cls-10 { fill: #676767; } .back.blank .cls-11 { fill: #5b5c57; } .back.blank .cls-12 { fill: #60625d; } .back.blank .cls-13 { fill: #7f827b; } .back.blank .cls-14 { fill: #606161; } .back.blank .cls-15 { fill: #646460; } .back.blank .cls-16 { fill: #8e9482; } .back.blank .cls-17 { fill: #9ca5a1; } .back.blank .cls-18 { fill: #9ea8a2; } .back.blank .cls-19 { fill: #9da7a1; } .back.blank .cls-20 { fill: #64655d; } .back.blank .cls-21 { fill: #7f837f; } .back.blank .cls-22 { fill: #696d63; } .back.blank .cls-23 { fill: #5f6462; } .back.blank .cls-24 { fill: #6e6e64; } @font-face { font-family: 'Gotham Book'; src: url(fonts/Gotham-Book.otf); font-weight: normal; font-style: normal; } @font-face { font-family: 'Gotham light'; src: url(fonts/Gotham-Light.otf); font-weight: normal; font-style: normal; } @font-face { font-family: 'Gotham bold'; src: url(fonts/Gotham-Bold.otf); font-weight: normal; font-style: normal; } @font-face { font-family: 'Gotham thin'; src: url(fonts/GothamThin.ttf); font-weight: normal; font-style: normal; } @font-face { font-family: 'HelveticaNeue'; src: url(fonts/HelveticaNeueLTCom-BdCn.ttf); font-weight: normal; font-style: normal; } @font-face { font-family: 'Helvetica Neue Regular'; src: url(fonts/HelveticaNeueRegular.ttf); font-weight: normal; font-style: normal; } @font-face { font-family: 'Ubuntu regular'; src: url(fonts/UbuntuRegular.ttf); font-weight: normal; font-style: normal; } @font-face { font-family: 'Ubuntu light'; src: url(fonts/UbuntuLight.ttf); font-weight: normal; font-style: normal; } @font-face { font-family: 'Druk Medium'; src: url(fonts/Druk-Medium.otf); font-weight: normal; font-style: normal; } @font-face { font-family: 'Druk Medium Italic'; src: url(fonts/Druk-MediumItalic.otf); font-weight: normal; font-style: normal; } @font-face { font-family: 'Druk Bold'; src: url(fonts/Druk-Bold.otf); font-weight: normal; font-style: normal; } @font-face { font-family: 'Druk Bold Italic'; src: url(fonts/Druk-BoldItalic.otf); font-weight: normal; font-style: normal; } @font-face { font-family: 'Druk Heavy'; src: url(fonts/Druk-Heavy.otf); font-weight: normal; font-style: normal; } @font-face { font-family: 'Druk Heavy Italic'; src: url(fonts/Druk-HeavyItalic.otf); font-weight: normal; font-style: normal; } @font-face { font-family: 'Druk Super'; src: url(fonts/Druk-Super.otf); font-weight: normal; font-style: normal; } @font-face { font-family: 'Druk Super Italic'; src: url(fonts/Druk-SuperItalic.otf); font-weight: normal; font-style: normal; } @-webkit-keyframes pulse { 0% { transform: scale(1); } 50% { transform: scale(1.08); } 100% { transform: scale(1.16); } } @-webkit-keyframes pulse_border { 0% { border-width: 1px; border-style: solid; border-color: #9fa6ac; } 50% { border-width: 2px; border-style: solid; border-color: #ffe293; } 100% { border-width: 2.5px; border-style: solid; border-color: #FDC41F; } } @-webkit-keyframes loading{ from{ -webkit-transform: scale(1); } to{ -webkit-transform: scale(1.5); } } /* CUSTOM COLORS START */ body, a { color: #EDEDE9; } .primary-color-text { color: #495662; } .secondary-color-text { color: #FDC41F; } .font-color-text { color: #EDEDE9; } .primary-color-bg { background-color: #495662; } .secondary-color-bg { background-color: #FDC41F; } .font-color-bg { background-color: #EDEDE9; } .primary-color-border { border-color: #495662; } .secondary-color-border { border-color: #FDC41F; } .font-color-border { border-color: #EDEDE9; } .secondary-color-border-before::before { border-color: #FDC41F; } .secondary-color-border-right { border-right-color: #FDC41F !important; } .secondary-color-text-before::before { color: #FDC41F; } .secondary-color-outline { outline-color: #FDC41F; } .font-color-bg-before::before { background-color: #EDEDE9; } .font-color-bg-after::after { background-color: #EDEDE9; } .primary-color-lighter-bg { background-color: #5f707f; } .primary-color-bg-before::before { background-color: #495662; } .secondary-color-fill { fill: #FDC41F !important; } .primary-color-shadow { box-shadow: 2px 2px 6px 1px rgba(0,0,0,0.1); } .white-color-bg { background-color: #EDEDE9; } .white-color-text { color: #EDEDE9; } .black-color-text { color: #495662; } .brown-color-text { color: #5B5B5B; } /* CUSTOM COLORS END */ .fes-icon { font-size: 100px; } .workouts.element_menu .fes-icon { font-size: 50px; } .four_menu .element_menu .fes-icon { font-size: 70px; } .workout-wizzard-select .fes-icon { font-size: 80px; } .swiper-slide .slides_images .fes-icon { font-size: 60px; } .woman .fes-icon, .man .fes-icon { font-size: 68px; } .woman.small .fes-icon, .man.small .fes-icon { font-size: 43px; } .gear-item-top-part.small .fes-icon { font-size: 85px; } .page-header.new-header .fes-icon { font-size: 35px; } .left_arrow.fes-icon, .right_arrow.fes-icon { font-size: 95px; } #keyboard_place .fes-icon { font-size: 50px; } .content-section-alphabet .fes-icon { font-size: 50px; } .little_keyboard_block .fes-icon { font-size: 40px; } .checkin-button .fes-icon { font-size: 50px; } .page-header .fes-icon { font-size: 40px; } .interval_wrapper .fes-icon { font-size: 38px; } .countdown_time .interval_wrapper .fes-icon { font-size: 60px; } .background-overlay { position: absolute; width: 100%; height: 100%; background-repeat: no-repeat; overflow: hidden; } .background-overlay::before { content: ' '; position: absolute; width: 100%; height: 100%; opacity: 0; } body { font-family: 'Gotham Book'; } a { text-decoration: none; } :focus, :visited, :active{ outline: none; } .wrapper { height: 1920px; width: 1080px; position: absolute; overflow:hidden; display: block; z-index: 4; } .page { -webkit-transform: translate3d(1080px, 0, 0); } .page-back { -webkit-transform: translate3d(-1080px, 0, 0); } .page.is-visible { -webkit-transition: transform 0.5s ease; -webkit-transform: translate3d(0, 0, 0); } .clear { clear: both; } /* Video */ #videoOverlay { position: absolute; top: 0; left: 0; width: 1080px; height: 1920px; display: none; } #videoOverlay video { object-fit: fill; } #fullScreenOverlay { display: none; width: 1080px; height: 1920px; position: absolute; top: 0; left: 0; z-index: 100; } #loaderOverlay { position: absolute; background-color: rgba(0,0,0,0.5); top: 0; left: 0; width: 1080px; height: 1920px; z-index: 99; display: none; } .explain-video-holder{ width:1080px; height:1280px; } /* Backgrounds */ .background-holder{ height: 1920px; width: 1080px; background-repeat: no-repeat; overflow:hidden; position: relative; } #bodymovin{ height: 280px !important; width: 140px !important; } .main_home_menu-bg { background-image: url(images/main_menu.jpg); } .rfid-page-bg { background-image: url(images/RFID_Check_background.jpg); } .start-checkin-page-bg { background-image: url(images/general-start-checkin.jpg); } .welcome-page-bg { background-image: url(images/general-welcome.jpg); } .menu-page-bg { background-image: url(images/general-carousel.jpg); height: 640px; } .tabata-page-bg { background-image: url(images/timers_background.jpg); } .interval-page-bg { background-image: url(images/timers_background.jpg); } .countdown-page-bg { background-image: url(images/timers_background.jpg); } .second-interval-page-bg { background-image: url(images/timers-second-interval.jpg); } .material-page-bg { background-image: url(images/single_background.jpg); } .search-page-bg { background-image: url(images/single_background.jpg); } .countdown-run-page-bg { background-image: url(images/timers-countdown-run.jpg); } .exercises-page-bg { background-image: url(images/single-list.jpg); } .workout-amrap-page-bg { background-image: url(images/workouts-amrap.jpg); } .stopwatch-page-bg { background-image: url(images/timers_background.jpg); } .stopwatch-run-page-bg { background-image: url(images/stopwatch-run.jpg); } .workout-wizzard-select-bg { background-image: url(images/timers_background.jpg); } .create_account_page-bg { background-image: url(images/general-start-checkin.jpg); } .representer_score-bg{ background-image: url(images/general-home.jpg); } .slider-overlay-bg { background-image: url(images/carousel_background.png); } .custom-workouts-wrapper-bg { background-image: url(images/timers-coundown-menu.jpg); } .monthly-trainings-page-bg { background-image: url(images/background_maandtraining.jpg); } .monthly-training-active-workout-bg { background: linear-gradient(to bottom, #69747e 0%,#323c47 100%); } /* General */ .workout_checkin_page .start_button_wrapper{ position: absolute; width: 100%; text-align: center; top: 750px; } .page-header{ width: 100%; height: 80px; display: flex; } .page-header .center{ width: 100%; position: relative; top: 0px; left: 0px; text-align: center; } .page-header>p{ width: 100%; height: 80px; padding: 35px 0 0 0; box-sizing: border-box; text-align: center; font-size: 48px; text-transform: uppercase; font-family: 'Gotham light'; } [lang="nl"] .page-header>p{ font-size: 40px; } .new-header>p{ display: block; position: relative; float: left; width: 640px; height: 80px; padding: 35px 0 0 0; box-sizing: border-box; text-align: center; font-size: 48px; text-transform: uppercase; font-family: 'Gotham light'; } .new-header .left-side{ float: left; height: 100%; width: 270px; } .new-header .right-side{ float: left; height: 100%; width: 170px; } .new-header .right-side .go_back, .new-header .right-side .go_home { display: flex; justify-content: center; align-items: center; width: 85px; height: 80px; position: static; } .new-header .right-control-block .go_back, .new-header .right-control-block .go_home { display: flex; justify-content: center; align-items: center; width: 85px; height: 80px; position: static; } .new-header .action-button{ float: left; } .new-header .pause-block { margin-right: 100px; } .new-header .go_back, .new-header .go_home{ width: 85px; background-position: center; float: none; } .new-header .reset-button, .new-header .pause-button{ display: flex; justify-content: center; align-items: center; width: 85px; height: 80px; } .new-header .pause-button:not(.play-button) .play-icon { display: none; } .new-header .play-button.pause-button .pause-icon { display: none; } .new-header .button-descr{ text-transform: uppercase; text-align: center; position: relative; top: -10px; } .go_back{ cursor: pointer; width: 90px; height: 80px; position: absolute; left: 25px; top: 35px; } .go_back.single_video{ position: absolute; } .go_home{ width: 90px; height: 80px; position: absolute; right: 25px; top: 35px; display: flex; justify-content: flex-end; } .text-center{ width:100%; text-align: center; } .text-center.checkin{ width:100%; height: 200px; text-align: center; } .start_button_wrapper{ width:100%; height: 106px; text-align: center; } .start_button, .go_to_button{ display: inline-block; height: 106px; padding: 18px 90px 0 90px; text-align: center; box-sizing: border-box; font-size: 60px; font-family: 'Gotham Book'; text-transform: uppercase; border-style: solid; border-width: 2px; border-radius: 50px; background-color: rgba(0, 0, 0, 0.2); } .user_img{ display: inline-block; width: 150px; height: 150px; background-repeat: no-repeat; background-size: 100%; background-position: 3% 50%; border-radius: 100px; border-width: 4px; border-style: solid; /* color to change */ border-color: #7D848E; padding: 0; position:relative; display: flex; justify-content: center; align-items: center; text-transform: uppercase; font-size: 30px; text-align: center; } .user_img.loading{ background-image: url(images/loadingfunxtion_540.gif); } .cross{ width:32px; height:32px; background-image: url(images/cross.png); cursor:pointer; position:absolute; top:-17px; right:-15px; } .nickname_rect{ position: absolute; width: 166px; height: 34px; border-width: 4px; border-style: solid; top: 125px; left: -8px; display: flex; justify-content: center; padding: 0px 15px; box-sizing: border-box; align-items: center; display: none; } .nickname_rect span{ overflow: hidden; text-overflow: ellipsis; font-family: "Gotham book"; font-size: 18px; text-transform: uppercase; white-space: nowrap; } .checkin-tip{ position: absolute; top:938px; } #explainFinger{ height: 150px; width: 150px; position: absolute; z-index: 8; } /* Menu */ #sliderOverlay { position: absolute; top: 80px; width: 1080px; height: 560px; z-index: 5; overflow:hidden; display: none; } .menu_wrapper, .content_wrapper{ min-height: 1280px; width: 100%; background-repeat: no-repeat; overflow:hidden; } .carousel_wrapper{ height: 560px; width: 100%; overflow:hidden; } #sliderOverlay .swiper-container, .carousel_wrapper .swiper-container{ width:1080px; margin-top:60px; } #sliderOverlay .left_arrow{ position: absolute; z-index: 1000; left: 15px; top: 250px; } #sliderOverlay .right_arrow{ position: absolute; z-index: 1000; right: 15px; top: 250px; } #sliderOverlay .swiper-slide, #sliderOverlay .swiper-slide img, .carousel_wrapper .swiper-slide, .carousel_wrapper .swiper-slide img{ width:500px; height:500px; } .custom_slide{ background: linear-gradient(to bottom right, rgb(255, 209, 125), rgb(255, 196, 96)); background: -webkit-linear-gradient(to bottom right, rgb(255, 209, 125), rgb(255, 196, 96)); } .my_workout_slide .slider_text{ font-size: 53px !important; } .swiper-slide-overlay{ position:absolute; top:0; left:0; width:500px; height:500px; background-color: rgba(0, 0, 0, 0.4); display:none; } .swiper-slide .slider_text{ position: absolute; text-transform: uppercase; font-family: 'HelveticaNeue'; font-size: 90px; text-align: center; top: 100px; letter-spacing: 4px; line-height: 74px; width: 100%; word-wrap: break-word; height: 137px; overflow: hidden; padding-top: 10px; } .swiper-slide .slide_type{ position: absolute; text-transform: uppercase; width: 100%; text-align: center; font-size: 23px; top: 20px; } .swiper-slide .slide_level{ position: absolute; text-transform: uppercase; width: 100%; text-align: center; font-size: 25px; top: 50px; letter-spacing: -2px; } .swiper-slide .slide_descr{ position: absolute; text-transform: uppercase; width: 100%; text-align: center; font-size: 19px; top: 350px; line-height: 24px; letter-spacing: -1px; box-sizing: border-box; padding: 0px 10px; } .swiper-slide .slide_creator{ position: absolute; text-transform: uppercase; width: 100%; text-align: center; font-size: 19px; top: 310px; line-height: 24px; letter-spacing: -1px; box-sizing: border-box; padding: 0px 10px; } .custom_slide .slide_descr .secondary-color-text{ color: inherit; } .workouts.element_menu .descr .secondary-color-text { color: inherit; } .swiper-slide .slide_name{ position: absolute; text-transform: uppercase; font-family: 'HelveticaNeue'; font-size: 53px; text-align: center; top: 100px; letter-spacing: 4px; line-height: 74px; width: 100%; word-wrap: break-word; height: 140px; overflow: hidden; } .custom_slide .slide_name{ font-size: 50px; } .swiper-slide .gearImage{ width: 50px !important; height: 50px !important; margin-right: 15px; margin-left: 15px; } .custom_slide .gearImage{ -webkit-filter: invert(100%); filter: invert(100%); } .swiper-slide .slides_images{ position: absolute; top: 430px; height: 100px; display: flex; flex-wrap: wrap; width: 100%; flex-direction: row; justify-content: center; } .swiper-slide .slides_images div{ margin-right: 5px; margin-left: 5px; } /* Menu Slider with tabs */ .workout-tabs-wrapper{ position: absolute; top: 498px; z-index: 1; } .menu-page.challenge-set-page .page-header .go_back, .menu-page.challenge-set-page .page-header .go_home{ height: 72px; } .menu-page.challenge-set-page .page-header>p{ padding-top: 30px; } #sliderOverlay .swiper-with-tabs .swiper-container, .carousel_wrapper .swiper-with-tabs .swiper-container{ width: 1080px; margin-top: 20px; height: 540px; } .workout-tabs-wrapper .tab-wrapper{ width: 357px; height: 53px; float: left; border-radius: 0 15px 0 0; margin: 9px 2px 0px 2px; } .workout-tabs-wrapper .tab-wrapper.selected-tab{ margin: 6px 2px 0px 2px; height: 56px; } .workout-tabs-wrapper .tab-wrapper:last-child{ margin-right: 0px; } .workout-tabs-wrapper .tab-wrapper:first-child{ margin-left: 0px; } .workout-tabs-wrapper .workout-tab{ text-align: center; padding: 10px 0 0 0; font-size: 30px; text-transform: uppercase; } /* Slider description */ .description-container { display: flex; flex-direction: column; min-height: 430px; justify-content: center; padding: 0 35px 0 35px; position: relative; } [lang="he"] .description-container.exercise-description { direction: rtl; } .slider-description-header{ font-size: 34px; text-transform: uppercase; margin-bottom: 15px; } .slider-description-tips{ font-size: 25px; } ul.slider-description-tips{ list-style: none; padding: 0; margin: 0; } .slider-description-tips li{ margin-bottom: 25px; padding-left: 25px; text-indent: -30px; } .slider-description-tips li::before{ content: "• "; padding-right: 10px; } .slider-description-tips .slider-explanation-text{ font-size: 30px; } .slider-description-tips .uppercase{ text-transform: uppercase; } /* Custom workout exercises */ .tier-wrapper.selected-exercise, .img_block.selected-exercise, .img_block_cardio.selected-exercise, .custom-circuit-tile.selected-exercise{ outline-width: 4px; outline-style: solid; outline-offset: -4px; } .workout-timer-wrapper { height: 1000px; margin-top: 330px; position: relative; } .workout-timer-wrapper .pie3 { border-width: 12px; border-style: solid; width: 760px; height: 760px; border-radius: 100%; position: absolute; top: 20px; right: 160px; } .workout-timer-wrapper .workout-timer-time{ text-align: center; font-size: 80px; } /* Custom Circuit Workout */ .workout_now .custom-circuit-content .inner_large_block_cardio, .workout_now .custom-circuit-content .inner_medium_lot_block_cardio, .workout_now .custom-circuit-content .inner_medium_block_cardio, .workout_now .custom-circuit-content .inner_little_block_cardio { padding-top: 50px; height: auto; } .workout_now .custom-circuit-content .inner_medium_block_cardio { padding: 50px 210px 0px 210px; } .workout_now .custom-circuit-content .inner_medium_block_cardio .img_block{ width: 310px; display: none; } .workout_now .custom-circuit-content .inner_medium_block_cardio .img_block .custom_header{ width: 100%; height: 50px; } .workout_now .custom-circuit-content .inner_medium_block_cardio .img_block .custom_image{ width: 100%; height: 265px; } .workout_now .custom-circuit-content .inner_medium_block_cardio .with-name .img_block .custom_image{ height: 303px; } .workout_now .custom-circuit-content .inner_medium_block_cardio .tiers-controls{ height: 100px; } .workout_now .custom-circuit-content .inner_medium_block_cardio .tier-control{ font-size: 20px; width: 80px; } .workout_now .custom-circuit-content .inner_medium_block_cardio .tier-regular{ width: 150px; } .workout_now .custom-circuit-content .inner_medium_block_cardio .tier-regressive, .workout_now .custom-circuit-content .inner_medium_block_cardio .tier-progressive{ font-size: 40px; } .custom-circuit-round-wrapper.custom-circuit-preview-page { margin-top: 300px; } .custom-circuit-round-wrapper.single-round-wrapper { width: 1010px; display: flex; justify-content: center; margin-top: 40px; } .custom-circuit-round-wrapper{ margin-top: 80px; margin-left: 35px; float: left; } .circuit-name-wrapper { float: left; clear: both; font-size: 24px; font-weight: 600; } .circuit-name-wrapper .circuit-tile-body{ display: flex; justify-content: center; align-items: center; text-transform: uppercase; text-align: center; } .circuit-name-wrapper .circuit-tile-body.circuit-name{ height: 270px; } .custom-circuit-exercises-wrapper { float: left; display: flex; } .custom-circuit-tile { width: 190px; margin-right: 15px; margin-bottom: 15px; } .custom-circuit-tile .custom_image { height: 100%; } .custom-circuit-tile .circuit-tile-body { height: 180px; } .tier-wrapper .circuit-tile-footer { height: 40px; padding: 0 10px 0 10px; } .custom-circuit-single-round { width: 835px; flex-wrap: wrap; } .custom-circuit-tile-small { width: 120px; } .custom-circuit-tile-small .circuit-tile-body { height: 125px; } .custom-circuit-tile-small .circuit-tile-footer { height: 35px; font-size: 14px; } /* Home */ .start_page{ display: none; position: absolute; width: 100%; z-index: 8; } .main_home_menu .opacity{ width: 1080px; height: 1920px; background-color: rgba(0,0,0,1); position: absolute; top: 0px; left: 0px; z-index: 8; display: none; } .start-page{ position: absolute; top: 0px; width: 100%; display: none; } .start-page .start_button_wrapper{ position: absolute; top:1014px; z-index: 2; } .rfid_button_wrapper{ z-index: 9; position: absolute; top:25px; left:23px; } .logout_button_wrapper{ z-index: 9; position: absolute; top:25px; left:115px; display: none; } .languages { display: flex; align-items: center; position: absolute; right: 0; z-index: 9; right: 25px; top: 23px; z-index: 9; overflow: hidden; } .changeLanguage{ height: 70px; width: 70px; background-repeat: no-repeat; background-size: cover; background-position: 50% 0; border-radius: 100px; border-width: 3px; border-style: solid; padding: 0; position:relative; z-index: 9; order: 1; } .languages a.hide{ display: none; } .languages .not_active{ height: 60px; width: 60px; order: 0; margin-right: 10px; position: relative; left: 300px; z-index: 7; } .main_home_menu .wrapper_link{ width: 100px; height: 100px; } .lang-en{ background-image: url(images/lang-en.png); } .lang-nl{ background-image: url(images/lang-nl.png); } .lang-de{ background-image: url(images/lang-de.png); } .lang-es{ background-image: url(images/lang-es.png); } .lang-ru{ background-image: url(images/lang-ru.png); } .lang-pt{ background-image: url(images/lang-pt.png); } .lang-fr{ background-image: url(images/lang-fr.png); background-size: 200% 100%; } .lang-he{ background-image: url(images/lang-Is.png); background-size: 200% 100%; } .lang-it{ background-image: url(images/lang-it.png); background-size: 200% 100%; } .rfid_button{ display: flex; justify-content: center; align-items: center; height: 70px; width: 70px; text-align: center; box-sizing: border-box; font-size: 17px; font-family: 'Gotham Book'; text-transform: uppercase; border-width: 3px; border-style: solid; border-radius: 100px; } .create_acc{ height: 100px; position: absolute; bottom: 200px; width: 100%; text-align: center; z-index: 2; } .create_acc_bot{ height: 100px; position: absolute; top: 1500px; width: 100%; text-align: center; z-index: 2; } .create_acc_block{ height: 99px; border-radius: 8px; margin: 0 auto; display: inline-block; } .create_acc_text{ text-align: center; text-transform: uppercase; margin-top: 15px; word-spacing: 2px; font-size: 21px; } .create_acc_block_title{ font-size: 40px; text-transform: uppercase; text-align: center; height: 100%; padding: 28px 27px; letter-spacing: 0px; box-sizing: border-box; display: block; } /*RFID page*/ .rfid-page div.second-title{ margin-top: 121px; text-align: center; padding-right: 140px; padding-left: 140px; } .rfid-page div.second-title h2{ text-transform: uppercase; font-weight: bold; font-family: 'Gotham bold'; font-size: 37px; letter-spacing: 0.4px; } .rfid-page div.little-images{ margin-top: 86px; height: 285px; } .rfid-page div.little-images .one-image:nth-child(1){ float: left; margin-left:97px; margin-top: 7px; } .rfid-page div.little-images .one-image:nth-child(2){ float: left; margin-top: 13px; margin-left:153px; } .rfid-page div.little-images .one-image:nth-child(3){ float: left; margin-top: 17px; margin-left:118px; } .rfid-page div.little-images .one-image:nth-child(4){ float: left; margin-top: 39px; margin-left:129px; } .rfid-page div.little-images .one-image h3{ text-transform: uppercase; font-family: 'Gotham light'; font-size: 16px; text-align: center; } .rfid-page div.little-images .one-image:nth-child(1) h3{ width: 85px; margin-top: 40px; } .rfid-page div.little-images .one-image:nth-child(2) h3{ width: 127px; margin-top: 77px; } .rfid-page div.little-images .one-image:nth-child(3) h3{ width: 129px; margin-top: 48px; margin-left: 15px; } .rfid-page div.little-images .one-image:nth-child(4) h3{ width: 129px; margin-top: 70px; margin-left: 2px; } .rfid-page div.personal-code{ margin-top: 66px; } .rfid-page div.personal-code h2{ text-transform: uppercase; font-family: 'Gotham light'; margin-top: -4px; font-size: 22px; text-align: center; letter-spacing: 2px; } .rfid-page div.personal-code h1{ text-transform: uppercase; font-family: 'sans-serif'; font-size: 45px; text-align: center; letter-spacing: -4px; } .rfid-page div.personal-code h1::after{ content: ''; display: block; height: 3px; margin: auto; width: 407px; } .rfid-page div.my-qr{ height: 150px; width: 150px; margin: auto; margin-top: 48px; display: flex; } .rfid-page div.my-qr img{ margin: auto; } .rfid-page .back_button_wrapper{ text-align: center; margin-top: 50px; } .rfid-page .back_button_wrapper .back_button{ display: inline-block; height: 96px; padding: 26px 145px 0px; text-align: center; box-sizing: border-box; font-size: 37px; font-family: 'Gotham Book'; text-transform: uppercase; border-style: solid; border-width: 2px; border-radius: 50px; /* color to change */ background-color: rgba(0, 0, 0, 0.2); } .rfid-page .two_qr{ margin-top: 175px; } .rfid-page .two_qr .left{ float: left; width: 50%; } .rfid-page .two_qr .left img { margin-left: 187px; } .rfid-page .two_qr .left p{ margin-left: 0px; } .rfid-page .two_qr .right{ float: right; } .rfid-page .two_qr .right p{ margin-right: 136px; } .rfid-page .two_qr .right img{ margin-left: 43px; } .rfid-page .two_qr .left img, .rfid-page .two_qr .right img{ width: 150px; height: 150px; margin-top: 3px; margin-bottom: 36px; } .rfid-page .two_qr .left p, .rfid-page .two_qr .right p{ text-transform: uppercase; font-family: 'Gotham light'; font-size: 22px; text-align: center; letter-spacing: 2px; } .rfid-page .learn-more{ text-transform: uppercase; font-size: 24px; text-align: center; position: absolute; width: 258px; top: 1806px; left: 407px; } /* Start checkin */ .start-checkin-page{ position:relative; } .login_message_top{ font-family: 'Gotham bold'; font-size: 48px; text-transform: uppercase; margin-top:235px; letter-spacing: 1.6px; } .login_message_bottom{ font-family: 'Gotham light'; font-size: 36px; text-transform: uppercase; margin-top:18px; margin-bottom: 438px; letter-spacing: 1.1px; } .checkin-button-wrapper { position: absolute; top: 1173px; } .checkin-button{ font-family: "Gotham Book"; font-size: 18px; text-transform: uppercase; width: 115px; height: 110px; display: inline-block; line-height: 1.385; } .checkin-button .fes-icon { margin-bottom: 20px; } .start-checkin-page-error{ position:absolute; top:0; left:0; width:1080px; height:1920px; /* color to change */ background-color: rgba(0, 0, 0, 1); display: none; z-index: 10; } .error_message_top{ font-family: 'Gotham bold'; font-size: 82px; text-transform: uppercase; margin-top:654px; letter-spacing: 2.6px; } .error_message_bottom{ font-family: 'Gotham light'; font-size: 30px; text-transform: uppercase; margin-top:2px; margin-bottom:38px; letter-spacing: 1.1px; } .start-checkin-page-error .start_button{ font-size:50px; padding:18px 30px 0 30px; letter-spacing: 2px; cursor: pointer; } .workout_checkin.start-checkin-page-error{ position:absolute; top:0; left:0; width:1080px; height:1920px; background-image: url(images/error_background.jpg); display: none; } .workout_checkin .error_message_top{ font-family: 'Gotham bold'; font-size: 48px; text-transform: uppercase; margin-top: 314px; letter-spacing: 2px; } .workout_checkin .error_message_bottom{ font-family: 'Gotham light'; font-size: 36px; margin: auto; text-transform: uppercase; line-height: 65px; margin-top: 10px; width: 848px; margin-bottom: 515px; letter-spacing: 1.1px; } .workout_checkin.start-checkin-page-error .start_button{ font-size: 39px; padding: 27px 90px 0 90px; letter-spacing: 2px; cursor: pointer; } /* Welcome */ .welcome-page .content{ margin-top: 125px; } .rfid_content { height: 350px; text-align: center; position: absolute; top: 20px; width: 100%; display: none; } .user_img.welcome_user{ display: block; margin: 0 auto; } .user_data{ display: inline-block; height: 200px; box-sizing: border-box; vertical-align: top; overflow: hidden; } .user_nickname{ font-size: 47px; font-family: 'Gotham bold'; text-transform: uppercase; margin-top:15px; letter-spacing: 2px; } .user_role, .user_level{ display: block; width: 100%; font-size: 35px; font-family: 'Gotham light'; text-transform: uppercase; line-height:1; } /* Tabata */ .tabata_start_text_wrapper{ height: 792px; padding-top:160px; text-align: center; } .tabata_start_text_wrapper>p{ display: block; height: 128px; font-size: 48px; font-family: "Gotham light"; text-transform: uppercase; text-align: center; } .tabata_start_text_wrapper>span{ display: block; font-size: 130px; font-family: "Gotham bold"; text-transform: uppercase; text-align: center; } /* Interval */ .interval_header{ margin-top:82px; font-size: 80px; font-family: "Gotham light"; text-transform: uppercase; text-align: center; letter-spacing:2px; } .interval_time{ margin-top:30px; } .interval_section{ float:left; width: 50%; text-transform: uppercase; text-align: center; } #swipeDown{ position: absolute; z-index: 5; top: 960px; left: 15px; width: 140px; display: none; } #swipeDownCountdown{ position: absolute; top: 1030px; width: 140px; left: 195px; display: none; } #swipeDownCheckout{ position: absolute; width: 140px; left: 280px; top: 700px; display: none; } #swipeAndType{ position: absolute; z-index: 5; width: 140px; top: 810px; left: 465px; display: none; } .interval_section>span, .interval_rounds>span{ font-size: 52px; font-family: "Gotham bold"; } .interval_wrapper{ padding-left:34px; } .interval_work .interval_wrapper{ margin-left:110px; } .interval_rest .interval_wrapper{ margin-left:110px; } .interval_wrapper .arrow-wrapper { float: left; height: 250px; position: relative; } .interval_wrapper .arrow-wrapper .fes-icon { position: absolute; top: 84px; left: -44px; } .numbers_column, .min_column{ float:left; } .numbers_column{ height:250px; overflow:hidden; font-size: 70px; font-family: "Gotham light"; text-transform: uppercase; line-height: 1; } .numbers_minutes, .numbers_seconds, .numbers_rounds{ width:100px; } .words_column{ font-size: 30px; font-family: "Gotham thin"; opacity:0.3; padding-top:104px; box-sizing: border-box; } .numbers_item{ opacity:0.2; } .interval_rounds { margin-top: 60px; margin-bottom: 60px; text-align: center; text-transform: uppercase; } .interval_rounds .interval_wrapper{ width:122px; margin:0 auto; } .interval-page .swiper-container{ width:100px; height:210px; } .interval-page .swiper-slide-active{ opacity:1; } /* Challenge set */ .challenge-controls{ height:120px; font-family:'Gotham Book'; font-size:28px; text-transform: uppercase; letter-spacing:2px; } .challenge-controls-left{ float:left; margin-top:48px; margin-left:38px; } .challenge-controls-right{ float:right; margin-top:38px; margin-right:46px; } .challenge-controls-center-rft{ text-align: center; padding-top:48px; } .challenge-controls-center-mmr{ width: 306px; margin:0 auto; padding-top:38px; } .challenge-difficulty{ cursor:pointer; margin-right:42px; } .challenge-duration{ cursor:pointer; margin-left:42px; padding-top:10px; float:left; } .challenge-duration span{ display: inline-block; width:17px; height:27px; margin-right:15px; background-image: url(images/arrowsSprite.png); background-repeat: no-repeat; } .challenge-duration-less span{ background-position: 100% 0; } .challenge-duration-less.active span{ background-position: 100% 100%; } .challenge-duration-more span{ background-position: 0 0; } .challenge-duration-more.active span{ background-position: 0 100%; } .challenge-controls-text{ padding-top:5px; float:left; } /* Checkin */ .checkedin-users-section{ margin-top:95px; margin-left:60px; margin-bottom:30px; } .user-avatar{ width:158px; height:158px; display:inline-block; margin-right:103px; margin-bottom:28px; } .user-avatar.hide_user{ visibility: hidden; } .user-avatar:nth-child(4n+4){ margin-right:0; } .user-avatar .cross { display:none; } .user-avatar.checkedin .cross { display:block; } .user-avatar.next-checkin .user_img{ border: none; } .user-avatar.next-checkin .user_img:before { content: " "; position: absolute; top: -10px; left: -10px; right: -10px; bottom: -10px; border-width: 4px; border-style: solid; border-radius: 100px; } .gear-section-title{ font-family: 'Gotham bold'; font-size: 51px; text-transform: uppercase; letter-spacing: 1px; position: absolute; word-spacing: 3px; top: 1374px; } .gear-section-wrapper{ padding-left: 40px; width: 100%; position: absolute; top: 1467px; box-sizing: border-box; } .gear-item-wrapper{ margin-right: 32px; width:224px; height:400px; overflow:hidden; display: none; float: left; } .gear-item-wrapper.small{ width: 140px; height: 200px; margin-bottom: 26px; } .go-next-button{ padding: 13px 80px 0 80px; line-height: 42px; font-size: 40px; } .workout-amrap-page .account_write_field{ margin-top: 135px; } .workout-amrap-page .account_write_new_field{ margin-top: 40px; } .gear-item-top-part{ text-align: center; height:225px; /* color to change */ background-color: rgba(125, 132, 142, 0.1); } .gear-item-top-part.small{ height: 120px; } .gear-item-top-part img{ position: relative; top: 10px; max-width:170px; } .gear-item-top-part img.small{ max-width: 80px; top: 0px; } .gear-item-bottom-part{ height:175px; } .gear-item-bottom-part.small{ height: 80px; } .gear-item-bottom-part.small img{ height: 40px; width: 40px; } .gear-item-bottom-part>div{ margin-top: 21px; text-align: center; float: left; width: 50%; } .gear-item-bottom-part>div.small{ margin-top: 5px; } .gear-item-bottom-part>div h2{ margin-top: 14px; font-size: 37px; } .gear-item-bottom-part>div h2.small{ margin-top: 0px; font-size: 16px; } .gear-item-bottom-part>div h3{ font-size: 22px; margin-top: -10px; } .gear-item-bottom-part>div h3.small{ font-size: 17px; } .gear-item-title{ font-family: 'Gotham Book'; font-size:18px; text-transform: uppercase; letter-spacing:1px; padding-top:10px; } /* Single material */ .material-wrapper{ margin-top:15px; } .material-item{ display: flex; flex-direction: column; align-items: center; float: left; margin: 0 0 22px 22px; border-radius: 0; width: 190px; height: 190px; position: relative; } .material-item.active:before { content: " "; position: absolute; top: 0; left: 0; right: 0; bottom: 0; /* color to change */ background-color: rgba(0, 0, 0, 0.2); } .material-item .material-item-icon { margin-top: 45px; margin-bottom: 15px; } .material-item .material-item-name { text-transform: uppercase; font-family: 'HelveticaNeue'; font-size: 17px; } /* Single exercises */ .exercises-region-name{ width:600px; margin:0 auto; padding: 15px 0 15px 25px; box-sizing: border-box; /* color to change */ background-color: rgba(0, 0, 0, 0.2); font-family: "Gotham light"; font-size: 25px; text-transform: uppercase; letter-spacing: 1px; visibility: hidden !important; } .exercises-count{ font-family: "Gotham Book"; font-size: 18px; text-transform: uppercase; letter-spacing: 1px; margin-top:16px; } .exercises-page .swiper-outer-wrapper{ margin-top:22px; } .exercises-page .swiper-container{ padding-top:100px; width:100%; height:1600px; position: absolute; } .exercises-page .swiper-wrapper{ position: absolute; width: 1680px; left: 80px; overflow: hidden; } .exercises-page .swiper-column{ float:left; } .exercises-page .swiper-slide{ width:280px; height:350px; margin-right:40px; margin-bottom:40px; } .exercises-page .iScrollHorizontalScrollbar{ left:82px !important; top:18px; width:85%; height:4px !important; /* color to change */ background-color: rgba(0, 0, 0, 0.2); } .exercises-page .iScrollIndicator{ border:0 !important; /* color to change */ background-color: #7D848E !important; } .exercise-title{ font-family: "Gotham Book"; font-size: 18px; text-transform: uppercase; line-height: 1.157; width:250px; height:65px; padding-left:15px; padding-right:15px; padding-top:5px; overflow: hidden; } .exercise-icon{ width:280px; height:280px; } .exercise-icon img{ width:280px; height:280px; } /* Single muscles */ .muscle-section-header{ text-align: center; position: relative; } .muscles-title{ font-family: "Gotham bold"; font-size: 36px; text-transform: uppercase; } .muscles-side-button{ font-family: "Gotham Book"; font-size: 18px; text-transform: uppercase; display: inline-block; height: 72px; padding: 26px 70px 0px 70px; text-align: center; box-sizing: border-box; border-width: 1px; border-style: solid; border-radius: 50px; /* color to change */ background-color: rgba(0, 0, 0, 0.2); } .rotate_button{ bottom: 70px; position: absolute; width: 100%; height: 80px; text-align: center; } .search_title{ font-family: "Gotham bold"; font-size: 36px; text-transform: uppercase; text-align: center; margin-top: 72px; } .search-page .show_exercises{ position: absolute; top: 710px; } .search-page .show_exercises .start_button{ width: 384px; padding: 8px 20px 0 20px; line-height: 45px; font-size: 42px; display: none; } /*single search by name*/ #finger{ position: absolute; z-index: 5; top: 1190px; left: 75px; width: 140px; display: none; } .search { position: relative; width: 85%; margin: 0 auto; font-size: 39px; padding: 26px 0px 18px 41px; box-sizing: border-box; } .search input { background: transparent; border: none; width: 100%; text-transform: uppercase; } .search-exercise .section-header.se-cat { top: 5px; } .search-icon { position: absolute; padding: 14px; box-sizing: border-box; } .search-icon-cancel { transform: rotate(45deg); height: 76px; top: 10px; right: 10px; } .search-icon-body, .search-icon-keyboard { height: 126px; top: 1px; right: 148px; } .search-icon.search-active { border: none; } .search-icon.key-icon { border: 0; padding: 29px 20px; } .content-section-alphabet{ margin-top: 1px; } .content-section-alphabet .row{ box-sizing: border-box; border-width: 1px; border-style: solid; /* color to change */ border-color: #7D848E; } .content-section-alphabet .row:nth-child(1){ height: 121px; } .content-section-alphabet .row:nth-child(2){ height: 105px; } .content-section-alphabet .row:nth-child(3){ height: 105px; } .content-section-alphabet .row:nth-child(4){ height: 105px; } .content-section-alphabet .row:nth-child(2) a:first-child, .content-section-alphabet .row:nth-child(2) a:last-child{ height: 100%; width: 119px; } .content-section-alphabet .row:nth-child(3) a:first-child{ height: 100%; width: 193px; } .content-section-alphabet .row:nth-child(3) a:nth-child(9){ width: 113px; } .content-section-alphabet .row:nth-child(4) a:first-child{ height: 100%; width: 269px; } .content-section-alphabet .row:nth-child(4) a:nth-child(2){ height: 100%; width: 374px; } .alphabet { width: 85%; margin: 0 auto; } .alphabet a { display: flex; align-items: center; justify-content: center; float: left; height: 100%; width: 75px; font-size: 45px; cursor: pointer; box-sizing: border-box; border-right-width: 1px; border-right-style: solid; /* color to change */ border-right-color: #7D848E; } .alphabet a:first-child, .alphabet a:last-child{ width: 82px; } .alphabet a:last-child{ border-right-width: 1px; border-right-style: solid; border-right-color: transparent; } .active_upper{ border-width: 1px; border-style: solid; border-right-width: 1px !important; border-right-style: solid !important; } .next_field{ width: 270px !important; } .active_field{ z-index: 7; } .search-page .content-result{ height: 100px; width: 85%; margin: 0 auto; padding-top: 26px; padding-left: 40px; letter-spacing: 2.5px; box-sizing: border-box; } .search-page .content-result p{ text-transform: uppercase; font-size: 36px; margin-bottom: 6px; } /*timers second interval*/ .trr{ margin-top: 147px; height: 120px; } .trr > div{ float: left; width: 33.333%; } .trr > div > div{ margin-left: 107px; } .trr > div:nth-child(3) > div{ margin-left: 33px; } .trr > div > div h2{ text-transform: uppercase; font-weight: bold; font-size: 50px; margin-top: -8px; letter-spacing: 3px; } .trr > div > div h1{ text-transform: uppercase; font-size: 72px; font-family: 'Gotham thin'; margin-top: 10px; } .trr > div:nth-child(2) > div h1{ margin-left: -25px; } .trr > div:nth-child(3) > div h1{ width: 245px; text-align: center; } .clock{ margin-top: 135px; height: 835px; } .second-interval-page .stop-button{ margin-top: 277px; } .second-interval-page .stop-button .start_button{ padding: 15px 109px; } #timer { margin: 20px; width: 830px; margin: 0px 125px; } .pietimer { position: relative; font-size: 200px; width: 1em; height: 1em; } .pietimer > .percent { position: absolute; top: 289px; left: -42px; width: 3.33em; font-size: 260px; text-align: center; display: none; font-family: 'Gotham thin'; } .pietimer > .words { position: absolute; top: 147px; left: 214px; width: 3.33em; font-size: 120px; text-align: center; font-family: 'Gotham bold'; } .pietimer > .rounds { position: absolute; top: 551px; left: 137px; width: 4.5em; font-size: 124px; text-align: center; font-family: 'Gotham bold'; } .pietimer > .slice { position: absolute; width: 1em; height: 1em; clip: rect(0px, 1em, 1em, 0.5em); } .pietimer > .slice.gt50 { clip: rect(auto, auto, auto, auto); } .pietimer > .slice > .pie { border-width: 10px; border-style: solid; position: absolute; width: 0.97em; height: 0.97em; clip: rect(0em, 0.5em, 1em, 0em); -moz-border-radius: 0.5em; -webkit-border-radius: 0.5em; border-radius: 0.5em; } .pie2{ border-width: 12px; border-style: solid; width: 760px; height: 760px; border-radius: 100%; position: absolute; top: 502px; right: 148px; } .pietimer > .slice > .pie.fill { -moz-transform: rotate(180deg) !important; -webkit-transform: rotate(180deg) !important; -o-transform: rotate(180deg) !important; transform: rotate(180deg) !important; } .pietimer.fill > .percent { display: none; } .pietimer.fill > .slice > .pie { border-color: transparent; /* color to change */ background-color: #c0c0c0; width: 1em; height: 1em; } .active_word{ color: inherit !important; } /*countdown*/ .countdown_time { margin-top: 107px; } .countdown_time .interval_wrapper{ width:470px; margin:0 auto; padding-left:45px; } .countdown_time .interval_wrapper .arrow-wrapper .fes-icon { top: 132px; left: -58px; } .countdown_time .interval_wrapper .numbers_minutes, .countdown_time .interval_wrapper .numbers_seconds{ width:150px; } .countdown_time .interval_wrapper .words_column{ padding-top: 157px; font-size: 42px; } .countdown_time .interval_wrapper .words_column.hebrew{ font-size: 35px; } .countdown_time .numbers_column{ height: 500px; font-size: 108px; } .countdown_time .numbers_column:nth-child(2)::before{ content: ""; display: block; position: absolute; height: 1px; width: 512px; top: 1000px; left: 284px; opacity: 0.4; } .countdown_time .numbers_column:nth-child(2)::after{ content: ""; display: block; position: absolute; height: 1px; width: 512px; top: 1127px; left: 284px; opacity: 0.4; } .countdown_time .swiper-container{ width: 200px; height: 330px; } .countdown-page .start_button_wrapper{ margin-top: 167px; } .countdown-page .numbers_item{ padding-left: 1px; } /*stopwatch*/ .stopwatch-page .timer{ margin-top: 365px; text-align: center; } .stopwatch-page .timer span{ font-size: 216px; font-family: 'Gotham thin'; } .stopwatch-page .start_button_wrapper{ margin-top: 380px; } /*countdown run*/ .countdown-run-page #timer{ margin-top: 400px; } .countdown-run-page .totalTime{ font-size: 103px; margin-top: 68px; text-align: center; font-family: 'Gotham bold'; } .countdown-run-page .start_button_wrapper{ margin-top: 91px; } .countdown-run-page .start_button_wrapper a{ padding-left: 110px; padding-right: 110px; } .countdown-run-page .percent{ position: absolute; top: 289px; left: -25px; width: 3.33em; font-size: 265px; text-align: center; display: none; font-family: 'Gotham thin'; } /*stopwatch run*/ .stopwatch-run-page .split-time{ font-size: 115px; margin: 159px auto; text-align: center; opacity: 0.3; width: 550px; } .stopwatch-run-page .flash{ opacity: 0.6; width: 1080px; height: 1920px; display: none; position: absolute; top: 0px; left: 0px; } .stopwatch-run-page .split-time span{ display: inline-block; width: 160px; } .stopwatch-run-page .all-time{ font-size: 265px; margin-top: 395px; text-align: center; font-family: 'Gotham thin'; letter-spacing: -25px; position: relative; } .stopwatch-run-page .splits-container{ height:410px; opacity: 0.8; font-size: 57px; letter-spacing: 3px; text-transform: uppercase; font-family: 'Gotham thin'; margin-top: 41px; } .splits-container .one-split{ margin-bottom: 15px; } .splits-container .one-split .round{ text-align: left; margin-left: 60px; } .splits-container .one-split .round-time{ text-align: right; float: right; margin-right: 48px; } .stopwatch-run-page .start_button_wrapper{ margin-top: 114px; display: flex; justify-content: space-around; } .stopwatch-run-page .start_button_wrapper a{ float: left; padding: 18px 90px 0 90px; } .big .hour{ display: inline-block; width: 350px; } .big .min{ display: inline-block; width: 340px; } .big .sec{ display: inline-block; width: 330px; } /*workout now*/ #workoutPreloader, #workoutTimer{ position: absolute; top: 0; left: 0; width: 1080px; height: 1920px; z-index: 100; font-family: 'Gotham light'; } #workoutPreloader .preloader-description{ font-size: 100px; text-transform: uppercase; text-align: center; margin-top: 250px; display: flex; flex-direction: column; height: 330px; justify-content: space-between; } #workoutPreloader .preloader-timer{ font-size: 220px; text-align: center; margin-top: 375px; } #workoutPreloader .preloader-description-header{ font-weight: bold; } .workout_now_positioned { background-position: 0px -120px; } .workout_now .clients{ height: 390px; margin-top: 50px; } .workout_now.representer_score .clients{ margin-top: 128px; } .workout_now .clients .client{ float: left; height: 162px; width: 160px; margin-left: 10px; margin-right: 10px; margin-bottom: 18px; text-align: center; position:relative; } .workout_now .clients .client_representer{ float: left; height: 162px; width: 160px; margin-left: 10px; margin-right: 10px; margin-bottom: 18px; text-align: center; } .workout_now .clients .client .photo{ height: 124px; display: flex; } .workout_now .clients .client_representer .photo{ height: 124px; display: flex; } .workout_now .clients .client .status{ height: 38px; text-transform: uppercase; display:none; } .workout_now .clients .client .status.active, .workout_now .clients .client .heart-rate-disconnected.active{ display:block; } .workout_now .clients .client .status-heartrate span{ font-size: 30px; } .workout_now .clients .client .photo .img{ margin: auto; border-radius: 100%; width: 80px; height: 80px; } .workout_now .clients .client .photo .img img{ width: 100%; height: 100%; border-radius: 100%; } .workout_now .clients .client_representer .photo .img{ position: relative; margin: auto; border-radius: 100%; width: 92px; height: 92px; border-width: 2px; border-style: solid; } .workout_now .workout-info-block .description-container.workout-description { min-height: 415px; margin-top: 0px; padding-top: 25px; } .workout_now .workout-info-block .description-container.exercise-description { min-height: 440px; } .representer_completed{ height: 300px; margin-top: 55px; } .representer_completed .photo{ float: left; width: 300px; height: 200px; } .representer_completed .photo .img{ float: right; margin-right: 36px; margin-top: 38px; border-radius: 100%; height: 118px; width: 118px; border-width: 2px; border-style: solid; } .representer_completed .photo .img img.selectedUser{ height: 100%; width: 100%; border-radius: 50%; } .representer_completed .completed{ float: left; width: 200px; height: 200px; padding-top:95px; text-align: center; } .representer_completed .completed h3{ font-size: 25px; } .representer_completed .square{ position:absolute; top:85px; left:-90px; border-width: 1px; border-style: solid; width: 238px; height: 118px; } .representer_completed .square h1{ visibility:hidden; } .workout-checkout-score { width:200px; float:left; margin-top:-40px; position:relative; margin-left:210px; } .workout-checkout-score .swiper-container{ left: -90px; width: 241px; } .workout-checkout-score .swiper-slide{ font-size: 76px; opacity: 0.2; text-align: center; } .workout-checkout-score .swiper-slide-active{ opacity: 1 } .representer_slider{ margin: auto; margin-top: 20px; width: 300px; height: 260px; background-image: url(images/slider_03.png); background-repeat: no-repeat; background-position: 3px 2px; position: relative; } .slider_arrow{ position: relative; bottom: 260px; left: 394px; z-index: 3; } .representer_button{ margin-top: 60px; } .workout_now .clients .client_representer .photo .img img{ width: 100%; height: 100%; border-radius: 100%; } .client_representer .photo .img.active::before{ content: " "; position: absolute; top: -12px; left: -12px; right: -12px; bottom: -12px; border: 4px solid; border-width: 4px; border-style: solid; border-radius: 100px; } .workout_now .clients .client .status h2{ height: 38px; font-size: 28px; font-family: 'Gotham bold'; margin-top: 5px; display: inline-block; } .workout_now .clients .client .status.status-name h2 { height: 26px; width: 160px; font-size: 20px; font-family: 'Gotham bold'; margin-top: 5px; display: inline-block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .workout_now .clients .client .heart-rate-disconnected{ height: 28px; padding-top:10px; font-size: 16px; font-family: 'Gotham bold'; text-transform: uppercase; width:100%; position:absolute; bottom:0; display: none; } .workout_now .clients .client .photo .img{ /*black*/ border-width: 8px; border-style: solid; } .workout_now .clients .client.effort50 .status{ /*grey*/ background-color: #020000; } .workout_now .clients .client.effort50 .photo .img{ /*grey*/ border-width: 8px; border-style: solid; border-color: #020000; } .workout_now .clients .client.effort60 .status{ /*blue*/ background-color: #0f68ea; } .workout_now .clients .client.effort60 .photo .img{ /*blue*/ border-width: 8px; border-style: solid; border-color: #0f68ea; } .workout_now .clients .client.effort70 .status{ /*green*/ background-color: #00bc4c; } .workout_now .clients .client.effort70 .photo .img{ /*green*/ border-width: 8px; border-style: solid; border-color: #00bc4c; } .workout_now .clients .client.effort80 .status{ /*yellow*/ background-color: #fbed1f; } .workout_now .clients .client.effort80 .photo .img{ /*yellow*/ border-width: 8px; border-style: solid; border-color: #fbed1f; } .workout_now .clients .client.effort90 .status{ /*red*/ background-color: #e50000; } .workout_now .clients .client.effort90 .photo .img{ /*red*/ border-width: 8px; border-style: solid; border-color: #e50000; } .workout_now .content{ height: 1400px; background-size: cover; background-position: 0px; } .sevenMinCustomNow{ background: url(images/workouts-amrap.jpg); } .content .custom_explain{ height: 100%; background-position: 0px; background-size: cover; position: relative; } .workout_now .clients .client.done .img{ border-width: 8px !important; border-style: solid !important; /* color to change */ border-color: grey !important; } .workout_now .clients .client.done .status{ /* color to change */ background-color:grey !important; } /*did id*/ .did_it-page .main_phase{ margin-top: 368px; height: 200px; text-align: center; } .did_it-page .main_phase h1{ text-transform: uppercase; font-family: 'Gotham bold'; font-size: 130px; margin-bottom: 0px; } .did_it-page .main_phase h2{ text-transform: uppercase; font-family: 'Gotham light'; font-size: 104px; position: relative; bottom: 5px; } .did_it-page .main_phase h3{ margin-top: 40px; letter-spacing: 2px; text-transform: uppercase; font-family: 'Gotham light'; font-size: 33px; position: relative; bottom: 37px; } .good_job .pin_block{ margin-top: 220px; } .user_good_job{ margin-top: 350px; display:none; flex-direction: column; align-items: center; } .user_good_job .photo{ width: 160px; } .user_good_job .nickname_block{ text-align: center; } .user_good_job .nickname_block h2{ text-transform: uppercase; font-family: 'Gotham bold'; font-size: 49px; margin-top: 27px; } .user_good_job .nickname_block h3{ text-transform: uppercase; font-family: 'Gotham thin'; font-size: 36px; margin-left: 27px; letter-spacing: .6px; } .did_it-page .return_eq{ margin-top: 1143px; text-align: center; } .did_it-page .return_eq h2{ text-transform: uppercase; font-family: 'Gotham light'; font-size: 57px; letter-spacing: 2px; } .good-job-countdown-timer{ position:absolute; bottom:20px; text-align: center; width:100%; font-size: 80px; } #startButton{ position: absolute; top: 100px; } #startButtonWorkouts{ position: absolute; top: 790px; } #startButtonNew{ position: absolute; top: 100px; width: 100%; text-align: center; z-index: 1; } #startButton a, #startButtonWorkouts a, #startButtonNew a{ padding: 10px 80px 0 80px; line-height: 43px; letter-spacing: 1px; font-size: 40px; } .workout-info-tabs .workout-tabs-wrapper { top: 458px; } /*circle slider*/ .representer_slider #representer_slider{ position: relative; height: 168px; width: 168px; left: 65px; top: 49px; } #representer_slider_knob{ background-image: url(images/button_06.png); background-repeat: no-repeat; background-size: 80px 80px; } .representer_slider .background_slider{ position: absolute; left: 34px; top: 17px; transform-origin: 50% 50%; } /*congratulations*/ .congratulations-page .main_phase{ margin-top: 350px; text-align: center; } .congratulations-page .main_phase h2{ text-transform: uppercase; font-family: 'Gotham light'; font-size: 52px; } .congratulations-page .main_phase h1{ text-transform: uppercase; font-family: 'Gotham bold'; font-size: 85px; margin-bottom: 0px; margin-top: -13px; } .congratulations-page .winners{ height: 535px; margin-top: 178px; } .congratulations-page .winners .place{ float: left; width: 253px; height: 100%; margin-right: 53px; } .congratulations-page .winners .place.second .winner_image{ height: 240px; width: 240px; margin-top: 132px; border-radius: 50%; border-width: 4px; border-style: solid; /* color to change */ background: rgba(125,132,142, 0.2); } .congratulations-page .winners .place.first .winner_image{ height: 240px; width: 240px; margin-top: 8px; border-radius: 50%; border-width: 4px; border-style: solid; /* color to change */ background: rgba(125,132,142, 0.2); } .winner_image img{ width: 100%; height: 100%; border-radius: 50%; } .congratulations-page .winners .place.second .winner_place{ margin-top: 31px; height: 115px; width: 242px; border-width: 4px; border-style: solid; /* color to change */ background: rgba(125,132,142, 0.2); } .congratulations-page .winners .place.first .winner_place{ margin-top: 37px; height: 233px; width: 242px; border-width: 4px; border-style: solid; /* color to change */ background: rgba(125,132,142, 0.2); } .congratulations-page .winners .place.first .winner_place h1{ color: #AFB4B6; font-family: 'Gotham bold'; font-size: 199px; margin-top: 31px; margin-left: 80px; } .congratulations-page .winners .place.second .winner_place h1{ color: #AFB4B6; font-family: 'Gotham bold'; font-size: 100px; margin-top: 2px; margin-left: 90px; } .congratulations-page .winners .place:first-child{ margin-left: 100px; } .congratulations-page .return_eq{ margin-top: 430px; text-align: center; } .congratulations-page .return_eq h2{ text-transform: uppercase; font-family: 'Gotham light'; font-size: 35px; margin-top: -4px; letter-spacing: 0.5px; padding: 0px 30px; } /*my workouts checkin*/ .my_workouts_checkin h2{ text-transform: uppercase; font-family: 'Gotham bold'; text-align: center; font-size: 51px; } .my_workouts_checkin h3{ font-family: 'Gotham thin'; text-transform: uppercase; text-align: center; font-size: 38px; } /*my workouts list*/ .my_workouts_list .challenge-controls-left .challenge-difficulty{ margin-left: 114px; margin-right: 5px; } .my_workouts_list .challenge-controls-right{ float: right; margin-top: 49px; margin-right: 138px; } .my_workouts_list .challenge-controls-right .challenge-difficulty{ margin-left: 114px; margin-right: 5px; } .my_workouts_list .my_workout_images{ width: 1080px; height: 1160px; } .my_workouts_list .my_workout_images.less_fiveMain{ padding-top: 168px; } .my_workouts_list .less_five{ height: 923px; margin-right: 143px; margin-left: 156px; } .my_workouts_list .less_five .one_image{ height: 440px; width: 360px; float: left; margin-right: 60px; margin-bottom: 42px; } .my_workouts_list .less_five .one_image .top{ height: 80px; padding-top: 11px; padding-left: 25px; padding-right: 25px; box-sizing: border-box; overflow: hidden; } .my_workouts_list .less_five .one_image .top span{ text-transform: uppercase; font-size: 25px; } .my_workouts_list .less_five .one_image .image{ height: 360px; } .my_workouts_list .less_five .one_image .image img{ height: 100%; width: 100%; } .my_workouts_list .less_five .one_image:nth-child(2n+2){ margin-right: 0px; } .my_workouts_list .my_workout_images.more_fiveMain{ padding-top: 165px; } .my_workouts_list .more_five{ height: 923px; margin-right: 86px; margin-left: 91px; } .my_workouts_list .more_five .one_image{ float: left; width: 275px; height: 340px; margin-right: 38px; margin-bottom: 50px; } .my_workouts_list .more_five .one_image:nth-child(3n+3){ margin-right: 0px; } .my_workouts_list .more_five .one_image .top{ height: 65px; box-sizing: border-box; overflow: hidden; padding-top: 5px; padding-left: 10px; padding-right: 10px; } .my_workouts_list .more_five .one_image .top span{ text-transform: uppercase; font-size: 25px; } .my_workouts_list .more_five .one_image .image{ height: 275px; } .my_workouts_list .more_five .one_image .image img{ height: 100%; width: 100%; } /*myWorkouts run timer*/ .totalRounds{ position: absolute; width: 100%; text-align: center; bottom: 10px; height: 65px; } .totalRounds.currentRound{ bottom: 432px; } .totalRounds.currentRound.circle_rounds{ bottom: 250px; height: 100px; width: 40%; } .totalRounds h2{ font-size: 50px; text-transform: uppercase; } .totalRounds.circle_time{ bottom: 65px; } .totalRounds.currentTime h3{ text-transform: uppercase; font-size: 50px; } .circuit_interval{ bottom: 250px; right: 0px; height: 100px; width: 40%; position: absolute; } .circuit_interval h2{ font-size: 50px; text-transform: uppercase; text-align: center; } .clock.my_workout{ height: 400px; position: absolute; bottom: 30px; width: 100%; margin-top: 0px; z-index: 100; } .clock.my_workout.circle_clock{ bottom: 75px; } .my_workout#timer{ width: 350px; margin: auto; } .pie2.my_workout{ box-sizing: border-box; top: 17px; right: 396px; height: 300px; width: 300px; } .my_workout.pietimer > .slice > .pie{ width: 0.9em; height: 0.9em; } .my_workout.pietimer .words{ position: absolute; top: 55px; left: 85px; width: 3.33em; font-size: 50px; text-align: center; font-family: 'Gotham bold'; } .my_workout.pietimer .percent{ position: absolute; top: 108px; left: -68px; width: 3.33em; font-size: 140px; text-align: center; display: none; font-family: 'Gotham thin'; } .my_workout.pietimer .percent.moreThanAMinute { font-size: 95px; left: 8px; top: 125px; } .my_workout.pietimer #rounds{ position: absolute; top: 234px; left: 61px; width: 4.5em; font-size: 50px; text-align: center; font-family: 'Gotham bold'; } #myWorkoutLarge{ width: 648px; height: 648px; position: relative; top: 219px; left: 218px; } #myWorkoutSmall{ display: block; margin: 300px auto 0px; position: relative; } .next_exercise{ display: none; } .next_exercise h1{ font-family: 'Gotham thin'; text-transform: uppercase; text-align: center; font-size: 38px; position: relative; top: 230px; margin: 0px; } .exercise_name{ display: none; position: absolute; left: 218px; top: 659px; height: 80px; width: 648px; } .exercise_name h1{ text-transform: uppercase; overflow: hidden; margin-top: 1px; margin-left: 5px; word-wrap: break-word; } .my_workout_rounds{ position: absolute; left: 0; bottom: 10px; width:100%; text-align: center; } .custom_countdown{ position: absolute; left: 0; bottom: 10px; width: 100%; text-align: center; font-family: 'Gotham book'; text-transform: uppercase; text-align: center; font-size: 50px; z-index: 1; } .my_workout_rounds h1{ font-family: 'Gotham thin'; text-transform: uppercase; text-align: center; font-size: 38px; } #hideBlock{ position: absolute; bottom: 0px; width: 1080px; height: 492px; background: #45505D; z-index: 3; } #lineBlock{ width: 2px; height: 0px; position: absolute; bottom: 270px; right: 140px; background: white; z-index: 4; transition: height 0.1s; } /*text video*/ .singleText#textVideo{ transform-origin: 0 0; display: none; position: absolute; top: 1565px; width: 900px; text-transform: uppercase; font-weight: bold; font-family: 'Gotham thin'; font-size: 47px; line-height: 57px; z-index: 4; height: 130px; display: flex; align-items: center; } #hideBlock{ position: absolute; bottom: 0px; width: 1080px; height: 492px; /* color to change */ background: #45505D; z-index: 3; } #numberBlock{ position: absolute; right: 50px; bottom: 228px; font-family: 'Gotham thin'; font-size: 130px; z-index: 4; } #lineBlock{ width: 2px; height: 0px; position: absolute; bottom: 245px; right: 140px; /* color to change */ background: white; z-index: 4; transition: height 0.1s; } .circleText#textVideo{ transform-origin: 0 0; position: absolute; top: 67px; left: 300px; width: 850px; text-transform: uppercase; font-family: 'Gotham bold'; font-size: 60px; line-height: 57px; } .amrapText#textVideo{ display: none; position: absolute; top: 0px; width: 650px; text-align: center; text-transform: uppercase; font-family: 'Gotham bold'; font-size: 48px; align-items: center; height: 202px; width: 100%; line-height: 57px; padding: 0px 200px; box-sizing: border-box; justify-content: center; } .roundsRFT{ position: absolute; width: 100%; text-align: center; top: 100px; /* color to change */ color: white; text-transform: uppercase; font-family: 'Gotham bold'; font-size: 48px; } .amrapExplain#textVideo{ display: none; position: absolute; top: 218px; height: 166px; width: 672px; text-align: center; text-transform: uppercase; font-family: 'Gotham bold'; font-size: 48px; line-height: 57px; width: 100%; } .complexWorkoutExplain#textVideo{ display: none; position: absolute; top: 220px; text-align: center; text-transform: uppercase; font-family: 'Gotham bold'; font-size: 48px; line-height: 57px; width: 100%; } .amrapExplain#textVideo h2{ display: table-cell; vertical-align: middle; } .circleExplain#textVideo{ display: none; position: absolute; bottom: 25px; left: 0px; width: 1080px; text-transform: uppercase; font-family: 'Gotham bold'; font-size: 48px; line-height: 57px; } .circleExplain#textVideo .rounds { top: -935px; width: 100%; text-align: center; font-size: 67px; position: absolute; } #customWorkoutsWrapper .rounds{ width: 100%; text-align: center; font-size: 67px; position: absolute; top: 217px; font-family: 'Gotham bold'; } #customWorkoutsWrapper .time{ font-family: 'Gotham thin'; position: relative; bottom: 960px; text-align: center; font-size: 24px; word-spacing: 9px; } #customWorkoutsWrapper .totalTime{ font-size: 23px; font-family: 'Gotham thin'; position: absolute; width: 100%; text-align: center; top: 298px; height: 35px; word-spacing: 8px; } #customWorkoutsWrapper .totalTimeValue{ width: 100%; text-align: center; position: absolute; font-size: 30px; top: 322px; font-family: HelveticaNeue; letter-spacing: 15px; } .circleExplain#textVideo .time{ font-family: 'Gotham thin'; position: relative; bottom: 895px; text-align: center; font-size: 24px; word-spacing: 9px; } .circleExplain#textVideo .totalTime{ font-size: 40px; font-family: 'Gotham thin'; position: absolute; width: 100%; text-align: center; bottom: 110px; word-spacing: 8px; } .circleExplain#textVideo .totalTimeValue{ width: 100%; text-align: center; position: absolute; font-size: 105px; bottom: 24px; font-family: HelveticaNeue; letter-spacing: 15px; } /*NEW MENU*/ .main_menu{ height: 100%; margin-top: 350px; margin-left: 165px; overflow: hidden; } .main_menu .element_menu{ height: 360px; width: 360px; border-radius: 5px; float: left; margin-right: 25px; margin-bottom: 25px; } .main_menu .workouts{ position: relative; height: 360px; width: 360px; /* color to change */ border-radius: 5px; float: left; margin-right: 25px; margin-bottom: 25px; } .main_menu .workouts .type{ position: absolute; text-transform: uppercase; width: 100%; text-align: center; font-size: 20px; top: 23px; } .main_menu .workouts .level{ position: absolute; text-transform: uppercase; width: 100%; text-align: center; font-size: 22px; top: 55px; letter-spacing: -2px; } .main_menu .workouts .name{ position: absolute; text-transform: uppercase; font-family: 'HelveticaNeue'; font-size: 36px; text-align: center; top: 60px; letter-spacing: 4px; line-height: 74px; width: 100%; word-wrap: break-word; height: 140px; overflow: hidden; } .main_menu .workouts .creator, .main_menu .workouts .descr{ position: absolute; margin-top: 0px !important; text-transform: uppercase; width: 100%; text-align: center; font-size: 14px; line-height: 24px; letter-spacing: -1px; box-sizing: border-box; padding: 0px 10px; } .main_menu .workouts .gear_images{ display: flex; justify-content: space-around; align-items: center; height: 80px; width: 100%; position: absolute; top: 280px; } .main_menu .workouts .gear_images img{ width: 50px; height: 50px; -webkit-filter: invert(100%); filter: invert(100%); } .main_menu .element_menu:nth-child(2n+2){ margin-right: 0px; } .main_menu .element_menu .image{ height: 140px; text-align: center; } .main_menu .element_menu .image div{ margin-top: 30px; } .main_menu .element_menu .title{ height: 80px; text-align: center; } .main_menu .element_menu .title h1{ text-transform: uppercase; margin: 0px; font-family: 'Gotham light'; font-size: 27px; padding: 0px 25px; line-height: 36px; margin-top: -4px; letter-spacing: 4px; } .main_menu .element_menu .creator{ height: 110px; margin-top: 25px; text-align: center; top: 220px; } .main_menu .element_menu .descr{ top: 255px; } .main_menu .element_menu .descr h3{ text-transform: uppercase; margin: 0px; font-size: 18px; padding-left: 21px; padding-right: 21px; word-spacing: 4px; margin-top: 5px; line-height: 20px; font-family: 'Gotham light'; text-align: center; } .four_menu{ height: 260px; margin: 80px 14px 0px 14px; } .four_menu .element_menu{ height: 250px; width: 250px; border-radius: 5px; float: left; margin-right: 15px; margin-bottom: 40px; } .four_menu .element_menu:nth-child(4){ margin-right: 0px; } .four_menu .element_menu.active{ border-width: 2px; border-style: solid; box-shadow: none; } .four_menu .element_menu .image{ height: 120px; text-align: center; } .four_menu .element_menu .image div{ padding-top: 35px; } .four_menu .element_menu .title{ height: 70px; text-align: center; } .four_menu .element_menu .title h1{ text-transform: uppercase; margin: 0px; font-family: 'Gotham book'; font-size: 25px; margin-top: 10px; } .four_menu .element_menu .descr{ height: 50px; text-align: center; } .four_menu .element_menu .descr h3{ text-transform: uppercase; margin: 0px; font-size: 12px; padding-left: 20px; padding-right: 20px; word-spacing: 4px; margin-top: -19px; line-height: 17px; } .three_menu{ height: 260px; margin: 22px 0px 0px 200px; } .search-page .three_menu, .material-page .three_menu { margin-left: 35px; } .three_menu.workouts_menu{ margin-top: 80px; } .three_menu.bigger_margin{ margin-top: 140px; } .three_menu.workouts_menu .element_menu:nth-child(3), .three_menu.workouts_menu .element_menu:nth-child(4) { margin-bottom: 170px; } .easiest_way{ width: 100%; position: absolute; top: 95px; text-transform: uppercase; font-size: 25px; text-align: center; } .chalenges_text_title{ width: 100%; position: absolute; top: 865px; text-transform: uppercase; font-size: 48px; text-align: center; font-family: 'Gotham light'; letter-spacing: 2px; } .chalenges_text_descr{ width: 100%; position: absolute; top: 920px; text-transform: uppercase; font-size: 25px; text-align: center; } .three_menu .element_menu{ height: 320px; width: 320px; border-radius: 5px; float: left; margin-right: 25px; margin-bottom: 20px; } .three_menu .element_menu.active{ border-width: 2px; border-style: solid; box-shadow: none; } .three_menu .element_menu .image{ height: 120px; text-align: center; } .three_menu .element_menu .image div{ margin-top: 23px; } .three_menu .element_menu .title{ height: 80px; text-align: center; } .three_menu .element_menu .title h1{ text-transform: uppercase; letter-spacing: 2px; margin: 0px; font-family: 'Gotham book'; font-size: 30px; line-height: 34px; padding-left: 20px; padding-right: 20px; } .three_menu .element_menu .descr{ height: 140px; text-align: center; } .three_menu .element_menu .descr h3{ text-transform: uppercase; margin: 0px; font-size: 15px; padding-left: 8px; padding-right: 8px; word-spacing: 4px; margin-top: 33px; line-height: 18px; } .two_menu{ display: flex; justify-content: center; } /*MENU OVERLAY*/ #menuOverlay{ position: absolute; top: 80px; width: 1080px; height: 860px; z-index: 5; overflow: hidden; display: none; } .loaderIcon{ width: 1080px; height: 1920px; display: flex; } .loaderIcon img{ margin: auto; } /*home notifications*/ .home-notification { display: none; background-color: #000000; text-align: center; text-transform: uppercase; position: absolute; z-index: 2; width: 100%; } .home-notification .line1 { font-size: 60px; padding-top: 25px; } .home-notification .line2 { font-size: 35px; padding-bottom: 15px; } /*workout wizzard select*/ /*cercuit choose*/ .workout-wizzard-select .bottom_part{ background-image: url(images/Circuit_background_S.jpg); height: 1160px; } .workout-wizzard-select .choose_exercises{ margin-top: 57px; margin-bottom: 53px; } .workout-wizzard-select .choose_exercises.rft_select{ margin-top: 152px; margin-bottom: 520px; } .workout-wizzard-select .choose_exercises.amrap_select{ margin-top: 152px; margin-bottom: 288px; } .select_level{ height: 92px; padding-top: 7px; padding-left: 171px; margin-bottom: 50px; } .select_level.less_margin_buttom{ margin-bottom: 55px; } .workout-wizzard-select .select_level.minutes{ margin-bottom: 8px; } .select_level .button{ float: left; height: 78px; width: 362px; border-radius: 10px; text-align: center; box-sizing: border-box; display: flex; justify-content: center; align-items: center; } .workout-wizzard-select .select_level .button.duration{ width: 235px; } .workout-wizzard-select .select_level .button.duration.myselection_time{ width: 362px; } .workout-wizzard-select .start_button_workouts{ display: flex; align-items: center; justify-content: center; margin: 0px auto; height: 106px; text-align: center; font-size: 42px; font-family: 'Gotham Book'; text-transform: uppercase; border-style: solid; border-width: 2px; border-radius: 50px; background-color: rgba(0, 0, 0, 0.2); width: 420px; padding: 3px 10px; line-height: 46px; } .workout-wizzard-select .select_level .button:nth-child(2), .workout-wizzard-select .select_level .button:nth-child(3){ margin-left: 17px; } .select_level .button h2{ text-transform: uppercase; font-size: 29px; letter-spacing: 2px; } .workout-wizzard-select .main_title{ text-align: center; width: 720px; margin: auto; font-size: 32px; padding-top: 70px; line-height: 36px; text-transform: uppercase; font-family: 'Gotham light'; } .select_title{ font-family: 'Gotham bold'; text-transform: uppercase; text-align: center; font-size: 27px; } .workout-wizzard-select .select_type{ height: 180px; padding-left: 265px; margin-top: 10px; margin-bottom: 57px; } .workout-wizzard-select .select_type .one_type{ float: left; height: 175px; width: 170px; margin-right: 17px; border-radius: 10px; } .workout-wizzard-select .select_type .one_type .image, .workout-wizzard-select .select_part .one_part .image{ height: 120px; text-align: center; } .workout-wizzard-select .select_type .one_type .image div, .workout-wizzard-select .select_part .one_part .image div{ position: relative; top: 21px; } .workout-wizzard-select .select_part .one_part .image h1{ text-align: center; font-size: 50px; } .workout-wizzard-select .select_type .one_type h3, .workout-wizzard-select .select_part .one_part h3{ text-transform: uppercase; text-align: center; font-size: 21px; } .workout-wizzard-select .select_part .one_part h3{ margin-top: -30px; font-size: 20px; } .select_type .one_type.active, .select_part .one_part.active, .select_level .button.active{ border-width: 2px; border-style: solid; } .workout-wizzard-select .select_part{ height: 185px; padding-top: 10px; padding-left: 358px; } .workout-wizzard-select .select_part .one_part { float: left; height: 175px; width: 175px; border-radius: 10px; margin-right: 15px; } /*PIN CODE*/ .start-checkin-page .pin_code{ margin-top: 433px; } .pin_title{ text-align: center; text-transform: uppercase; font-size: 30px; } .hold_card{ text-transform: uppercase; text-align: center; font-size: 30px; letter-spacing: 1px; } .hold_card.sec_create{ margin-top: 114px; } .hold_card.checkin{ position: absolute; top: 1010px; display: flex; justify-content: center; align-items: center; height: 100px; width: 100%; box-sizing: border-box; padding-left: 230px; padding-right: 200px; } .pin_text{ height: 100%; text-transform: uppercase; font-size: 30px; box-sizing: border-box; padding: 16px; padding-left: 25px; letter-spacing: 1px; text-align: left; } .pin_text_center{ text-align: center; height: 100%; font-size: 30px; box-sizing: border-box; padding: 16px; padding-left: 25px; letter-spacing: 1px; border-color: transparent; width: 100%; } .will_keyboard .search input{ text-transform: none; } .create_acc_title{ margin-top: 82px; margin-bottom: 69px; font-size: 48px; letter-spacing: 1px; text-transform: uppercase; text-align: center; font-family: "Gotham bold"; } .account_write_field{ height: 110px; margin-bottom: 56px; position: relative; width: 440px; margin-left: auto; margin-right: auto; } .title_write_field{ font-size: 29px; letter-spacing: 1px; text-transform: uppercase; text-align: center; margin-bottom: 8px; } .account_write_field_block{ height: 70px; margin: 0 auto; width: 440px; border-width: 4px; border-style: solid; box-sizing: border-box; } .create_select_title{ font-size: 30px; text-transform: uppercase; text-align: center; padding-top: 6px; } .create_account_page .button.gender:nth-child(1){ margin-right: 15px; } .create_account_page .select_level{ padding-top: 16px; } .select_gender{ padding-left: 0px !important; position: relative; margin-left: auto; margin-right: auto; width: 750px; height: 123px; } .button.gender{ margin-right: 10px; margin-top: 8px; } .create_account_page .start_button_wrapper{ padding-top: 32px; } .start_button_wrapper.create_my_acc{ position: absolute; top: 1400px; z-index: 8; display: none; } .start_button_wrapper.create_my_acc a{ padding: 28px 50px 0 50px !important; font-size: 38px !important; } .create_account_page .start_button_wrapper a{ padding: 29px 132px 0 132px; font-size: 42px; } .step_container{ position: absolute; bottom: 55px; left: 437px; height: 25px; width: 174px; } .step_container .step_regisration{ float: left; width: 82px; height: 100%; box-sizing: border-box; border-width: 3px; border-style: solid; } .step_container .step_regisration:nth-child(1){ margin-right: 10px; } .will_keyboard .content_wrapper{ height: 1920px; width: 100%; background-repeat: no-repeat; overflow: hidden; position: absolute; top: 0px; background-color: rgba(0,0,0,0.4); display: none; z-index: 6; } .will_keyboard .change_keyboard span{ margin: 0px; } .will_keyboard span.symbols{ display: none; } .will_keyboard .content-section-alphabet{ position: absolute; display: none; width: 100%; z-index: 7; top: 950px; } .will_keyboard.start-checkin-page .content-section-alphabet{ top: 1050px; } .will_keyboard .content_wrapper .content-section-alphabet{ margin-top: 932px; } .not_rfid{ height: 80px; } .not_rfid.margin{ margin-bottom: 150px; } .finalize_acc{ height: 120px; } .finalize_acc h2, .not_rfid h2{ text-transform: uppercase; text-align: center; font-size: 28px; letter-spacing: 1px; position: relative; width: 670px; margin: auto; } .two_arrows{ position: absolute; left: 135px; top: 1030px; display: flex; } .two_arrows .fes-icon{ width: 45px; } /*LITTLE KEYBOARD*/ .close_cross{ position: absolute; top: 1028px; left: 685px; transform: rotate(45deg); width: 32px; z-index: 11; } .create_account_page .close_cross{ top: 1310px; } .little_keyboard_block{ display: none; } .background_little_keyboard{ height: 1920px; width: 100%; position: absolute; top: 0px; background-color: rgba(0,0,0,0.4); z-index: 9; overflow: hidden; } .little_keyboard{ position: absolute; z-index: 11; width: 251px; height: 356px; top: 1060px; box-sizing: border-box; left: 413px; border-width: 1px; border-style: solid; /* color to change */ border-color: #9fa6ac; border-radius: 2px; } .little_keyboard .keyboard_row{ width: 251px; height: 89px; box-sizing: border-box; border-bottom-width: 1px; border-bottom-style: solid; } .little_keyboard .keyboard_row:nth-child(4){ border-bottom: none; } .little_keyboard .keyboard_cell{ float: left; width: 83px; box-sizing: border-box; height: 100%; border-right-width: 1px; border-right-style: solid; display: flex; align-items: center; justify-content: center; font-weight: bold; font-size: 30px; } .little_keyboard .keyboard_cell:nth-child(3){ border-right: none; } .little_keyboard .keyboard_cell img{ width: 34px; } .pin_overlay{ position: absolute; width: 432px; height: 63px; top: 46px; display: none; } .pin_overlay .pin_cell{ float: left; width: 50.5px; height: 63px; border-right-width: 4px; border-right-style: solid; border-right-color: rgba(159,166,172,0.37); display: flex; align-items: center; justify-content: center; } .pin_overlay .pin_cell span{ color: rgba(159,166,172,0.37); font-size: 30px; } .pin_overlay .pin_cell:nth-child(8){ border-right: none; } .active_pin_enter{ letter-spacing: 39px; text-align: left; } .pin_descr{ position: absolute; font-size: 24px; letter-spacing: 1px; text-transform: uppercase; text-align: center; margin-bottom: 8px; top: 975px; left: 292px; z-index: 6; width: 500px; line-height: 26px; } .create_account_page .pin_descr{ top: 1025px; } #email:invalid{ /* color to change */ background-color: pink; } /*REGISTRATION SUCCESS*/ .registration_success{ position: absolute; top: 0px; left: 0px; background-image: url(images/general-start-checkin.jpg); width: 1080px; height: 1920px; z-index: 10; display: none; } .registration_success .main_title{ font-size: 50px; font-family: "Gotham bold"; text-transform: uppercase; text-align: center; margin-top: 312px; padding: 0px 50px; line-height: 65px; } .registration_success .secondary_title{ font-size: 35px; font-family: "Gotham light"; text-transform: uppercase; text-align: center; padding: 0px 130px; margin-top: 5px; word-spacing: 8px; line-height: 68px; } .registration_success .start_button_wrapper .start_button{ padding: 30px 120px 0 120px; font-family: 'Gotham light'; font-size: 40px; position: relative; top: 445px; letter-spacing: 2px; position: relative; top: 442px; } /*OR BLOCK*/ .or_block{ width: 100%; text-align: center; position: absolute; } .or{ text-transform: uppercase; font-size: 18px !important; font-family: 'Gotham book' !important; } .or_create{ top: 1325px; } .or_pass_start_checkin{ top: 1020px; } .or_bracelet_start_checkin{ top: 1140px; } .or_myworkouts_checkin{ top: 990px; } .my_work_loader{ display: none; position: absolute; top: 0px; left: 0px; z-index: 15; width: 1080px; height: 1920px; background: rgba(0,0,0,0.2); display: flex; flex-direction: column; justify-content: center; align-items: center; } .my_work_loader .loader_image{ -webkit-animation: loading 1s linear alternate infinite; width: 100px; height: 100px; border-radius: 50%; border-width: 4px; border-style: solid; display: none; } .my_work_loader h3{ margin-top: 40px; font-size: 30px; font-weight: bold; text-transform: uppercase; font-family: "Gotham bold"; display: none; } .cant_touch{ background: rgba(0,0,0,.5); position: absolute; z-index: 2; width: 360px; height: 360px; border-radius: 5px; } /*CUSTOM EXPLAIN PAGE*/ #customWorkoutsWrapper{ position: absolute; top: 640px; left: 0px; width: 1080px; height: 1280px; z-index: 5; background-repeat: no-repeat; } #customWorkoutsWrapper .custom_explain{ height: 100%; width: 100%; position: relative; } /* tiers common */ .tier-wrapper { float: left; } .tier-wrapper.with-name .tiers-controls { display: none; } .tier-wrapper.with-controls .cardio_footer, .tier-wrapper.with-controls .workout_name, .tier-wrapper.with-controls .circuit-tile-footer { display: none; } .tier-wrapper .tiers-controls{ display: flex; } .tier-wrapper .tier-control { height: 100%; display: flex; justify-content: center; align-items: center; text-transform: uppercase; font-size: 20px; } .tier-wrapper .tier-regular { box-sizing: border-box; } .tier-control.selected-tier { font-weight: bold; } .tier-control.no-tier > span { opacity: 0.25; } .with-tiers .tier-wrapper .img_block_cardio.active-exercise, .with-tiers .tier-wrapper .img_block.active-exercise { display: block; } .custom_explain .with-tiers .inner_little_block_cardio, .with-tiers .custom_explain .inner_little_block_cardio{ padding-left: 87px; padding-right: 87px; } /* for more than 6 exercises*/ .inner_little_block_cardio .tier-wrapper { margin-right: 22px; margin-bottom: 20px; } .inner_little_block_cardio .tier-wrapper:nth-of-type(4n){ margin-right: 0px; } .inner_little_block_cardio .tier-wrapper .tiers-controls{ height: 60px; } .inner_little_block_cardio .tier-wrapper .tier-control { width: 47px; font-size: 20px; } .inner_little_block_cardio .tier-wrapper .tier-regular { width: 115px; } .inner_little_block_cardio .tier-wrapper .tier-regressive, .inner_little_block_cardio .tier-wrapper .tier-progressive { font-size: 40px; } .with-tiers .inner_little_block_cardio .img_block_cardio{ width: 210px; display: none; } .with-tiers .inner_little_block_cardio .custom_image{ height: 210px; } .with-tiers .inner_little_block_cardio .with-name .custom_image{ height: 225px; } /* for from 4 to 7 exercises*/ .inner_medium_lot_block_cardio .tier-wrapper { margin-right: 22px; margin-bottom: 20px; } .inner_medium_lot_block_cardio .tier-wrapper:nth-of-type(3n){ margin-right: 0px; } .inner_medium_lot_block_cardio .tier-wrapper .tiers-controls{ height: 100px; } .inner_medium_lot_block_cardio .tier-wrapper .tier-control { font-size: 20px; width: 80px; } .inner_medium_lot_block_cardio .tier-wrapper .tier-regular { width: 150px; } .inner_medium_lot_block_cardio .tier-wrapper .tier-regressive, .inner_medium_lot_block_cardio .tier-wrapper .tier-progressive { font-size: 40px; } .with-tiers .inner_medium_lot_block_cardio .img_block { width: 310px; display: none; } .with-tiers .inner_medium_lot_block_cardio .img_block .custom_image{ width: 100%; height: 265px; } .with-tiers .inner_medium_lot_block_cardio .with-name .img_block .custom_image{ height: 307px; } /* for from 1 to 5 exercises */ .inner_medium_block_cardio .tier-wrapper { margin-right: 25px; margin-bottom: 25px; } .inner_medium_block_cardio .tier-wrapper:nth-of-type(2n){ margin-right: 0px; } .inner_medium_block_cardio .tier-wrapper .tiers-controls{ height: 100px; } .inner_medium_block_cardio .tier-wrapper .tier-control { font-size: 20px; width: 90px; } .inner_medium_block_cardio .tier-wrapper .tier-regular { width: 160px; } .inner_medium_block_cardio .tier-wrapper .tier-regressive, .inner_medium_block_cardio .tier-wrapper .tier-progressive { font-size: 40px; } .with-tiers .inner_medium_block_cardio .img_block{ width: 340px; display: none; } .with-tiers .inner_medium_block_cardio .img_block .custom_image{ width: 100%; height: 296px; } .with-tiers .inner_medium_block_cardio .with-name .img_block .custom_image{ height: 334px; } /* for 1 exercise */ .inner_large_block_cardio .tier-wrapper .tiers-controls{ height: 150px; } .inner_large_block_cardio .tier-wrapper .tier-control { font-size: 30px; width: 167px; } .inner_large_block_cardio .tier-wrapper .tier-regular { width: 340px; } .inner_large_block_cardio .tier-wrapper .tier-regressive, .inner_large_block_cardio .tier-wrapper .tier-progressive { font-size: 40px; } .with-tiers .inner_large_block_cardio .img_block{ width: 674px; display: none; } .with-tiers .inner_large_block_cardio .img_block .custom_image{ width: 100%; height: 592px; } .with-tiers .inner_large_block_cardio .with-name .img_block .custom_image{ height: 672px; } /* for custom circuits */ .custom-circuit-exercises-wrapper .tier-wrapper{ margin-right: 15px; margin-bottom: 15px; width: 190px; } .custom-circuit-exercises-wrapper.custom-circuit-single-round .tier-wrapper { margin-right: 25px; margin-bottom: 25px; } .custom-circuit-exercises-wrapper.custom-circuit-single-round .tier-wrapper:nth-of-type(4n){ margin-right: 0px; } .custom-circuit-exercises-wrapper .img_block { display: none; } .custom-circuit-exercises-wrapper .tier-wrapper .img_block .cardio { height: 40px; padding: 0 10px 0 10px; word-break: break-word; display: flex; align-items: center; } .custom-circuit-exercises-wrapper .tier-wrapper .img_block .cardio h1{ margin: 0; font-size: 14px; } .custom-circuit-exercises-wrapper .tier-wrapper .img_block .custom_image { height: 190px; } .custom-circuit-exercises-wrapper .tier-wrapper .tiers-controls { height: 40px; } .custom-circuit-exercises-wrapper .tier-wrapper .tier-control { font-size: 20px; width: 40px; } .custom-circuit-exercises-wrapper .tier-wrapper .tier-regular { font-size: 17px; width: 110px; } .custom_explain .inner_little_block{ height: 94%; width: 100%; box-sizing: border-box; padding: 412px 12px 0px 12px; } .custom_explain .inner_little_block_cardio{ height: 94%; width: 100%; box-sizing: border-box; padding: 290px 48px 0px 45px; } .custom_explain.circle_custom .inner_little_block{ padding: 20px 12px 0px 12px; align-items: flex-start; align-content: flex-start; } .inner_little_block .img_block{ width: 248px; float: left; margin-right: 16px; margin-bottom: 16px; } .workout_now .custom_explain.circle_custom .inner_little_block_cardio{ height: 94%; width: 100%; box-sizing: border-box; padding: 32px 48px 0px 45px; } .custom_explain.circle_custom .inner_little_block{ padding: 20px 12px 0px 12px; align-items: flex-start; align-content: flex-start; } .inner_little_block .img_block{ width: 248px; float: left; margin-right: 16px; margin-bottom: 16px; } .with-exercises .inner_little_block_cardio .img_block_cardio{ width: 230px; float: left; margin-right: 22px; margin-bottom: 20px; } .with-exercises .custom_explain.circle_custom .inner_little_block_cardio .img_block_cardio{ height: 280px; } .with-exercises .custom_explain.circle_custom .inner_little_block_cardio .custom_image{ height: 200px; } .with-exercises .custom_explain.circle_custom .inner_little_block_cardio .workout_name{ height: 40px; } .inner_little_block_cardio .img_block_cardio .cardio h1{ font-size: 17px; margin: 0px; padding-left: 10px; word-break: break-word; } .inner_little_block_cardio .img_block_cardio:nth-of-type(4n){ margin-right: 0px; } .with-exercises .inner_little_block_cardio .custom_image{ height: 225px; } .img_block_cardio .cardio{ height: 40px; display: flex; align-items: center; } .img_block_cardio .workout_name{ height: 45px; } .img_block_cardio .workout_name h1{ margin: 0px; padding-left: 10px; padding-top: 6px; font-size: 14px; text-transform: uppercase; } .custom_explain.circle_custom .inner_little_block .img_block{ margin-bottom: 20px; } .custom_explain .inner_medium_block{ height: 86%; width: 100%; box-sizing: border-box; padding: 362px 164px 0px 180px; } .custom_explain.circle_custom .inner_medium_block{ align-items: flex-start; align-content: flex-start; padding: 20px 164px 0px 180px; } .custom_explain.circuit_custom .inner_medium_block{ padding: 362px 250px 0px 250px; } .inner_medium_block .img_block{ width: 340px; margin-bottom: 40px; float: left; margin-right: 28px; } .custom_explain.circuit_custom .inner_medium_block .img_block{ width: 274px; margin-bottom: 32px; } .custom_explain .inner_medium_lot_block{ height: 86%; width: 100%; box-sizing: border-box; padding: 362px 30px 0px 30px; } .custom_explain .inner_medium_lot_block_cardio{ height: 86%; width: 100%; box-sizing: border-box; padding: 350px 50px 0px 45px; } .workout_now .custom_explain.circle_custom .inner_medium_lot_block_cardio{ padding-top: 50px; } .workout_now .custom_explain.circle_custom .inner_medium_lot_block_cardio.four-exercises{ padding: 50px 200px 0px 200px; } .workout_now .custom_explain.circle_custom .inner_medium_lot_block_cardio.four-exercises .img_block:nth-of-type(3n){ margin-right: 32px; } .emom-explain .custom_explain .inner_medium_block_cardio{ padding-top: 50px; height: auto; } .emom-explain .custom_explain .inner_large_block_cardio{ padding-top: 100px; height: auto; } .emom-explain .clock.my_workout { height: 330px; transform: scale(0.8); } .emom-explain .clock.my_workout .percent{ transform: scale(0.75); } .emom-explain .totalRounds.circle_time { bottom: 35px; } .emom-explain .totalRounds.circle_time h2, .emom-explain .totalRounds.circle_time h3 { bottom: 35px; font-size: 40px; } .custom_explain .inner_medium_block_cardio{ height: 86%; width: 100%; box-sizing: border-box; padding: 300px 185px 0px 185px; } .custom_explain .inner_large_block_cardio{ height: 86%; width: 100%; box-sizing: border-box; padding: 300px 185px 0px 185px; display: flex; justify-content: center; align-items: center; } .custom_explain.custom_7minute .inner_large_block_cardio { height: auto; padding-top: 50px; } .custom_explain.circle_custom .inner_large_block_cardio{ height: 66%; padding-top: 0px; } .custom_explain.circle_custom .inner_medium_lot_block{ padding: 20px 30px 0px 30px; } .custom_explain .inner_six_lot_block{ height: 86%; width: 100%; box-sizing: border-box; padding: 415px 45px 0px 45px; display: flex; flex-wrap: wrap; justify-content: space-between; } .custom_explain.circle_custom .inner_six_lot_block{ padding: 20px 45px 0px 45px; align-content: flex-start; } .with-exercises .inner_medium_lot_block .img_block{ height: 415px; width: 330px; margin-bottom: 30px; float: left; margin-right: 10px; } .with-exercises .inner_medium_lot_block_cardio .img_block{ height: 410px; width: 307px; margin-bottom: 28px; float: left; margin-right: 32px; } .with-exercises .inner_medium_block_cardio .img_block{ height: 454px; width: 337px; margin-bottom: 32px; float: left; margin-right: 36px; } .with-exercises .inner_large_block_cardio .img_block{ height: 822px; width: 674px; } .inner_medium_lot_block_cardio .img_block:nth-of-type(3n){ margin-right: 0px; } .inner_medium_block_cardio .img_block:nth-of-type(2n){ margin-right: 0px; } .custom-circuit-single-round .img_block .cardio_footer{ height: 40px; } .inner_medium_lot_block_cardio .img_block .cardio_footer{ height: 58px; } .inner_medium_block_cardio .img_block .cardio_footer{ height: 62px; } .inner_large_block_cardio .img_block .cardio_footer{ height: 70px; } .inner_medium_lot_block_cardio .img_block .cardio_footer .cardio_name{ font-size: 19px; text-transform: uppercase; height: 100%; padding: 6px 12px; box-sizing: border-box; } .inner_medium_block_cardio .img_block .cardio_footer .cardio_name{ font-size: 20px; text-transform: uppercase; height: 100%; padding: 6px 12px; box-sizing: border-box; } .inner_large_block_cardio .img_block .cardio_footer .cardio_name{ font-size: 20px; text-transform: uppercase; height: 100%; padding: 6px 12px; box-sizing: border-box; } .inner_six_lot_block .img_block{ height: 362px; width: 298px; margin-bottom: 40px; } .custom_explain .inner_large_block{ height: 86%; width: 100%; box-sizing: border-box; padding: 380px 180px 0px 180px; display: flex; flex-wrap: wrap; justify-content: space-around; } .inner_large_block .img_block{ width: 674px; } .inner_medium_block .img_block .custom_header, .inner_medium_lot_block .img_block .custom_header{ width: 100%; height: 76px; } .inner_medium_lot_block_cardio .img_block .custom_header{ width: 100%; height: 50px; } .inner_medium_block_cardio .img_block .custom_header{ width: 100%; height: 58px; } .inner_large_block_cardio .img_block .custom_header{ width: 100%; height: 80px; } .inner_medium_lot_block_cardio .img_block .custom_header .cardio_count{ font-size: 22px; padding-left: 14px; align-items: center; height: 100%; word-break: break-word; } .inner_medium_block_cardio .img_block .custom_header .cardio_count{ font-size: 22px; padding-left: 14px; align-items: center; height: 100%; word-break: break-word; } .inner_large_block_cardio .img_block .custom_header .cardio_count{ font-size: 30px; padding-left: 14px; align-items: center; height: 100%; word-break: break-word; } .custom_explain.circuit_custom .inner_medium_block .img_block .custom_header{ height: 70px; } .inner_six_lot_block .img_block .custom_header{ width: 100%; height: 76px; } .inner_medium_block .custom_header .custom_name, .inner_medium_lot_block .custom_header .custom_name{ float: left; height: 100%; width: 256px; } .inner_six_lot_block .custom_header .custom_name{ float: left; height: 100%; width: 224px; } .inner_medium_block .img_block .custom_image, .inner_medium_lot_block .img_block .custom_image{ width: 100%; height: 340px; } .with-exercises .inner_medium_lot_block_cardio .img_block .custom_image{ width: 100%; height: 303px; } .with-exercises .inner_medium_block_cardio .img_block .custom_image{ width: 100%; height: 334px; } .with-exercises .inner_large_block_cardio .img_block .custom_image{ width: 100%; height: 672px; } .custom_explain.circuit_custom .inner_medium_block .img_block .custom_image{ height: 268px; } .inner_six_lot_block .img_block .custom_image{ width: 100%; height: 286px; } .inner_large_block .img_block .custom_header{ width: 100%; height: 150px; } .inner_large_block .custom_header .custom_name{ float: left; height: 100%; width: 544px; font-size: 32px; } .inner_large_block .custom_header .custom_name.mmr_header{ width: 100%; } .inner_large_block .img_block .custom_image{ width: 100%; height: 672px; } .inner_little_block .img_block .custom_header{ width: 100%; height: 150px; } .inner_little_block .custom_header .custom_name{ float: left; height: 100%; width: 544px; } .inner_little_block .img_block .custom_image{ width: 100%; height: 248px; } .custom_name{ display: flex; justify-content: flex-start; padding-left: 30px; align-items: center; font-size: 16px; text-transform: uppercase; text-align: center; box-sizing: border-box; } .custom_image img{ width: 100%; height: 100%; } /*RUSSIAN TRANSLATION STYLES*/ [lang='ru'] .tabata_start_text_wrapper>span{ font-size: 108px; } [lang='ru'] .pin_text_center{ font-size: 20px; } [lang='ru'] .user_img span.add_user{ font-size: 18px; } [lang='ru'] .checkin-button{ display: flex; margin: auto; justify-content: center; } [lang='ru'] .three_menu .element_menu .title h1{ font-size: 26px; } [lang='ru'] .workout_now .clients .client .status h2{ font-size: 16px; } [lang='ru'] .amrapExplain#textVideo h2{ font-size: 35px; } /*SPANISH TRANSLATION STYLES*/ [lang='es'] .workout_now .clients .client .status h2{ font-size: 16px; } [lang='es'] .three_menu .element_menu .title h1{ font-size: 26px; } [lang='es'] .pin_text_center::-webkit-input-placeholder{ font-size: 18px; padding-top: 7px; } [lang='es'] .trr > div { text-align: center; } [lang='es'] .trr > div > div { margin-left: 0px; } [lang='es'] .interval_header{ font-size: 79px; } /*DUTCH TRANSLATION STYLES*/ [lang='nl'] .pin_text_center::-webkit-input-placeholder{ font-size: 25px; } /*GERMAN TRANSLATION STYLES*/ [lang='de'] .pin_text_center::-webkit-input-placeholder{ font-size: 25px; } [lang='de'] .swiper-slide .slide_descr{ font-size: 18px; } /*HEBREW TRANSLATION STYLES*/ [lang='he'] .search-page .show_exercises .start_button{ line-height: 75px; } /*PORTUGEESE TRANSLATION STYLES*/ [lang='pt'] .menu_wrapper .menu .three_menu .element_menu .title h1{ font-size: 24px; } [lang='pt'] .user-avatar .user_img{ font-size: 23px; } [lang='pt'] .new-header .button-descr{ font-size: 15px; } /* Monthly Trainings */ /* Exceptions */ .monthly-training .go_back { position: absolute; } .monthly-training .menu_wrapper, .monthly-training .content_wrapper { height: 1280px; } .group-trainings.monthly-training .menu_wrapper { height: auto; } .monthly-training .menu-page.challenge-set-page .page-header>p { margin-left: 90px; } .monthly-training .workout_checkin_page .page-header>p{ padding-top: 35px; margin-left: 90px; } .monthly-training .clock{ margin-top: 90px; } .monthly-training .pietimer > .percent { top: 300px; left: -20px; } .monthly-training .menu-page.workout_now{ background: linear-gradient(to bottom, #41484f 50%,#3f4a55 100%); } .monthly-training #startButton a, .monthly-training #startButtonWorkouts a, .monthly-training #startButtonNew a { position: relative; z-index: 2; } .monthly-training .totalRounds.currentRound.circle_rounds { height: auto; } .monthly-training .totalRounds h2 { font-size: 70px; } .monthly-training .totalRounds.circle_time { bottom: 60px; height: auto; font-weight: bold; } .monthly-training .totalRounds.currentTime h3 { font-size: 70px; } .monthly-training .circuit_interval { bottom: 310px; height: auto; } .monthly-training .circuit_interval h2 { font-size: 70px; } .monthly-training .main_menu .element_menu { background: #45535e; } .monthly-training .three_menu { margin: 22px 10px 0px 35px; } .monthly-training .three_menu.workouts_menu .element_menu:nth-child(3), .monthly-training .three_menu.workouts_menu .element_menu:nth-child(4) { margin-bottom: 0; } .monthly-training .three_menu.workouts_menu .element_menu:nth-child(-n+3) { margin-bottom: 170px; } .monthly-training .easiest_way { top: 115px; } .monthly-training .chalenges_text_title { top: 525px; } .monthly-training .chalenges_text_descr { top: 605px; } .monthly-training .three_menu .element_menu { background: #45535e; } .monthly-training .three_menu .element_menu:nth-child(3){ margin-right: 0px; } .monthly-training .loaderText { font-family: 'HelveticaNeue'; font-size: 100px; text-transform: uppercase; text-align: center; position: absolute; width: 100%; top: 400px; } /* Header */ .monthly-trainings-page .page-header, .monthly-trainings-page .content-header{ width: 100%; height: 80px; } .monthly-trainings-page .page-header > p, .monthly-trainings-page .content-header > p{ width: 100%; height: 80px; padding: 30px 0 0 0; box-sizing: border-box; text-align: center; font-size: 49px; text-transform: uppercase; letter-spacing: 3px; word-spacing: 0px; } /* .monthly-trainings-page .page-header>p, .monthly-trainings-page .content-header>p { margin-left: 90px; } */ /* .go_home{ display: inline-block; width: 90px; height: 80px; background-image: url(../images/go_home_arrow.png); background-repeat: no-repeat; float: right; background-size: 40%; background-position: 56% 100%; } */ /* Menu */ .menu_wrapper, .virtual_trainings{ width: 100%; background-repeat: no-repeat; overflow:hidden; } .trainings-text_wrapper{ width: 100%; } .trainings-text_wrapper>.trainings-text{ font-size: 24px; text-transform: uppercase; padding: 27px 0 0 0; text-align: center; letter-spacing: 0.5px; word-spacing: 1px; font-family: Gotham light; } .training-selection-menu { display: flex; flex-wrap: wrap; margin-top: 75px; padding-left: 40px; font-family: 'Gotham light'; text-transform: uppercase; text-align: center; } .training-selection-menu .menu-item { width: 485px; height: 485px; margin-right: 30px; margin-bottom: 30px; border-radius: 5px; display: flex; flex-direction: column; justify-content: center; } .training-selection-menu .menu-item .item-header { font-size: 50px; letter-spacing: 3px; padding: 0px 12px; } .training-selection-menu .menu-item .item-description { font-size: 20px; margin-top: 10px; padding: 0px 30px; } .training-selection-menu .menu-item.temporary-button { background: #f9c64e; font-weight: bold; } .training-selection-menu .menu-item.temporary-button .item-header { color: #fff; font-size: 45px; } .training-selection-menu .menu-item.temporary-button .item-header p:first-of-type{ margin-bottom: 45px; } .training-selection-menu .menu-item.temporary-button .item-description { color: #fff; } /* Content */ .filters-wrapper { height: 125px; margin-top: 55px; position: relative; z-index: 2; } .filters-container { width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.2); font-size: 25px; text-transform: uppercase; } .filters-container .filters-title { height: 48px; display: flex; justify-content: center; align-items: center; } .filters-container .filters-categories-wrapper { display: flex; padding-left: 15px; } .filters-container .filters-categories-wrapper .filter-category { width: 250px; height: 60px; border-radius: 7px; display: flex; justify-content: center; align-items: center; margin-right: 15px; cursor: pointer; } .filters-container .filters-categories-wrapper .filter-category .filter-category-name { width: 195px; text-align: center; padding: 0 10px; } .filters-container .filters-categories-wrapper .filter-category .filter-dropdown-arrow { width: 55px; display: flex; align-items: center; font-size: 30px; } .filters-container .filters-categories-wrapper .filter-category .filter-dropdown-cross { width: 55px; display: flex; align-items: center; font-size: 30px; display: none; } .filters-dropdowns-wrapper { position: relative; } .filters-dropdowns-wrapper .filter-dropdown { width: 230px; position: absolute; display: none; } .filters-dropdowns-wrapper .filter-dropdown.duration { left: 25px; } .filters-dropdowns-wrapper .filter-dropdown.level { left: 290px; } .filters-dropdowns-wrapper .filter-dropdown.type { left: 555px; } .filters-dropdowns-wrapper .filter-dropdown.trainer { left: 820px; } .filters-dropdowns-wrapper .filter-dropdown .filter-value { min-height: 45px; display: flex; justify-content: center; align-items: center; cursor: pointer; text-align: center; padding: 0 10px; } .filters-dropdowns-wrapper .filter-dropdown .filter-value:hover { background-color: #a2a7aa; } .virtual_trainings{ height: 1607px; margin-top: 40px; padding-top: 13px; } .iScrollVerticalScrollbar { height: 1770px; margin-top: 150px; } .virtual-trainings-wrapper { display: flex; padding-left: 15px; flex-wrap: wrap; } .virtual-trainings-wrapper .virtual-training-tile { width: 250px; height: 250px; margin-right: 15px; margin-bottom: 15px; position: relative; text-align: center; text-transform: uppercase; letter-spacing: 1px; font-family: 'Gotham Book'; font-size: 16px; border-radius: 5px; box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.2); } .virtual-trainings-wrapper .virtual-training-tile .virtual-training-name { position: absolute; top: 42px; padding: 0 10px; font-size: 19px; font-weight: bold; width: 100%; box-sizing: border-box; line-height: 22px; } .virtual-trainings-wrapper .virtual-training-tile .virtual-training-trainer-wrapper { position: absolute; width: 100%; box-sizing: border-box; top: 140px; } .virtual-trainings-wrapper .virtual-training-tile .virtual-training-trainer-wrapper .virtual-training-trainer-name { font-weight: bold; font-size: 17px; } .virtual-trainings-wrapper .virtual-training-tile .virtual-training-level { position: absolute; width: 100%; box-sizing: border-box; top: 220px; } .trainings-tiles { padding-left: 15px; padding-top: 15px; display: flex; flex-wrap: wrap; } .trainings-tiles .training-tile .training-tile-image { font-size: 85px; font-weight: bold; margin-top: 30px; margin-bottom: 25px; } .trainings-tiles .training-tile .training-tile-description { font-size: 25px; text-transform: uppercase; text-align: center; } .tiles-row{ padding: 15px 0 0 15px; float: left; } .training-tile{ width: 250px; height: 250px; margin: 0 15px 15px 0; border-radius: 10px; display: flex; flex-direction: column; align-items: center; } .training-tile:last-child{ margin: 0; } .tile-image-wrapper{ height: 121px; padding: 5px 0 0 0; } .tile-image-wrapper>.tile-image{ background: url(images/mat_box.png); height: 115px; width: 115px; margin: 0 auto; background-size: cover; background-repeat: no-repeat; } .training-tile>.tile-text>div{ font-size: 24px; text-transform: uppercase; font-family: Gotham Book; text-align: center; } .previews-row{ padding: 11px 0 0 46px; display: flex; justify-content: center; } .training-preview{ width: 478px; height: 477px; float: left; margin: 0 30px 0 0; } .second-row{ padding: 35px 0 0 46px; } .selected-training-wrapper { width: 1080px; height: 1920px; text-transform: uppercase; text-align: center; font-size: 38px; font-family: 'Gotham thin'; } .selected-training-wrapper .go_back { left: 0; } .selected-training-wrapper .training-page-small-header { font-family: 'Gotham bold'; margin-bottom: 12px; } .selected-training-wrapper .training-name-wrapper { top: 165px; position: absolute; display: flex; width: 100%; justify-content: center; } .selected-training-wrapper .training-name-wrapper .training-name { font-family: 'Gotham bold'; font-size: 65px; width: 870px; position: relative; line-height: 67px; letter-spacing: 3px; } .selected-training-wrapper .training-description-wrapper { top: 340px; position: absolute; display: flex; width: 100%; align-items: center; flex-direction: column; } .selected-training-wrapper .training-description-wrapper .training-description { width: 900px; line-height: 45px; letter-spacing: 1px; font-size: 34px; } .selected-training-wrapper .training-trainer-wrapper { top: 575px; position: absolute; display: flex; width: 100%; align-items: center; flex-direction: column; } .selected-training-wrapper .training-desctrainerription-wrapper .training-trainer { letter-spacing: 1px; } .selected-training-wrapper .training-start-button-wrapper { top: 740px; position: absolute; display: flex; width: 100%; align-items: center; flex-direction: column; } .selected-training-wrapper .training-start-button-wrapper .start_button { width: 390px; font-size: 40px; padding-top: 8px; padding-left: 80px; padding-right: 80px; line-height: 43px; letter-spacing: 1px; cursor: pointer; } .selected-training-wrapper .training-level-wrapper { top: 920px; position: absolute; display: flex; width: 100%; align-items: center; flex-direction: column; } .selected-training-wrapper .training-level-wrapper .training-levels { display: flex; width: 325px; justify-content: space-between; } .selected-training-wrapper .training-level-wrapper .training-levels .training-level-circle { width: 40px; height: 40px; border-radius: 50%; border: 5px solid #EDEDE9; } .selected-training-wrapper .training-duration-wrapper { top: 1090px; position: absolute; display: flex; width: 100%; align-items: center; flex-direction: column; } .selected-training-wrapper .training-equipment-wrapper { top: 1220px; position: absolute; display: flex; width: 100%; align-items: center; flex-direction: column; } .selected-training-wrapper .training-equipment-wrapper .training-equipment { display: flex; } .selected-training-wrapper .training-equipment-wrapper .training-equipment .equipment-image { width: 135px; height: 135px; margin-right: 7px; margin-left: 7px; font-size: 110px; } /* Backgrounds */ .monthly-trainings-page{ background-image: url(images/background_maandtraining.jpg); } .background-holder{ height: 1920px; width: 1080px; background-repeat: no-repeat; overflow:hidden; } /* Images */ .ac_short { background-image: url(images/Abcore_1min.png); } .ac_long { background-image: url(images/Abcore_10min.png); } .sbtk_short { background-image: url(images/kettlebell_1min.png); } .sbtk_long { background-image: url(images/kettlebell_10min.png); } .move_it_short { background-image: url(images/Moveit_1min.png); } .move_it_long { background-image: url(images/Moveit_10min.png); } .rumble_short { background-image: url(images/Rumble_1min.png); } .rumble_long { background-image: url(images/Rumble_10min.png); } .body-weight-HIIT-class { background-image: url(images/fullbody_class_thumbnail.jpg); } .body-weight-HIIT-light-class { background-image: url(images/Body_weight_HIIT_light_class.jpg); } .kettlebell-HIIT-class { background-image: url(images/Kettlebell_HIIT_class.jpg); } .core-HIIT-class { background-image: url(images/Core_HIIT_class.jpg); } .boxing-HIIT-class { background-image: url(images/Boxing_class_thumbnail.jpg); } .miniband-HIIT-class { background-image: url(images/miniband_hiit_class.jpg); } /* Pietimer */ .multiple-screen-pietimer { position: absolute; top: 520px; } .multiple-screen-pietimer .pie2{ top: 20px; } /* Users part */ /* .workout-info-block.few-users */ .workout-info-block.few-users .clients { margin-top: 30px; height: 400px; } .workout-info-block.few-users .clients .client { margin-left: 20px; margin-right: 20px; width: 320px; height: 320px; } .workout-info-block.few-users .clients .client .photo { height: 245px; } .workout-info-block.few-users .clients .client .photo .img { width: 170px; height: 170px; } .workout-info-block.few-users .clients .client .status { height: 75px; } .workout-info-block.few-users .clients .client .status h2 { height: 40px; font-size: 32px; margin-top: 20px; } .workout-info-block.few-users .clients .client .status-heartrate span { font-size: 45px; } .workout-info-block.few-users .clients .client .status.status-name h2 { width: 240px; height: 40px; font-size: 32px; margin-top: 20px; } .workout-info-block.few-users .workout-info-tabs .workout-tabs-wrapper { top: 448px; } .workout-info-block.few-users .description-container.workout-description { height: 400px; padding-top: 15px; } /* .workout-info-block.average-users */ .workout-info-block.average-users .clients { margin-top: 30px; height: 750px; } .workout-info-block.average-users .clients .client { margin-left: 20px; margin-right: 20px; width: 320px; height: 320px; } .workout-info-block.average-users .clients .client .photo { height: 245px; } .workout-info-block.average-users .clients .client .photo .img { width: 170px; height: 170px; } .workout-info-block.average-users .clients .client .status { height: 75px; } .workout-info-block.average-users .clients .client .status h2 { height: 40px; font-size: 32px; margin-top: 20px; } .workout-info-block.average-users .clients .client .status-heartrate span { font-size: 45px; } .workout-info-block.average-users .clients .client .status.status-name h2 { width: 240px; height: 40px; font-size: 32px; margin-top: 20px; } .workout-info-block.average-users .workout-info-tabs .workout-tabs-wrapper { top: 798px; } .workout-info-block.average-users .description-container.workout-description { height: 750px; padding-top: 30px; } /* .workout-info-block.nearly-lot-users */ .workout-info-block.nearly-lot-users .clients { margin-top: 30px; height: 580px; } .workout-info-block.nearly-lot-users .clients .client { margin-left: 15px; margin-right: 15px; width: 240px; height: 240px; } .workout-info-block.nearly-lot-users .clients .client .photo { height: 185px; } .workout-info-block.nearly-lot-users .clients .client .photo .img { width: 130px; height: 130px; } .workout-info-block.nearly-lot-users .clients .client .status { height: 55px; } .workout-info-block.nearly-lot-users .clients .client .status h2 { height: 40px; font-size: 24px; margin-top: 15px; } .workout-info-block.nearly-lot-users .clients .client .status-heartrate span { font-size: 32px; } .workout-info-block.nearly-lot-users .clients .client .status.status-name h2 { width: 200px; height: 40px; font-size: 24px; margin-top: 15px; } .workout-info-block.nearly-lot-users .workout-info-tabs .workout-tabs-wrapper { top: 628px; } .workout-info-block.nearly-lot-users .description-container.workout-description { height: 580px; padding-top: 30px; } /* .workout-info-block.lot-users */ .workout-info-block.lot-users .clients { margin-top: 30px; height: 830px; } .workout-info-block.lot-users .clients .client { margin-left: 15px; margin-right: 15px; width: 240px; height: 240px; } .workout-info-block.lot-users .clients .client .photo { height: 185px; } .workout-info-block.lot-users .clients .client .photo .img { width: 130px; height: 130px; } .workout-info-block.lot-users .clients .client .status { height: 55px; } .workout-info-block.lot-users .clients .client .status h2 { height: 40px; font-size: 24px; margin-top: 15px; } .workout-info-block.lot-users .clients .client .status-heartrate span { font-size: 32px; } .workout-info-block.lot-users .clients .client .status.status-name h2 { width: 200px; height: 40px; font-size: 24px; margin-top: 15px; } .workout-info-block.lot-users .workout-info-tabs .workout-tabs-wrapper { top: 878px; } .workout-info-block.lot-users .description-container.workout-description { height: 830px; padding-top: 30px; } /* .content.few-users */ .content.few-users { height: 1410px; } .content.few-users .circuit_interval { bottom: 250px; } /* .content.average-users */ .content.average-users { height: 1060px; } .content.average-users .multiple-screen-pietimer { top: 850px; height: 675px; } .content.average-users .multiple-screen-pietimer .pie2 { left: 245px; width: 570px; height: 570px; top: 18px; } .content.average-users #timer { width: 630px; margin-left: 225px; } .content.average-users .pietimer > .words { top: 100px; left: 150px; font-size: 100px; } .content.average-users .pietimer > .percent { top: 220px; left: -50px; font-size: 220px; } .content.average-users .pietimer > .rounds { top: 430px; left: 100px; font-size: 100px; } .content.average-users .totalRounds.currentRound.circle_rounds { bottom: 255px; height: 65px; } .content.average-users .totalRounds.currentRound.circle_rounds h2 { font-size: 55px; } .content.average-users .circuit_interval { bottom: 185px; } .content.average-users .circuit_interval h2 { font-size: 55px; } .content.average-users .totalRounds.circle_time { bottom: 15px; } .content.average-users .totalRounds.currentTime h3 { font-size: 65px; } .content.average-users .totalRounds.currentTime h2 { font-size: 65px; } /* .content.nearly-lot-users */ .content.nearly-lot-users .multiple-screen-pietimer { top: 630px; } .content.nearly-lot-users .totalRounds.currentRound.circle_rounds { bottom: 305px; height: 65px; } .content.nearly-lot-users .circuit_interval { bottom: 200px; } .content.nearly-lot-users .totalRounds.circle_time { bottom: 20px; } /* .content.lot-users */ .content.lot-users { height: 980px; } .content.lot-users .multiple-screen-pietimer { top: 890px; height: 675px; } .content.lot-users .multiple-screen-pietimer .pie2 { left: 245px; width: 570px; height: 570px; top: 18px; } .content.lot-users #timer { width: 630px; margin-left: 225px; } .content.lot-users .pietimer > .words { top: 100px; left: 150px; font-size: 100px; } .content.lot-users .pietimer > .percent { top: 220px; left: -60px; font-size: 230px; } .content.lot-users .pietimer > .rounds { top: 430px; left: 100px; font-size: 100px; } .content.lot-users .totalRounds.currentRound.circle_rounds { bottom: 255px; height: 65px; } .content.lot-users .totalRounds.currentRound.circle_rounds h2 { font-size: 55px; } .content.lot-users .circuit_interval { bottom: 193px; } .content.lot-users .circuit_interval h2 { font-size: 55px; } .content.lot-users .totalRounds.circle_time { bottom: 15px; } .content.lot-users .totalRounds.currentTime h3 { font-size: 65px; } .content.lot-users .totalRounds.currentTime h2 { font-size: 65px; } /* arrows for exercise info tab */ .exercises-controls { display: none; position: absolute; width: 100%; top: 100px; z-index: 1; } .exercises-controls .prev-zone, .exercises-controls .next-zone { display: flex; width: 250px; justify-content: space-between; position: absolute; z-index: 3; } .exercises-controls .prev-zone { left: 0; text-align: left; } .exercises-controls .next-zone { right: 0; text-align: right; } .exercises-controls .prev-zone .zone-name, .exercises-controls .next-zone .zone-name { font-size: 30px; text-transform: uppercase; display: flex; align-items: center; } /* Music overlay */ #musicOverlay { display: none; } /* Scheduler overlay */ #schedulerOverlay { position: absolute; width: 1080px; z-index: 6; } #schedulerOverlay .overlay-body { height: 100px; background-color: black; display: flex; align-items: center; font-size: 46px; text-transform: uppercase; font-family: 'Gotham bold'; } #schedulerOverlay .overlay-body .overlay-workout-name-wrapper { width: 620px; height: 100%; margin-left: 10px; display: flex; justify-content: center; align-items: center; } #schedulerOverlay .overlay-body .overlay-workout-name-wrapper .overlay-workout-name { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } #schedulerOverlay .overlay-body .overlay-starts-in { width: 465px; height: 100%; display: flex; justify-content: center; align-items: center; } #schedulerOverlay .overlay-body .overlay-starts-in .overlay-message { margin-left: 10px; font-family: 'Gotham Book'; } #schedulerOverlay .overlay-body .overlay-starts-in .overlay-countdown { margin-left: 10px; width: 160px; } /* Single exercises muscle sprites */ #muscleSprites { position: absolute; width: 100%; top: 830px; } .muscle-sprites-wrapper { margin: 0 auto; } .muscle-sprites-wrapper .sprite-wrapper{ display: none; } .muscle-sprites-wrapper .sprite-wrapper.active-sprite { display: block; } .sprite-wrapper.front { width: 900px; margin: 0 auto; } .sprite-wrapper.back { width: 850px; margin: 0 auto; } #muscleSprites .rotate_button { top: 940px; position: absolute; width: 100%; height: 80px; text-align: center; } /* Text only exercises */ .img_block.text-only-exercise .custom_image, .img_block_cardio.text-only-exercise .custom_image { display: none; } .img_block_cardio.text-only-exercise .cardio b, .img_block.text-only-exercise .custom_header b, .img_block.text-only-exercise .cardio b { font-weight: bold; } .img_block_cardio.text-only-exercise .cardio i, .img_block.text-only-exercise .custom_header i, .img_block.text-only-exercise .cardio i { font-style: italic; } .with-tiers .inner_little_block_cardio .img_block_cardio.text-only-exercise .cardio { height: 250px; } .with-exercises .inner_little_block_cardio .img_block_cardio.text-only-exercise .cardio { height: 265px; } .with-tiers .inner_medium_lot_block_cardio .img_block.text-only-exercise .custom_header { height: 315px; } .with-exercises .inner_medium_lot_block_cardio .img_block.text-only-exercise .custom_header { height: 352px; } .with-tiers .inner_medium_lot_block_cardio .with-name .img_block.text-only-exercise .custom_header { height: 357px; } .with-tiers .inner_medium_block_cardio .img_block.text-only-exercise .custom_header { height: 354px; } .with-exercises .inner_medium_block_cardio .img_block.text-only-exercise .custom_header { height: 392px; } .with-tiers .inner_medium_block_cardio .with-controls .img_block.text-only-exercise .custom_header { height: 315px; } .with-tiers .inner_large_block_cardio .img_block.text-only-exercise .custom_header { height: 672px; } .with-exercises .inner_large_block_cardio .img_block.text-only-exercise .custom_header { height: 752px; } .with-tiers .inner_large_block_cardio .with-name .img_block.text-only-exercise .custom_header { height: 752px; } .with-tiers .custom-circuit-round-wrapper .img_block.text-only-exercise .cardio { height: 230px; } .inner_medium_lot_block_cardio .text-only-exercise .exercise-description-text, .inner_medium_block_cardio .text-only-exercise .exercise-description-text, .inner_large_block_cardio .text-only-exercise .exercise-description-text { padding-right: 14px; } .inner_little_block_cardio .text-only-exercise .exercise-description-text { padding-right: 10px; } /* monthly training */ /* group trainings */ .previous-trainings-wrapper { } .dividing-line { margin-top: 15px; width: 1050px; } .previous-trainings-wrapper .previuos-month { font-size: 25px; text-transform: uppercase; height: 50px; display: flex; justify-content: center; align-items: center; } .previous-trainings-wrapper .training-tile { display: flex; justify-content: center; align-items: center; height: 100px; } /* Text only exercise */ .text-only-exercise .tier-image { display: none; } .text-only-exercise .tier-description i { font-style: italic; } .text-only-exercise .tier-description b { font-weight: bold; } .exercises-6 .swiper-slide.text-only-exercise .tier-description, .exercises-5 .swiper-slide.text-only-exercise .tier-description { height: 430px; } /* preparation page */ .mt-workout-exercises-wrapper { display: none; position: absolute; top: 1057px; padding-left: 52px; padding-right: 52px; padding-bottom: 16px; z-index: 1; } .mt-workout-exercises-wrapper .mt-workout-round-text { height: 70px; display: flex; justify-content: center; align-items: center; font-family: 'HelveticaNeue'; font-style: italic; margin-bottom: 60px; font-size: 60px; text-transform: uppercase; letter-spacing: 1px; } .mt-workout-exercises-wrapper .mt-workout-round-text .mt-workout-round-number { padding-left: 15px; } .mt-workout-exercise .exercise-description-text { width: 100%; height: 279px; box-sizing: border-box; } .mt-workout-preparation-wrapper.with-exercises { position: relative; height: 100%; } .mt-workout-preparation-wrapper.with-exercises .inner_medium_lot_block_cardio .img_block { height: 342px; width: 277px; margin-bottom: 33px; float: left; margin-right: 72px; } .mt-workout-preparation-wrapper.with-exercises .inner_medium_lot_block_cardio .img_block:nth-of-type(n + 3) { margin-bottom: 0; } .mt-workout-preparation-wrapper.with-exercises .inner_medium_lot_block_cardio .img_block:nth-of-type(3n) { margin-right: 0px; } .mt-workout-preparation-wrapper.with-exercises .inner_medium_lot_block_cardio .img_block .cardio_footer { height: 63px; background-color: transparent; } .mt-workout-preparation-wrapper.with-exercises .inner_medium_lot_block_cardio .img_block .cardio_footer .cardio_name { padding: 0; font-style: italic; font-family: 'HelveticaNeue'; font-size: 22px; } .mt-workout-preparation-wrapper.with-exercises .inner_medium_lot_block_cardio .img_block .custom_image { width: 100%; height: 279px; } .mt-workout-preparation-wrapper .page-header { position: absolute; justify-content: space-between; height: 130px; z-index: 4; } .mt-workout-preparation-wrapper .page-header .left-control-block, .mt-workout-preparation-wrapper .page-header .right-control-block { display: flex; position: absolute; z-index: 4; height: 100%; align-items: center; } .mt-workout-preparation-wrapper .page-header .right-control-block { right: 0; } .mt-workout-preparation-wrapper .mt-workout-resume { display: none; margin-right: 70px; } .mt-workout-preparation-wrapper .mt-workout-pause { margin-right: 70px; } .mt-workout-preparation-wrapper .preparation-countdown-wrapper { display: flex; align-items: center; font-family: 'HelveticaNeue'; text-transform: uppercase; font-style: italic; font-size: 56px; letter-spacing: 1px; position: absolute; width: 100%; height: 100%; z-index: 3; } .mt-workout-preparation-wrapper .preparation-countdown-wrapper .training-starts-in-text { margin-top: 16px; width: 100%; text-align: center; } .mt-workout-preparation-wrapper .check-in-here-wrapper { position: absolute; width: 100%; bottom: 796px; height: 60px; display: flex; font-family: 'HelveticaNeue'; letter-spacing: 1px; z-index: 2; } .mt-workout-preparation-wrapper .check-in-here-wrapper .check-in-here-arrow { display: flex; align-items: center; width: 70px; height: 60px; } .mt-workout-preparation-wrapper .check-in-here-wrapper .check-in-here-arrow svg { transform: rotate(180deg); width: 50px; height: 45px; padding-top: 10px; padding-right: 10px; animation-name: moving; animation-duration: 1.5s; animation-iteration-count: infinite; } @keyframes moving { 15% { padding-right: 20px; } 60%, 100% { padding-right: 10px; } } .mt-workout-preparation-wrapper .check-in-here-wrapper .check-in-here-text { font-style: italic; font-size: 37px; text-transform: uppercase; display: flex; align-items: center; padding-left: 10px; padding-top: 6px; } .header-progress-bar { position: absolute; width: 100%; height: 100%; z-index: 2; } .header-progress-bar .progress { height: 100%; } .header-progress-bar .progress .progress-bar { height: 100%; opacity: 0.5; } /* animated text on prep page */ .animated-texts-wrapper { position: absolute; width: 100%; z-index: 3; } .animated-texts { width: 100%; height: 1030px; position: relative; } .animated-texts .animated-text { position: absolute; width: 100%; text-align: center; top: 730px; line-height: 100px; font-size: 115px; font-family: 'HelveticaNeue'; display: none; font-style: italic; } .animated-texts .uppercase { text-transform: uppercase; } .animated-texts .checkout-exercises-text { line-height: 105px; font-style: normal; font-size: 66px; top: 848px; letter-spacing: 0px; } .animated-texts .checkout-exercises-text .checkout-text { line-height: 90px; } .animated-texts .checkout-exercises-text .checkout-arrow svg { transform: rotate(90deg); width: 65px; height: 86px; } .animated-texts .round-info-text.round-0 { top: 245px; } .animated-texts .round-info-text.round-1 { top: 465px; } .animated-texts .round-info-text.round-2 { top: 690px; } .animated-texts .round-text-wrapper { font-size: 70px; text-align: start; margin-left: 585px; line-height: 95px; } .animated-texts .round-work-rest-wrapper { font-size: 45px; line-height: 50px; text-align: start; margin-left: 610px; } .animated-texts .rounds-total-text { font-size: 115px; top: 740px; line-height: 100px; } /* active mt workout */ .mt-workout-active-wrapper .page-header, .next-exercise-overlay-header-wrapper .page-header { position: absolute; justify-content: space-between; z-index: 2; } .mt-workout-active-wrapper .page-header .left-side, .next-exercise-overlay-header-wrapper .page-header .left-side { float: none; } .mt-workout-active-wrapper .page-header .right-side, .next-exercise-overlay-header-wrapper .page-header .right-side { float: none; } .mt-workout-active-wrapper .mt-workout-resume, .next-exercise-overlay-header-wrapper .mt-workout-resume { display: none; } .next-exercise-overlay-header-wrapper { position: absolute; width: 100%; z-index: 2; } /* Styles for Circuit MSS workouts */ .home-page-background { width: 100%; height: 100%; } .green-background-gradient { background: linear-gradient(to right, #596563 75%,#4b5755 100%); } .zone-header-wrapper { text-align: center; font-size: 100px; text-transform: uppercase; font-weight: bold; position: absolute; width: 100%; top: 50px; font-family: 'HelveticaNeue'; letter-spacing: 15px; z-index: 1; } .workout_now { width: 100%; height: 100%; } .zones-wrapper { height: 100%; } .zones-overlay { width: 100%; height: 100%; position: absolute; opacity: 0.4; z-index: 2; } .workout_now .swiper-wrapper { perspective: 800px; width: 100%; display: flex; } .swiper-slide { display: flex; flex-direction: column; } .swiper-slide .tier-description { height: 85px; font-size: 29px; font-family: 'Ubuntu light'; padding: 10px 5px; box-sizing: border-box; } .swiper-slide .tier-image { height: 440px; } .swiper-slide .tier-image img { width: 100%; height: 100%; } .swiper-slide .tier-name { height: 70px; font-family: 'Ubuntu regular'; text-transform: uppercase; font-size: 28px; box-sizing: border-box; padding: 10px 5px; } .swiper-slide.regular-tier { width: 390px; margin: auto 0; } .with-one-tier .swiper-slide { position: absolute; top: -175px; left: 197px; width: 685px; height: 885px; } .with-one-tier .swiper-slide .tier-description { height: 110px; padding: 15px 20px; font-size: 40px; } .with-one-tier .swiper-slide .tier-image { height: 655px; } .with-one-tier .swiper-slide .tier-name { height: 110px; padding: 15px 5px; font-size: 36px; } .round-info { position: absolute; bottom: 600px; font-size: 35px; font-family: 'Helvetica Neue Regular'; height: 170px; width: 100%; text-transform: uppercase; letter-spacing: 2px; background-color: rgba(255,255,255,0.1); z-index: 1; } .round-info .round-number { position: absolute; right: 75px; top: 60px; font-family: 'HelveticaNeue'; letter-spacing: 1px; } .round-info .round-current-time { position: absolute; font-size: 70px; font-weight: bold; top: 25px; width: 100%; text-align: center; } .round-info .round-intervals-info { position: absolute; left: 70px; top: 60px; font-family: 'HelveticaNeue'; letter-spacing: 1px; } .round-progress { position: absolute; bottom: 35px; } .round-progress .progress-overlay { position: absolute; width: 940px; height: 25px; left: 70px; border-radius: 11px; z-index: 1; background-color: rgba(0,0,0,0); } .round-progress .progress { position: absolute; width: 940px; height: 25px; left: 70px; border-radius: 11px; /* color to change */ background-color: #9EA8A3; } .round-progress .progress .progress-bar { height: 25px; width: 0px; border-radius: 11px; position: relative; z-index: 1; } .circuit-mss-workout .swiper-container{ top: 175px; } .circuit-mss-workout .round-progress{ bottom: 65px; } .circuit-mss-workout .round-info{ bottom: 0px; } /* changes for 6-items grid */ .swiper-container.exercises-6 .swiper-wrapper, .swiper-container.exercises-5 .swiper-wrapper { flex-wrap: wrap; } .exercises-6 .swiper-slide, .exercises-5 .swiper-slide { margin: 0; margin-left: 120px; margin-bottom: 30px; width: 360px; } .exercises-6 .tier-description, .exercises-5 .tier-description { height: 60px; font-size: 25px; } .exercises-6 .tier-image, .exercises-5 .tier-image { height: 370px; } .exercises-6 .tier-name, .exercises-5 .tier-name { height: 65px; font-size: 20px; } /* Next exercise will start soon page */ .next-exercise-overlay { position: absolute; width: 100%; height: 100%; text-align: center; text-transform: uppercase; font-family: 'HelveticaNeue'; letter-spacing: 15px; overflow: hidden; } .next-exercise-overlay .first-instruction-text, .next-exercise-overlay .second-instruction-text, .next-exercise-overlay .caution-text { position: absolute; width: 100%; } .next-exercise-overlay .first-instruction-text { top: 795px; } .next-exercise-overlay .second-instruction-text { top: 942px; } .next-exercise-overlay .caution-text { font-size: 100px; bottom: 1565px; } .next-exercise-overlay .caution-text p { height: 107px; } .next-exercise-overlay.stay-here-overlay .first-instruction-text, .next-exercise-overlay.stay-here-overlay .second-instruction-text { font-size: 166px; height: 150px; letter-spacing: 20px; } .next-exercise-overlay .first-instruction-text, .next-exercise-overlay .second-instruction-text { font-size: 113px; height: 100px; } .next-exercise-overlay .caution-text { bottom: 1565px; height: 215px; } .next-exercise-overlay .next-exercise-countdown { top: 1565px; font-size: 80px; position: absolute; width: 100%; } .next-exercise-overlay .caution-first-line, .next-exercise-overlay .caution-second-line, .next-exercise-overlay .first-instruction-text, .next-exercise-overlay .second-instruction-text { display: none; }