.twlanding-body .twlanding-product-tour-submenu-wrap { background-color: #eef6ff; width: 100%; position: fixed; left: 0; z-index: 8; } .twlanding-body .twlanding-product-tour-submenu-wrap .twlanding-product-tour-submenu { display: none; text-align: center; list-style: none; margin: 0; padding: 0; } @media (min-width: 736px) { .twlanding-body .twlanding-product-tour-submenu-wrap .twlanding-product-tour-submenu { display: block; } } .twlanding-body .twlanding-product-tour-submenu-wrap .twlanding-product-tour-submenu .twlanding-product-tour-submenu-item { height: 30px; display: inline-block; padding: 0 10px; } .twlanding-body .twlanding-product-tour-submenu-wrap .twlanding-product-tour-submenu .twlanding-product-tour-submenu-item a { text-decoration: none; } .twlanding-body .twlanding-product-tour-submenu-wrap .twlanding-product-tour-submenu .twlanding-product-tour-submenu-item span { color: #3f3f3f; text-decoration: none; height: 30px; line-height: 29px; cursor: pointer; } @media (min-width: 736px) { .twlanding-body .twlanding-product-tour-submenu-wrap .twlanding-product-tour-submenu .twlanding-product-tour-submenu-item span { font-size: 1.25vw; } } @media (min-width: 1024px) { .twlanding-body .twlanding-product-tour-submenu-wrap .twlanding-product-tour-submenu .twlanding-product-tour-submenu-item span { font-size: 14px; } } @media (min-width: 1240px) { .twlanding-body .twlanding-product-tour-submenu-wrap .twlanding-product-tour-submenu .twlanding-product-tour-submenu-item span { font-size: 14px; } } .twlanding-body .twlanding-product-tour-submenu-wrap .twlanding-product-tour-submenu .twlanding-product-tour-submenu-item:hover span { color: #004373; } .twlanding-body .twlanding-product-tour-submenu-wrap .twlanding-product-tour-submenu .twlanding-product-tour-submenu-item.active { background-color: #dcebf9; } .twlanding-body .twlanding-product-tour-submenu-wrap .twlanding-product-tour-submenu .twlanding-product-tour-submenu-item.active span { color: #004373; } .tw-front-font-icon { font-family: 'Trackabi'; font-style: normal; font-size: inherit; color: inherit; text-transform: none; letter-spacing: normal; white-space: nowrap; direction: ltr; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; -moz-osx-font-smoothing: grayscale; font-feature-settings: 'liga'; } :root { --BLANK: white; --tm--color: #000; --tm-success--bg: #7cbf84; --tm-info--bg: #ad4067; --tm-ads--bg: #4579a9; --tm-warning--bg: #ed4922; } .twlanding-header { border-bottom: 2px solid #fff; z-index: 8; } .twlanding-header .tw-button { cursor: pointer; } .twlanding-header .logo-block { -ms-flex-item-align: center; -webkit-box-align: center; -ms-grid-row-align: center; align-self: center; } @media screen and (min-width: 736px) { .twlanding-header.tw-shrinked { border-bottom: 2px solid #e0ebf5; } } .twlanding-top-menu { position: relative; z-index: 9; } .twlanding-top-menu .btn-menu { margin-bottom: 16px; width: 19px; cursor: pointer; margin-right: 3px; } @media screen and (min-width: 736px) { .twlanding-top-menu .btn-menu { display: none; } } .twlanding-top-menu .btn-menu > div { display: block; margin: 4px 0; height: 3px; width: 100%; background-color: #004373; transition: all 0.3s; } .twlanding-top-menu .top-menu { display: block; position: absolute; top: 38px; right: -157px; height: calc(100vh - 45px); padding-top: 5px; width: 157px; text-align: left; clear: both; transition: height 0.5s; } @media screen and (min-width: 736px) { .twlanding-top-menu .top-menu { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: end; justify-content: flex-end; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; position: static; height: 54px; width: auto; padding-top: 0; } } @media screen and (min-width: 737px) { .twlanding-top-menu .top-menu { height: 54px; } } .twlanding-top-menu .top-menu ul { padding: 0; margin: 0; list-style: none; display: block; } @media screen and (min-width: 736px) { .twlanding-top-menu .top-menu ul { display: block; white-space: nowrap; } } .twlanding-top-menu .top-menu ul li { display: block; } @media screen and (min-width: 736px) { .twlanding-top-menu .top-menu ul li { display: inline-block; white-space: nowrap; border-left: 1px solid transparent; } } .twlanding-top-menu .top-menu ul li .btn, .twlanding-top-menu .top-menu ul li a { color: #004373; font-size: 17px; text-decoration: none; padding: 0 28px; display: block; background-color: transparent; transition: height 0.5s, background-color 0.5s, line-height 0.5s, color 0.5s; } @media screen and (min-width: 736px) { .twlanding-top-menu .top-menu ul li .btn, .twlanding-top-menu .top-menu ul li a { position: relative; font-size: 15px; padding: 0 5px; } .twlanding-top-menu .top-menu ul li .btn:hover:before, .twlanding-top-menu .top-menu ul li .btn:focus:before, .twlanding-top-menu .top-menu ul li .btn:active:before, .twlanding-top-menu .top-menu ul li .btn.active:before, .twlanding-top-menu .top-menu ul li a:hover:before, .twlanding-top-menu .top-menu ul li a:focus:before, .twlanding-top-menu .top-menu ul li a:active:before, .twlanding-top-menu .top-menu ul li a.active:before { content: ''; display: block; position: absolute; bottom: -7px; height: 2px; background-color: #004373; width: 50%; left: 50%; margin-left: -25%; } } @media screen and (min-width: 1024px) { .twlanding-top-menu .top-menu ul li .btn, .twlanding-top-menu .top-menu ul li a { font-size: 17px; padding: 0 10px; } } @media screen and (min-width: 1024px) { .twlanding-top-menu .top-menu ul li .btn, .twlanding-top-menu .top-menu ul li a { font-size: 17px; padding: 0 12px; } } .twlanding-top-menu .top-menu ul li .anim-enter { opacity: 0; transform-origin: right top; transition: transform 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, opacity 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .anim-enter .tw-dropdown { opacity: 0; transform: scaleX(0); transform-origin: right top; transition: transform 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, opacity 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .anim-enter .tw-dropdown ul { opacity: 0; transform: scaleY(0); transform-origin: right top; transition: transform 500ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, opacity 500ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .anim-enter.anim-enter-active { opacity: 1; transform-origin: right top; transition: transform 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, opacity 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .anim-enter.anim-enter-active .tw-dropdown { opacity: 1; transform: scaleX(1); transform-origin: right top; transition: transform 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, opacity 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .anim-enter.anim-enter-active .tw-dropdown ul { opacity: 1; transform: scaleY(1); transform-origin: right top; transition: transform 500ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, opacity 500ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .anim-leave { opacity: 1; transform-origin: right top; transition: transform 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, opacity 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .anim-leave .tw-dropdown { opacity: 1; transform: scaleX(1); transform-origin: right top; transition: transform 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, opacity 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .anim-leave .tw-dropdown ul { opacity: 1; transform: scaleY(1); transform-origin: right top; transition: transform 500ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, opacity 500ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .anim-leave .tw-dropdown { opacity: 1; transform: scaleX(1) scaleY(1); transform-origin: right top; transition: transform 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .anim-leave.anim-leave-active { opacity: 0; transform-origin: right top; transition: transform 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, opacity 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .anim-leave.anim-leave-active .tw-dropdown { opacity: 0; transform: scaleX(0); transform-origin: right top; transition: transform 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, opacity 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .anim-leave.anim-leave-active .tw-dropdown ul { opacity: 0; transform: scaleY(0); transform-origin: right top; transition: transform 500ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, opacity 500ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .tw-dropdown { position: absolute; right: 0; top: 42px; border-radius: 7px; width: 200px; max-width: 200px; background-color: #fff; overflow-y: auto; z-index: 2; box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.2); -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .twlanding-top-menu .top-menu ul li .tw-dropdown li { display: block; position: relative; border-left: none; border-right: none; margin-top: 8px; margin-bottom: 8px; } .twlanding-top-menu .top-menu ul li .tw-dropdown li:last-child { border-bottom: none; margin-bottom: 0; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; margin: 0; border-radius: 0; border: none; padding: 3px 11px 3px 11px; box-sizing: border-box; height: auto; width: 100%; min-height: 48px; background: #fff; transition: background-color 0.3s; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a.tw-reg-org { -ms-flex-pack: center; justify-content: center; min-height: 43px; font-size: 15px; line-height: 43px; color: #004373; background: #eff4f9; transition: color 0.3s, background-color 0.3s; padding: 0; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a.tw-reg-org:before { display: none; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a.tw-reg-org:hover, .twlanding-top-menu .top-menu ul li .tw-dropdown li a.tw-reg-org:focus, .twlanding-top-menu .top-menu ul li .tw-dropdown li a.tw-reg-org:active { background-color: #e3ebf3; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a:hover, .twlanding-top-menu .top-menu ul li .tw-dropdown li a:focus, .twlanding-top-menu .top-menu ul li .tw-dropdown li a:active { background-color: #e0ebf5; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a .tw-avatar { -ms-flex-negative: 0; flex-shrink: 0; margin-right: 10px; border: 1px solid #fff; width: 40px; height: 40px; display: -ms-flexbox; display: flex; position: relative; top: 1px; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a .tw-avatar div { background: #e0ebf5 !important; width: 40px; height: 40px; display: -ms-flexbox; display: flex; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a .tw-avatar img { border-radius: 50%; width: 36px; height: 36px; vertical-align: middle; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a .tw-avatar .tw-avatar-no-img { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 0; flex-shrink: 0; border-radius: 50%; height: 36px; width: 36px; font-size: 36px; font-family: "LatoRegular", sans-serif; text-align: center; background: #eef2f5; color: #7a7f82; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a .tw-avatar .tw-avatar-no-img .tw-text { line-height: 36px; font-size: 50%; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a .tw-org-name { -ms-flex-item-align: center; -webkit-box-align: center; -ms-grid-row-align: center; align-self: center; font-family: "LatoRegular", sans-serif; font-size: 14px; line-height: 1.1; text-align: left; word-wrap: break-word; white-space: normal; color: #004373; overflow: hidden; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu { width: 160px; padding-top: 10px; padding-bottom: 10px; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; height: 30px; font-family: "LatoRegular", sans-serif; font-size: 16px; color: #004373; background-color: #fff; cursor: pointer; transition: background-color 0.3s; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li:first-child { margin-top: 0; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li.tw-sign-out { padding-left: 20px; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li.tw-sign-out .tw-material-icons { font-size: 17px; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li:hover, .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li:focus, .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li:active { background-color: #e0ebf5; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li .tw-material-icons { -ms-flex-negative: 0; flex-shrink: 0; margin-right: 10px; font-size: 17px; /* Support for all WebKit browsers. */ -webkit-font-smoothing: antialiased; /* Support for Safari and Chrome. */ text-rendering: optimizeLegibility; /* Support for IE. */ font-feature-settings: 'liga'; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li span { line-height: 1.2; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li a { margin: 0; border: none; padding: 0 0 0 20px; min-height: auto; font-size: 16px; color: #004373; background-color: transparent; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li a .tw-material-icons { line-height: 22px; /* Support for all WebKit browsers. */ -webkit-font-smoothing: antialiased; /* Support for Safari and Chrome. */ text-rendering: optimizeLegibility; /* Support for IE. */ font-feature-settings: 'liga'; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li a:before { display: none; } @media (min-width: 736px) and (max-width: 1025px) { .twlanding-top-menu .top-menu ul li .tw-dropdown { top: 42px !important; } } .twlanding-top-menu .top-menu .menu-signin { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; transition: margin 0.5s; } @media screen and (min-width: 736px) { .twlanding-top-menu .top-menu .menu-signin { margin-left: 5px; vertical-align: text-bottom; } } @media screen and (min-width: 1024px) { .twlanding-top-menu .top-menu .menu-signin { vertical-align: text-bottom; } } @media screen and (min-width: 1240px) { .twlanding-top-menu .top-menu .menu-signin { margin-left: 60px; } } .twlanding-top-menu .top-menu .menu-signin > li:first-child a { margin-left: 0; } .twlanding-top-menu .top-menu .menu-signin li { position: relative; } @media screen and (min-width: 736px) { .twlanding-top-menu .top-menu .menu-signin li { vertical-align: top; } } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu { margin-left: 15px; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-flex { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: end; align-items: flex-end; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-header--account-name { width: 40px; height: 40px; cursor: pointer; margin-right: 0px; position: relative; transition: all 0.5s; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-header--account-name .tw-avatar { border-radius: 50%; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-header--account-name .tw-avatar > div { box-sizing: content-box; transition: all 0.5s; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-header--account-name .tw-avatar > div img { height: auto !important; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-material-icons.tw-desktop { position: relative; top: 1px; transition: all 0.5s; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-img-wrap { border-radius: 50%; overflow: hidden; box-sizing: border-box; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu img { max-width: 100%; min-height: 100%; min-width: 100%; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-avatar-no-img { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 0; flex-shrink: 0; border-radius: 50%; height: 36px; width: 36px; font-family: "LatoRegular", sans-serif; font-size: 36px; line-height: 36px; text-align: center; color: #eef6ff; background-color: #bcd6e8; cursor: pointer; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-avatar-no-img .tw-text { line-height: 36px; font-size: 50%; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-accordion-btn.tw-desktop { position: absolute; display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; width: 11px; height: 11px; border: 1px solid #e3e4e8; background: white; border-radius: 50%; bottom: 0; right: 0; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-accordion-btn.tw-desktop .tw-material-icons { color: #8b8d98; font-size: 7px; width: 100%; height: 100%; line-height: 7px; display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-accordion-btn.tw-desktop.open .tw-material-icons { transform: rotate(-180deg); } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-material-icons { color: #004373; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; transition: transform 0.3s; /* Support for all WebKit browsers. */ -webkit-font-smoothing: antialiased; /* Support for Safari and Chrome. */ text-rendering: optimizeLegibility; /* Support for IE. */ font-feature-settings: 'liga'; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-material-icons.tw-desktop { margin-left: -10px; font-size: 12px; width: 14px; height: 14px; display: block; text-align: center; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-material-icons.tw-mobile { font-size: 16px; transition: color 0.3s; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-material-icons.tw-mobile:hover, .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-material-icons.tw-mobile:focus, .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-material-icons.tw-mobile:active { color: #fff; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-material-icons.open { transform: rotate(180deg); } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-mobile { display: none; } @media (min-width: 736px) { .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile { display: none; } } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul { margin: 0; padding-left: 3px; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li > span, .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li a > span { text-decoration: none; padding: 0; display: block; font-size: 16px; line-height: 35px; height: 35px; border-bottom: 1px solid #c4d9ed; color: #004373; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li.tw-sign-out > span, .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li.tw-sign-out a span { border-bottom: 0; padding-left: 2px; } .twlanding-top-menu .top-menu .menu-signin a, .twlanding-top-menu .top-menu .menu-signin .btn { margin-left: 25px; border: 1px solid #004373; border-radius: 8px; padding: 4px 10px 6px 10px; height: auto; line-height: normal; text-align: center; color: #004373; font-family: "LatoBold"; } @media screen and (min-width: 736px) { .twlanding-top-menu .top-menu .menu-signin a, .twlanding-top-menu .top-menu .menu-signin .btn { width: auto; margin-left: 4px; } } @media screen and (min-width: 1024px) { .twlanding-top-menu .top-menu .menu-signin a, .twlanding-top-menu .top-menu .menu-signin .btn { width: auto; margin-left: 15px; } } .twlanding-top-menu .top-menu .menu-signin a:hover, .twlanding-top-menu .top-menu .menu-signin a:focus, .twlanding-top-menu .top-menu .menu-signin a:active, .twlanding-top-menu .top-menu .menu-signin .btn:hover, .twlanding-top-menu .top-menu .menu-signin .btn:focus, .twlanding-top-menu .top-menu .menu-signin .btn:active { color: #004373; background-color: #fff; } .twlanding-top-menu .top-menu .menu-signin a:before, .twlanding-top-menu .top-menu .menu-signin .btn:before { display: none !important; } .twlanding-top-menu .top-menu .menu-signin .btn, .twlanding-top-menu .top-menu .menu-signin .tw-sign-up { margin-top: 3px; } .twlanding-top-menu .top-menu .menu-signin a { font-family: "LatoRegular"; } .twlanding-top-menu .top-menu .menu-signin a { border-color: transparent; } .twlanding-top-menu .top-menu .menu-signin a:hover, .twlanding-top-menu .top-menu .menu-signin a:focus, .twlanding-top-menu .top-menu .menu-signin a:active { border-color: #004373; } @media (min-width: 736px) { .twlanding-header.tw-shrinked .top-menu { height: 46px; } } @media screen and (min-width: 736px) and (min-width: 737px) and (max-width: 767px) { .twlanding-header.tw-shrinked .top-menu { padding-top: 0px; } } @media (min-width: 736px) { .twlanding-header.tw-shrinked .top-menu ul.menu-signin > li > a { height: 30px; line-height: 30px; } .twlanding-header.tw-shrinked .top-menu ul li a.tw-sign-up { height: auto; line-height: normal; } .twlanding-header.tw-shrinked .top-menu ul li.tw-account-menu .tw-header--account-name { width: 34px; height: 34px; } .twlanding-header.tw-shrinked .top-menu ul li.tw-account-menu .tw-header--account-name .tw-avatar { height: 100% !important; min-height: 100% !important; width: 100% !important; min-width: 100% !important; } .twlanding-header.tw-shrinked .top-menu ul li.tw-account-menu .tw-header--account-name .tw-avatar img { width: 100% !important; height: auto !important; } } .macos-top-bg { position: fixed; width: 100%; height: 500px; top: -250px; left: 0; z-index: 1; } .macos-bottom-bg { position: fixed; width: 100%; height: 500px; bottom: -250px; left: 0; z-index: 1; } .twlanding-header.twlanding-header--home + .macos-top-bg, .twlanding-header.twlanding-header--home + .macos-top-bg + .macos-bottom-bg { background: #eef6ff; } @media screen and (min-width: 736px) { .twlanding-header.twlanding-header--home { border-bottom: 2px solid #eef6ff; } } @media screen and (min-width: 736px) { .twlanding-header.twlanding-header--home.tw-shrinked { border-bottom: 2px solid #e0ebf5; } } .twlanding-header--page + .macos-top-bg { background: #eef6ff; } .twlanding-header--page + .macos-top-bg + .macos-bottom-bg { background: #eff4f9; } .noscroll { overflow: hidden; width: 100%; height: 100vh; position: relative; } .tw-dropdown-cover { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; } @media screen and (max-width: 735px) { .tw-dropdown-cover { background-color: rgba(126, 134, 142, 0.6); } } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-header--account-name .tw-avatar > div span.tw-name { top: 1px !important; transition: all 0.3s; } .tw-shrinked .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-header--account-name .tw-avatar > div span.tw-name { top: -3px !important; transition: all 0.3s; } @media screen and (max-width: 735px) { .twlanding-top-menu { position: relative; z-index: 9; width: 50px; height: 50px; display: -ms-flexbox; display: flex; margin-top: -2px; top: -2px; } .twlanding-top-menu .btn-menu { cursor: pointer; margin: 0px; border: 15px solid transparent; box-sizing: border-box; width: 50px; height: 50px; position: relative; right: -14px; } .twlanding-top-menu .btn-menu > div { display: block; margin: 4px 0; height: 3px; width: 20px; background-color: #004373; transition: all 0.3s; } .twlanding-top-menu .top-menu { display: block; position: absolute; top: 38px; right: -157px; height: calc(100vh - 45px); padding-top: 5px; width: 157px; text-align: left; clear: both; transition: height 0.5s; } .twlanding-top-menu .top-menu ul { padding: 0; margin: 0; list-style: none; display: block; width: 80%; min-width: 170px; margin-left: 30px; } .twlanding-top-menu .top-menu ul li { display: block; width: 100%; border-bottom: 1px solid #c4d9ed; padding-top: 2px; padding-bottom: 2px; } .twlanding-top-menu .top-menu ul li:last-of-type { border-bottom: none; } .twlanding-top-menu .top-menu ul li.tw-reg-org { margin-bottom: 14px; } .twlanding-top-menu .top-menu ul li.tw-reg-org a { height: auto; line-height: 1.3; } .twlanding-top-menu .top-menu ul li .btn, .twlanding-top-menu .top-menu ul li a { color: #004373; background-color: transparent; transition: height 0.5s, background-color 0.5s, line-height 0.5s, color 0.5s; text-decoration: none; padding: 0; display: block; width: calc(100% + 4px); font-size: 16px; line-height: 35px; height: 35px; padding-left: 4px; margin-left: -4px; } .twlanding-top-menu .top-menu ul li .btn:hover, .twlanding-top-menu .top-menu ul li .btn:focus, .twlanding-top-menu .top-menu ul li .btn:active, .twlanding-top-menu .top-menu ul li a:hover, .twlanding-top-menu .top-menu ul li a:focus, .twlanding-top-menu .top-menu ul li a:active { background-color: #c4d9ed; } .twlanding-top-menu .top-menu ul li:last-of-type a { border-bottom: 0; } .twlanding-top-menu .top-menu ul li .anim-enter { opacity: 0; transform-origin: right top; transition: transform 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, opacity 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .anim-enter .tw-dropdown { opacity: 0; transform: scaleX(0); transform-origin: right top; transition: transform 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, opacity 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .anim-enter .tw-dropdown ul { opacity: 0; transform: scaleY(0); transform-origin: right top; transition: transform 500ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, opacity 500ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .anim-enter.anim-enter-active { opacity: 1; transform-origin: right top; transition: transform 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, opacity 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .anim-enter.anim-enter-active .tw-dropdown { opacity: 1; transform: scaleX(1); transform-origin: right top; transition: transform 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, opacity 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .anim-enter.anim-enter-active .tw-dropdown ul { opacity: 1; transform: scaleY(1); transform-origin: right top; transition: transform 500ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, opacity 500ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .anim-leave { opacity: 1; transform-origin: right top; transition: transform 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, opacity 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .anim-leave .tw-dropdown { opacity: 1; transform: scaleX(1); transform-origin: right top; transition: transform 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, opacity 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .anim-leave .tw-dropdown ul { opacity: 1; transform: scaleY(1); transform-origin: right top; transition: transform 500ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, opacity 500ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .anim-leave .tw-dropdown { opacity: 1; transform: scaleX(1) scaleY(1); transform-origin: right top; transition: transform 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .anim-leave.anim-leave-active { opacity: 0; transform-origin: right top; transition: transform 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, opacity 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .anim-leave.anim-leave-active .tw-dropdown { opacity: 0; transform: scaleX(0); transform-origin: right top; transition: transform 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, opacity 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .anim-leave.anim-leave-active .tw-dropdown ul { opacity: 0; transform: scaleY(0); transform-origin: right top; transition: transform 500ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, opacity 500ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; } .twlanding-top-menu .top-menu ul li .tw-dropdown { right: 0; border-radius: 7px; background-color: #fff; overflow-y: auto; z-index: 2; box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.2); -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; position: fixed; left: 50%; margin-left: -100px; max-width: 200px; width: 250px; } .twlanding-top-menu .top-menu ul li .tw-dropdown li { display: block; position: relative; border-left: none; border-right: none; } .twlanding-top-menu .top-menu ul li .tw-dropdown li:last-child { border-bottom: none; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; margin: 0; border-radius: 0; border: none; padding: 11px 11px 8px; height: auto; width: 100%; min-height: 57px; background: #fff; transition: background-color 0.3s; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a.tw-reg-org { -ms-flex-pack: center; justify-content: center; min-height: 43px; font-size: 15px; line-height: 1.2; color: #004373; background: #eff4f9; transition: color 0.3s, background-color 0.3s; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a.tw-reg-org:before { display: none; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a.tw-reg-org:hover, .twlanding-top-menu .top-menu ul li .tw-dropdown li a.tw-reg-org:focus, .twlanding-top-menu .top-menu ul li .tw-dropdown li a.tw-reg-org:active { background-color: #e3ebf3; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a:hover, .twlanding-top-menu .top-menu ul li .tw-dropdown li a:focus, .twlanding-top-menu .top-menu ul li .tw-dropdown li a:active { background-color: #e0ebf5; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a .tw-avatar { -ms-flex-negative: 0; flex-shrink: 0; margin-right: 10px; border: 1px solid #fff; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a .tw-avatar div { background: #e0ebf5 !important; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a .tw-avatar img { border-radius: 50%; width: 36px; height: 36px; vertical-align: middle; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a .tw-avatar .tw-avatar-no-img { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 0; flex-shrink: 0; border-radius: 50%; height: 36px; width: 36px; font-size: 36px; font-family: "LatoRegular", sans-serif; text-align: center; background: #eef2f5; color: #7a7f82; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a .tw-avatar .tw-avatar-no-img .tw-text { line-height: 36px; font-size: 50%; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a .tw-org-name { -ms-flex-item-align: center; -webkit-box-align: center; -ms-grid-row-align: center; align-self: center; font-family: "LatoRegular", sans-serif; font-size: 14px; line-height: 1.1; text-align: left; word-wrap: break-word; white-space: normal; color: #004373; overflow: hidden; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu { width: 160px; padding-top: 10px; padding-bottom: 10px; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; height: 30px; font-family: "LatoRegular", sans-serif; font-size: 16px; color: #004373; background-color: #fff; cursor: pointer; transition: background-color 0.3s; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li.tw-sign-out { padding-left: 20px; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li.tw-sign-out .tw-material-icons { font-size: 17px; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li:hover, .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li:focus, .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li:active { background-color: #e0ebf5; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li .tw-material-icons { -ms-flex-negative: 0; flex-shrink: 0; margin-right: 10px; font-size: 17px; /* Support for all WebKit browsers. */ -webkit-font-smoothing: antialiased; /* Support for Safari and Chrome. */ text-rendering: optimizeLegibility; /* Support for IE. */ font-feature-settings: 'liga'; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li span { margin-top: -1px; line-height: 1.2; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li a { margin: 0; border: none; padding: 0; padding-left: 20px; min-height: auto; font-size: 16px; color: #004373; background-color: transparent; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li a .tw-material-icons { line-height: 22px; /* Support for all WebKit browsers. */ -webkit-font-smoothing: antialiased; /* Support for Safari and Chrome. */ text-rendering: optimizeLegibility; /* Support for IE. */ font-feature-settings: 'liga'; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li a:before { display: none; } .twlanding-top-menu .top-menu .menu-signin { transition: margin 0.5s; margin-top: 16px; margin-left: 11px; display: block; } .twlanding-top-menu .top-menu .menu-signin > li { margin-left: 17px; margin-right: 17px; border-bottom: none; } .twlanding-top-menu .top-menu .menu-signin > li:first-child a { margin-left: 0; } .twlanding-top-menu .top-menu .menu-signin li { position: relative; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu { margin-left: 15px; -ms-flex-pack: start !important; justify-content: flex-start !important; margin-top: 26px !important; display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-flex { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: end; align-items: flex-end; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-avatar { -ms-flex-negative: 0; flex-shrink: 0; display: block; margin-right: 5px; border-radius: 50%; overflow: hidden; cursor: pointer; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu img { max-width: 100%; min-height: 100%; min-width: 100%; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-avatar-no-img { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 0; flex-shrink: 0; border-radius: 50%; height: 36px; width: 36px; font-family: "LatoRegular", sans-serif; font-size: 36px; line-height: 36px; text-align: center; color: #e0ebf5; background-color: #bcd6e8; cursor: pointer; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-avatar-no-img .tw-text { line-height: 36px; font-size: 50%; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-material-icons { color: #004373; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; transition: transform 0.3s; /* Support for all WebKit browsers. */ -webkit-font-smoothing: antialiased; /* Support for Safari and Chrome. */ text-rendering: optimizeLegibility; /* Support for IE. */ font-feature-settings: 'liga'; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-material-icons.tw-desktop { margin-left: -4px; font-size: 12px; width: 14px; height: 14px; display: block; text-align: center; padding: 1px 2px 3px 2px; transform: rotate(180deg); } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-material-icons.tw-mobile { font-size: 16px; transition: color 0.3s; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-material-icons.tw-mobile:hover, .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-material-icons.tw-mobile:focus, .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-material-icons.tw-mobile:active { color: #fff; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-material-icons.open { transform: rotate(360deg); } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-mobile { display: none; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-flex { margin-right: 15px; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-desktop { display: none; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-mobile { display: inline-block; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--desktop { display: none; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul { margin: 0; padding-left: 3px; width: 100%; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li { padding-top: 3px; padding-bottom: 2px; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li:first-of-type { padding-bottom: 11px; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li a { border: none; border-radius: 0; text-align: left; padding-left: 4px; margin-left: -4px; width: calc(100% + 4px); } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li a:hover, .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li a:focus, .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li a:active { background-color: #c4d9ed; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li > span, .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li a > span { text-decoration: none; padding: 0; display: block; width: 100%; font-size: 16px; line-height: 35px; height: 35px; color: #004373; border: none; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li.tw-sign-out > span, .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li.tw-sign-out a span { border-bottom: 0; cursor: pointer; display: block; padding-left: 4px; margin-left: -4px; width: calc(100% + 4px); } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li.tw-sign-out > span:hover, .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li.tw-sign-out > span:focus, .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li.tw-sign-out > span:active, .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li.tw-sign-out a span:hover, .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li.tw-sign-out a span:focus, .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li.tw-sign-out a span:active { background-color: #c4d9ed; } .twlanding-top-menu .top-menu .menu-signin a, .twlanding-top-menu .top-menu .menu-signin .btn { border: 1px solid #004373; border-radius: 5px; padding: 0; line-height: 28px; text-align: center; color: #004373; font-family: "LatoBold"; margin-left: 0; height: auto; min-height: 32px; width: auto; min-width: 86px; display: inline-block; vertical-align: text-bottom; margin-top: -1px; } .twlanding-top-menu .top-menu .menu-signin a:before, .twlanding-top-menu .top-menu .menu-signin .btn:before { display: none !important; } .twlanding-top-menu .top-menu .menu-signin a { font-family: "LatoRegular"; } .twlanding-top-menu .top-menu .menu-signin a { border-color: transparent; } .twlanding-top-menu .top-menu .menu-signin a:hover, .twlanding-top-menu .top-menu .menu-signin a:focus, .twlanding-top-menu .top-menu .menu-signin a:active { border-color: #004373; } .twlanding-top-menu .top-menu .menu-signin .btn:hover, .twlanding-top-menu .top-menu .menu-signin .btn:focus, .twlanding-top-menu .top-menu .menu-signin .btn:active { background-color: #c4d9ed; } .twlanding-top-menu .top-menu .tw-organizations-menu ul { display: block; white-space: nowrap; margin: 0; padding: 0; border: 0; width: 100%; } .twlanding-top-menu .top-menu .tw-organizations-menu ul li, .twlanding-top-menu .top-menu .tw-organizations-menu ul li:first-child { margin: 0; border: 0; } .twlanding-top-menu .top-menu .tw-organizations-menu ul li a, .twlanding-top-menu .top-menu .tw-organizations-menu ul li:first-child a { padding: 3px 11px 3px 11px; box-sizing: border-box; height: auto; width: 100%; min-height: 48px; margin: 0 !important; } .twlanding-top-menu .top-menu .tw-organizations-menu ul li:first-child { margin-top: 8px; } .twlanding-top-menu .top-menu .tw-organizations-menu ul li:last-child { margin: 0; padding: 0; } .twlanding-top-menu .top-menu .tw-organizations-menu ul li:last-child a.tw-reg-org { min-height: 43px; line-height: 43px; } .twlanding-header--home .wrap { background-color: #eef6ff; transition: all 0.5s; } .wrap.menu-opened { background-color: #e0ebf5; } .wrap.menu-opened .twlanding-top-menu .btn-menu > div { display: none; } .wrap.menu-opened .twlanding-top-menu .btn-menu > div:first-of-type { display: block; transform: rotate(45deg); position: relative; width: 22px; top: 7px; } .wrap.menu-opened .twlanding-top-menu .btn-menu > div:last-of-type { display: block; transform: rotate(-45deg); position: relative; width: 22px; } } @media screen and (max-width: 320px) { .mobile-account-menu-block .tw-avatar { border-radius: 0; } .mobile-account-menu-block .tw-avatar div { border: 2px solid #ccdeed !important; background: #fff !important; } } @media screen and (min-width: 321px) and (max-width: 735px) { .twlanding-top-menu .top-menu { top: 38px; right: -157px; height: calc(100vh - 45px); padding-top: 5px; width: 157px; } .twlanding-top-menu .top-menu ul { min-width: 53.125vw; margin-left: 9.375vw; } .twlanding-top-menu .top-menu ul li { border-bottom: 1px solid #c4d9ed; padding-top: 0.625vw; padding-bottom: 0.625vw; } .twlanding-top-menu .top-menu ul li.tw-reg-org { margin-bottom: 4.375vw; } .twlanding-top-menu .top-menu ul li .btn, .twlanding-top-menu .top-menu ul li a { width: calc(100% + 1.25vw); font-size: 5vw; line-height: 10.9375vw; height: 10.9375vw; padding-left: 1.25vw; margin-left: -1.25vw; } .twlanding-top-menu .top-menu ul li .tw-dropdown { right: 0; border-radius: 2.1875vw; box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.2); left: 50%; margin-left: -31.25vw; max-width: 62.5vw; width: 78.125vw; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; margin: 0; border-radius: 0; padding: 3.4375vw 3.4375vw 2.5vw; min-height: 57px; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a.tw-reg-org { -ms-flex-pack: center; justify-content: center; min-height: 13.4375vw; font-size: 4.6875vw; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a .tw-avatar { -ms-flex-negative: 0; flex-shrink: 0; margin-right: 3.125vw; border: 1px solid #fff; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a .tw-avatar img { width: 11.25vw; height: 11.25vw; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a .tw-avatar .tw-avatar-no-img { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 0; flex-shrink: 0; border-radius: 50%; height: 11.25vw; width: 11.25vw; font-size: 11.25vw; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a .tw-avatar .tw-avatar-no-img .tw-text { line-height: 11.25vw; } .twlanding-top-menu .top-menu ul li .tw-dropdown li a .tw-org-name { -ms-flex-item-align: center; -webkit-box-align: center; -ms-grid-row-align: center; align-self: center; font-size: 4.375vw; line-height: 1.1; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu { width: 50vw; padding-top: 3.125vw; padding-bottom: 3.125vw; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; height: 9.375vw; font-size: 5vw; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li.tw-sign-out { padding-left: 6.25vw; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li.tw-sign-out .tw-material-icons { font-size: 5.3125vw; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li .tw-material-icons { -ms-flex-negative: 0; flex-shrink: 0; margin-right: 3.125vw; font-size: 5.3125vw; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li span { margin-top: -1px; line-height: 1.2; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li a { margin: 0; padding: 0; padding-left: 6.25vw; font-size: 5vw; } .twlanding-top-menu .top-menu ul li .tw-dropdown.tw-account-menu li a .tw-material-icons { line-height: 6.875vw; } .twlanding-top-menu .top-menu .menu-signin { margin-top: 5vw; margin-left: 3.4375vw; } .twlanding-top-menu .top-menu .menu-signin > li { margin-left: 5.3125vw; margin-right: 5.3125vw; } .twlanding-top-menu .top-menu .menu-signin > li:first-child a { margin-left: 0; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu { margin-left: 4.6875vw; margin-top: 8.125vw !important; display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-avatar { -ms-flex-negative: 0; flex-shrink: 0; margin-right: 1.5625vw; border-radius: 50%; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu img { max-width: 100%; min-height: 100%; min-width: 100%; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-avatar-no-img { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 0; flex-shrink: 0; border-radius: 50%; height: 11.25vw; width: 11.25vw; font-size: 11.25vw; line-height: 11.25vw; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-avatar-no-img .tw-text { line-height: 11.25vw; font-size: 50%; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-material-icons.tw-desktop { margin-left: -1.25vw; font-size: 3.75vw; width: 4.375vw; height: 4.375vw; padding: 0.3125vw 0.625vw 0.9375vw 0.625vw; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-material-icons.tw-mobile { font-size: 5vw; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu .tw-flex { margin-right: 4.6875vw; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul { margin: 0; padding-left: 3px; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li { padding-top: 3px; padding-bottom: 2px; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li:first-of-type { padding-bottom: 11px; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li a { padding-left: 1.25vw; margin-left: -1.25vw; width: calc(100% + 1.25vw); } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li > span, .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li a > span { padding: 0; font-size: 5vw; line-height: 10.9375vw; height: 10.9375vw; } .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li.tw-sign-out > span, .twlanding-top-menu .top-menu .menu-signin li.tw-account-menu.tw-account-menu--mobile ul li.tw-sign-out a span { border-bottom: 0; padding-left: 1.25vw; margin-left: -1.25vw; width: calc(100% + 1.25vw); } .twlanding-top-menu .top-menu .menu-signin a, .twlanding-top-menu .top-menu .menu-signin .btn { border: 1px solid #004373; border-radius: 1.5625vw; padding: 0; line-height: 8.75vw; min-height: 10vw; min-width: 26.875vw; margin-top: -1px; } .twlanding-top-menu .top-menu .tw-organizations-menu ul { display: block; white-space: nowrap; margin: 0; padding: 0; border: 0; width: 100%; } .twlanding-top-menu .top-menu .tw-organizations-menu ul li, .twlanding-top-menu .top-menu .tw-organizations-menu ul li:first-child { margin: 0; border: 0; } .twlanding-top-menu .top-menu .tw-organizations-menu ul li a, .twlanding-top-menu .top-menu .tw-organizations-menu ul li:first-child a { padding: 0.9375vw 3.4375vw 0.9375vw 3.4375vw; box-sizing: border-box; height: auto; width: 100%; min-height: 15vw; margin: 0 !important; } .twlanding-top-menu .top-menu .tw-organizations-menu ul li:first-child { margin-top: 2.5vw; } .twlanding-top-menu .top-menu .tw-organizations-menu ul li:last-child { margin: 0; padding: 0; } .twlanding-top-menu .top-menu .tw-organizations-menu ul li:last-child a.tw-reg-org { min-height: 13.4375vw; line-height: 13.4375vw; } .mobile-account-menu-block .tw-avatar { font-size: 11.875vw !important; line-height: 11.875vw !important; min-height: 11.875vw !important; min-width: 11.875vw !important; height: 11.875vw !important; width: 11.875vw !important; margin-right: 0 !important; } .mobile-account-menu-block .tw-avatar div { height: 11.875vw !important; width: 11.875vw !important; min-height: 11.875vw !important; min-width: 11.875vw !important; display: block !important; border: 2px solid #ccdeed !important; background: #fff !important; } .mobile-account-menu-block .tw-avatar div span.tw-name { top: -1px; } .mobile-account-menu-block .tw-avatar div img { background-color: #fff !important; } } @media screen and (max-width: 735px) { .twlanding-top-menu .top-menu { display: block; position: absolute; text-align: left; clear: both; top: 48px; right: -16px; height: 0; background-color: #e0ebf5; width: 100vw; padding-left: 30px; padding-top: 0; overflow: hidden; transition: all 0.5s ease-out; } .twlanding-top-menu .top-menu ul li { opacity: 0; transform: translateY(-36px); transition: opacity 0.26098s cubic-bezier(0.52, 0.16, 0.52, 0.84) 0.11s, transform 0.43756s cubic-bezier(0.52, 0.16, 0.52, 0.84) 0.082s; } .twlanding-top-menu .top-menu.opened { height: 100vh; padding-top: 27px; } .twlanding-top-menu .top-menu.opened ul li { opacity: 1; pointer-events: auto; transform: none; transition: opacity 0.33467s cubic-bezier(0.32, 0.08, 0.24, 1) 0.07s, transform 0.37539s cubic-bezier(0.32, 0.08, 0.24, 1) 0.06s; } } footer.twlanding-footer .top-mobile-row { overflow: hidden; padding-top: 24px; margin-bottom: 5px; } @media (max-width: 320px) { footer.twlanding-footer .top-mobile-row { padding-top: 11px; margin-bottom: -9px; } } @media (min-width: 321px) and (max-width: 735px) { footer.twlanding-footer .top-mobile-row { padding-top: 3.4375vw; margin-bottom: -2.8125vw; } } @media screen and (min-width: 736px) { footer.twlanding-footer .top-mobile-row { margin-bottom: 26px; } } @media screen and (min-width: 1024px) { footer.twlanding-footer .top-mobile-row { height: 50px; margin-bottom: 26px; } } footer.twlanding-footer .top-mobile-row .logo { width: 50%; float: left; } @media (max-width: 320px) { footer.twlanding-footer .top-mobile-row .logo { margin-top: 6px; } } @media (min-width: 321px) and (max-width: 735px) { footer.twlanding-footer .top-mobile-row .logo { margin-top: 1.875vw; } } @media screen and (min-width: 736px) { footer.twlanding-footer .top-mobile-row .logo { width: 100%; float: none; margin-top: 0; } } @media screen and (min-width: 1024px) { footer.twlanding-footer .top-mobile-row .logo { width: 100%; float: none; margin-top: 0; } } footer.twlanding-footer .top-mobile-row .logo img { max-width: 100%; width: 70px; height: 16px; } @media (max-width: 320px) { footer.twlanding-footer .top-mobile-row .logo img { width: 90px; height: 19px; } } @media (min-width: 321px) and (max-width: 735px) { footer.twlanding-footer .top-mobile-row .logo img { width: 28.125vw; height: 5.9375vw; } } @media screen and (min-width: 736px) { footer.twlanding-footer .top-mobile-row .logo img { width: 125px; height: 28px; } } @media screen and (min-width: 1024px) { footer.twlanding-footer .top-mobile-row .logo img { width: 125px; height: 28px; } } footer.twlanding-footer .address-row { -ms-flex-positive: 1; flex-grow: 1; margin-bottom: 20px; width: 100%; max-width: 50%; } @media (max-width: 320px) { footer.twlanding-footer .address-row { margin-bottom: 15px; } } @media (min-width: 321px) and (max-width: 735px) { footer.twlanding-footer .address-row { margin-bottom: 4.6875vw; } } @media screen and (min-width: 736px) { footer.twlanding-footer .address-row { margin-bottom: 0; max-width: 187px; padding-right: 10px; } } @media screen and (min-width: 1024px) { footer.twlanding-footer .address-row { max-width: 280px; } } @media screen and (min-width: 1240px) { footer.twlanding-footer .address-row { max-width: 314px; } } footer.twlanding-footer .address-row p { margin: 0; color: #004373; font-size: 12px; text-align: left; } @media (max-width: 320px) { footer.twlanding-footer .address-row p { font-size: 12px; } } @media (min-width: 321px) and (max-width: 735px) { footer.twlanding-footer .address-row p { font-size: 3.75vw; } } @media screen and (min-width: 736px) { footer.twlanding-footer .address-row p { font-size: 14px; } } @media screen and (min-width: 1024px) { footer.twlanding-footer .address-row p { font-size: 14px; } } @media screen and (min-width: 1240px) { footer.twlanding-footer .address-row p { font-size: 15px; } } footer.twlanding-footer .address-row .logo { width: 100%; float: none; margin-top: 0; display: block; padding-top: 32px; padding-bottom: 20px; } @media (max-width: 320px) { footer.twlanding-footer .address-row .logo { padding-top: 32px; padding-bottom: 20px; } } @media (min-width: 321px) and (max-width: 735px) { footer.twlanding-footer .address-row .logo { padding-top: 10vw; padding-bottom: 6.25vw; } } @media screen and (min-width: 736px) { footer.twlanding-footer .address-row .logo { padding-bottom: 16px; } } @media screen and (min-width: 1024px) { footer.twlanding-footer .address-row .logo { padding-bottom: 16px; } } @media screen and (min-width: 1240px) { footer.twlanding-footer .address-row .logo { padding-bottom: 20px; } } footer.twlanding-footer .address-row .logo img { width: 100%; max-width: 174px; } footer.twlanding-footer .footer-menu { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-positive: 1; flex-grow: 1; -ms-flex-negative: 1; flex-shrink: 1; width: 100%; max-width: 738px; margin: 0 -10px 8px; } @media (max-width: 320px) { footer.twlanding-footer .footer-menu { padding: 0 13px 0 9px; } } @media (min-width: 321px) and (max-width: 735px) { footer.twlanding-footer .footer-menu { padding: 0 4.0625vw 0 2.8125vw; max-width: 230.625vw; margin: 0 -3.125vw 2.5vw; } } @media screen and (min-width: 736px) { footer.twlanding-footer .footer-menu { margin-bottom: 60px; margin-top: 34px; max-width: 458px; } } @media screen and (min-width: 1024px) { footer.twlanding-footer .footer-menu { margin-bottom: 35px; max-width: 738px; -ms-flex-wrap: none; flex-wrap: nowrap; } } @media screen and (min-width: 1240px) { footer.twlanding-footer .footer-menu { margin-bottom: 103px; -ms-flex-wrap: none; flex-wrap: nowrap; } } footer.twlanding-footer .footer-menu .tw-col { padding: 0 10px; } @media (max-width: 735px) { footer.twlanding-footer .footer-menu .tw-col { padding: 0; } } footer.twlanding-footer .footer-menu .tw-title { font-size: 14px; margin-bottom: 6px; font-family: "LatoBold", sans-serif; line-height: 1.2; text-transform: uppercase; color: #004373; } @media (max-width: 320px) { footer.twlanding-footer .footer-menu .tw-title { font-size: 13px; margin-bottom: 16px; } } @media (min-width: 321px) and (max-width: 735px) { footer.twlanding-footer .footer-menu .tw-title { font-size: 4.0625vw; margin-bottom: 5vw; } } @media screen and (min-width: 736px) { footer.twlanding-footer .footer-menu .tw-title { font-size: 15px; margin-bottom: 13px; } } @media screen and (min-width: 1024px) { footer.twlanding-footer .footer-menu .tw-title { font-size: 15px; margin-bottom: 13px; } } @media screen and (min-width: 1240px) { footer.twlanding-footer .footer-menu .tw-title { font-size: 16px; margin-bottom: 15px; } } footer.twlanding-footer .footer-menu ul { padding: 0; margin: 0; list-style: none; } footer.twlanding-footer .footer-menu ul li { margin-bottom: 5px; } @media (max-width: 735px) { footer.twlanding-footer .footer-menu ul li { margin-bottom: 0; } } @media screen and (min-width: 736px) { footer.twlanding-footer .footer-menu ul li { margin-bottom: 2px; } } @media screen and (min-width: 1024px) { footer.twlanding-footer .footer-menu ul li { margin-bottom: 2px; } } @media screen and (min-width: 1240px) { footer.twlanding-footer .footer-menu ul li { margin-bottom: 5px; } } footer.twlanding-footer .footer-menu ul li a { font-size: 14px; color: #004373; text-decoration: none; } @media (max-width: 320px) { footer.twlanding-footer .footer-menu ul li a { font-size: 12px; } } @media (min-width: 321px) and (max-width: 735px) { footer.twlanding-footer .footer-menu ul li a { font-size: 3.75vw; } } @media screen and (min-width: 1024px) { footer.twlanding-footer .footer-menu ul li a { font-size: 14px; } } @media screen and (min-width: 1240px) { footer.twlanding-footer .footer-menu ul li a { font-size: 15px; } } footer.twlanding-footer .footer-menu ul li a:active, footer.twlanding-footer .footer-menu ul li a:focus, footer.twlanding-footer .footer-menu ul li a:hover, footer.twlanding-footer .footer-menu ul li a.active { text-decoration: underline; } footer.twlanding-footer .footer-menu .col-01 { margin-right: 64px; float: left; } @media (min-width: 321px) and (max-width: 735px) { footer.twlanding-footer .footer-menu .col-01 { margin-right: 20vw; } } @media screen and (min-width: 736px) { footer.twlanding-footer .footer-menu .col-01 { margin-right: 56px; } } @media screen and (min-width: 1024px) { footer.twlanding-footer .footer-menu .col-01 { margin-right: 66px; } } @media screen and (min-width: 736px) { footer.twlanding-footer .footer-menu .col-03 { margin-right: 62px; float: left; } } @media screen and (min-width: 1024px) { footer.twlanding-footer .footer-menu .col-03 { margin-right: 72px; float: left; } } @media screen and (min-width: 736px) { footer.twlanding-footer .footer-menu .col-04 { float: left; } } @media screen and (min-width: 1024px) { footer.twlanding-footer .footer-menu .col-04 { float: left; } } footer.twlanding-footer { background-color: #c8dff2; padding-bottom: 12px; position: relative; z-index: 4; } @media (min-width: 321px) and (max-width: 735px) { footer.twlanding-footer { padding-bottom: 3.75vw; } } @media screen and (min-width: 736px) { footer.twlanding-footer { padding-top: 1px; } } @media screen and (min-width: 1024px) { footer.twlanding-footer { padding-top: 19px; } } @media screen and (min-width: 1240px) { footer.twlanding-footer { padding-top: 21px; } } footer.twlanding-footer .nowrap { white-space: nowrap; } footer.twlanding-footer .wrap { padding: 0 20px; } @media (max-width: 320px) { footer.twlanding-footer .wrap { padding: 0 17px 0 13px; } } @media (min-width: 321px) and (max-width: 735px) { footer.twlanding-footer .wrap { padding: 0 5.3125vw 0 4.0625vw; } } @media screen and (min-width: 736px) { footer.twlanding-footer .wrap { padding: 0 47px; } } @media screen and (min-width: 1024px) { footer.twlanding-footer .wrap { padding: 0 42px 0 52px; } } @media screen and (min-width: 1400px) { footer.twlanding-footer .wrap { padding-left: 0px; padding-right: 15px; } } footer.twlanding-footer .tw-footer-content { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; } @media screen and (max-width: 735px) { footer.twlanding-footer .tw-footer-content { -ms-flex-wrap: wrap; flex-wrap: wrap; } } .copyright { clear: both; color: #3f3f3f; font-size: 12px; text-align: left; } @media (max-width: 320px) { .copyright { font-size: 11px; } } @media (min-width: 321px) and (max-width: 735px) { .copyright { font-size: 3.4375vw; } } @media screen and (min-width: 736px) { .copyright { font-size: 13px; padding-top: 16px; } .copyright br { display: none; } } @media screen and (min-width: 1024px) { .copyright { font-size: 13px; padding-top: 0; } } @media screen and (min-width: 1240px) { .copyright { font-size: 15px; } } .tw-front-popup-wrapper { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; position: absolute; top: 0; left: 0; width: 100%; height: 100%; font-family: "LatoRegular", sans-serif; font-size: 16px; padding: 20px; line-height: 1.2; box-sizing: border-box; color: #353a40; background-color: rgba(53, 58, 64, 0.5); pointer-events: auto; overflow: auto; } @media (min-width: 321px) and (max-width: 735px) { .tw-front-popup-wrapper { font-size: 5.625vw; padding: 6.25vw; } } @media (max-width: 735px) and (orientation: landscape) { .tw-front-popup-wrapper { -ms-flex-align: start; align-items: flex-start; } } @media (max-width: 735px) { .tw-front-popup-wrapper { padding: 0; } } .tw-front-popup-wrapper.tw-edge-browser .tw-front-popup .tw-front-popup-body { overflow-x: hidden; } .tw-front-popup-wrapper .tw-front-popup { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; position: relative; min-width: 500px; max-width: 600px; background: #fff; overflow: hidden; border-radius: 8px; box-shadow: 0 5px 30px rgba(0, 0, 0, 0.5); } .tw-front-popup-wrapper .tw-front-popup.sp-pop--up, .tw-front-popup-wrapper .tw-front-popup.login-pop--up, .tw-front-popup-wrapper .tw-front-popup.rpt-pop--up { min-width: 400px; max-width: 500px; } @media (max-width: 735px) { .tw-front-popup-wrapper .tw-front-popup { max-height: 100vh !important; width: 95vw; max-width: 100vw; min-width: auto; } } .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-close-btn { display: block; position: absolute; top: 15px; right: 15px; width: 23px; height: 23px; font-size: 23px; line-height: 23px; font-family: "LatoBold", sans-serif; text-align: center; color: #fff; background-color: #004373; cursor: pointer; z-index: 2; transition: background-color 0.3s; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } @media (max-width: 735px) { .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-close-btn { top: 16px; font-size: 20px; line-height: 20px; } } .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-close-btn:hover, .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-close-btn:focus, .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-close-btn:active { background-color: #265fa4; } .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-close-btn.tw-icon { background: none; color: #8b8d98; font-family: Trackabi; /* Support for all WebKit browsers. */ -webkit-font-smoothing: antialiased !important; /* Support for Safari and Chrome. */ text-rendering: optimizeLegibility; /* Support for IE. */ font-feature-settings: 'liga'; } .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-close-btn.tw-icon:hover, .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-close-btn.tw-icon:focus, .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-close-btn.tw-icon:active { background-color: unset; color: #007ec9; } .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-header { -ms-flex-negative: 0; flex-shrink: 0; width: 100%; font-family: "LatoRegular", sans-serif; padding: 35px 40px; font-size: 22px; color: #353a40; box-sizing: border-box; } @media (max-width: 735px) { .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-header { padding: 13px 40px 13px 20px; font-size: 24px; } } .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-body { -ms-flex-positive: 1; flex-grow: 1; -ms-flex-negative: 1; flex-shrink: 1; padding: 0 40px 15px; width: 100%; overflow-y: auto; box-sizing: border-box; } .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-body form { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-align: center; align-items: center; } @media (max-width: 735px) { .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-body { padding-left: 29px; padding-right: 29px; } } @media (max-width: 735px) { .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-body { padding: 20px; font-size: 17px; } } .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-body .tw-description-text { margin: 20px 0 20px; font-size: 15px; } @media (max-width: 735px) { .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-body .tw-description-text { margin-bottom: 30px; font-size: 15px; } } .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-body a { color: #2370a7; text-decoration: none; cursor: pointer; transition: color 0.3s; font-size: 15px; margin-top: 20px; } .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-body a:hover { color: #004486; } .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-body .tw-table { width: 100%; display: table; } .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-body .tw-table > * { display: table-cell; vertical-align: middle; } .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-body .tw-table > *:last-child { padding-top: 19px; font-size: 17px; white-space: nowrap; color: #3e4145; } @media (min-width: 321px) and (max-width: 735px) { .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-body .tw-table > *:last-child { padding-top: 5.3125vw; font-size: 6.25vw; } } .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-body .tw-table .tw-front-text-field { width: 256px; } .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-actions { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: end; justify-content: flex-end; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; -ms-flex-negative: 0; flex-shrink: 0; padding: 35px 40px; width: 100%; box-sizing: border-box; } @media (max-width: 735px) { .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-actions { padding: 20px; } } .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-actions .tw-base-button { margin-right: 10px; } .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-actions .tw-base-button button { font-family: "LatoRegular", sans-serif !important; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; transition: color 0.3s; font-size: 15px !important; } .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-actions .tw-base-button button > div { border-radius: 8px; padding: 5px 10px; background-color: #fff; color: #8b8d98 !important; } .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-actions .tw-base-button:hover button > div { color: #353a40 !important; } .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-actions .tw-base-button--primary button + .sk-spinner, .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-actions .tw-base-button--primary button > div { border-radius: 8px; background-color: #0070b2 !important; color: #fff !important; } .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-actions .tw-base-button--primary button:hover > div { background-color: #00568a !important; color: #fff !important; } .tw-front-popup-wrapper .tw-front-popup .tw-front-popup-actions .tw-base-button:last-child { margin-right: 0; } .anim-enter { opacity: 0; } .anim-enter .pop--up { transform: translateY(-64px); } .anim-enter.anim-enter-active { opacity: 1; transition: opacity 0.5s; } .anim-enter.anim-enter-active .pop--up { transform: translateY(0); transition: transform 0.3s; } .anim-leave { opacity: 1; } .anim-leave .pop--up { transform: translateY(0); } .anim-leave.anim-leave-active { opacity: 0; transition: opacity 0.3s; } .anim-leave.anim-leave-active .pop--up { transform: translateY(-64px); transition: transform 0.3s; } .tw-front-text-field { position: relative; border-bottom: 1px solid #cccfd7; margin: 5px 0 15px; padding-top: 20px; padding-bottom: 3px; width: 337px; max-width: 100%; box-sizing: border-box; } @media (max-width: 735px) { .tw-front-text-field { margin: 10px 0 20px; padding-top: 15px; height: 40px; padding-bottom: 3px; width: 337px; } } .tw-front-text-field:after { content: ''; position: absolute; left: 50%; bottom: -1px; height: 2px; width: 0; transform: translateX(-50%); background-color: #8b8d98; transition: width 0.3s; } .tw-front-text-field.tw-full-width { width: 100%; } .tw-front-text-field.tw-focused:after { width: 100%; background-color: #007ec9; } .tw-front-text-field.tw-focused .tw-floating-label { top: 0; font-size: 11px; color: #8b8d98; } @media (max-width: 735px) { .tw-front-text-field.tw-focused .tw-floating-label { font-size: 12px; } } .tw-front-text-field.tw-has-value .tw-floating-label { top: 0; font-size: 11px; color: #8b8d98; } @media (max-width: 735px) { .tw-front-text-field.tw-has-value .tw-floating-label { font-size: 12px; } } .tw-front-text-field.tw-error { border-bottom-color: #f44336; } .tw-front-text-field.tw-error:after { width: 100%; background-color: #f44336; } .tw-front-text-field.tw-disabled { cursor: not-allowed; } .tw-front-text-field.tw-disabled input { cursor: not-allowed; } .tw-front-text-field .tw-floating-label { position: absolute; left: 0; max-width: 100%; font-family: "LatoRegular", sans-serif; top: 20px; font-size: 19px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: #8b8d98; transition: top 0.2s, font-size 0.2s, color 0.2s; } @media (max-width: 735px) { .tw-front-text-field .tw-floating-label { top: 18px; font-size: 15px; } } .tw-front-text-field input, .tw-front-text-field textarea { position: relative; border: none; padding: 0; width: 100%; font-family: "LatoRegular", sans-serif; font-size: 15px; color: #3e4145; background: none; box-shadow: none; outline: none; } @media (max-width: 735px) { .tw-front-text-field input, .tw-front-text-field textarea { display: block; margin-top: 4px; font-size: 15px; } } .tw-front-text-field textarea { width: 100% !important; min-height: 20px; line-height: 1; } .tw-front-text-field .tw-error { position: absolute; bottom: 0; padding-top: 2px; font-size: 14px; transform: translateY(100%); color: #f44336; } @media (max-width: 735px) { .tw-front-text-field .tw-error { font-size: 13px; } } .tw-cookie-alert-wrap { position: fixed; bottom: 0; left: 0; right: 0; font-family: "LatoRegular", sans-serif; font-size: 15px; line-height: 1.2; z-index: 5; } .tw-cookie-alert-wrap .tw-shadow { height: 15px; width: 100%; background: rgba(0, 0, 0, 0.2); background: radial-gradient(ellipse at bottom, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0) 100%); } .tw-cookie-alert-wrap .tw-cookie-alert { position: relative; background: #fff; } .tw-cookie-alert-wrap .tw-cookie-alert .tw-ca-inner { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; margin: 0 auto; padding: 12px 0; max-width: 900px; } @media (max-width: 1000px) { .tw-cookie-alert-wrap .tw-cookie-alert .tw-ca-inner { padding-left: 20px; padding-right: 50px; } } @media (max-width: 480px) { .tw-cookie-alert-wrap .tw-cookie-alert .tw-ca-inner { -ms-flex-wrap: wrap; flex-wrap: wrap; } .tw-cookie-alert-wrap .tw-cookie-alert .tw-ca-inner > div { width: 100%; } .tw-cookie-alert-wrap .tw-cookie-alert .tw-ca-inner > div + div { margin-top: 15px; } } .tw-cookie-alert-wrap .tw-cookie-alert .tw-ca-inner .tw-message { font-family: "LatoRegular", sans-serif; font-size: 15px; line-height: 1.2; } @media screen and (max-width: 767px) { .tw-cookie-alert-wrap .tw-cookie-alert .tw-ca-inner .tw-message { font-size: 12px; } } .tw-cookie-alert-wrap .tw-cookie-alert .tw-ca-inner .tw-btn { margin-left: 15px; padding: 5px 10px; width: auto; font-family: "LatoRegular", sans-serif; font-size: 15px; } @media screen and (max-width: 767px) { .tw-cookie-alert-wrap .tw-cookie-alert .tw-ca-inner .tw-btn { font-size: 13px; } } @media (max-width: 480px) { .tw-cookie-alert-wrap .tw-cookie-alert .tw-ca-inner .tw-btn { margin-left: 0; } } .tw-cookie-alert-wrap .tw-cookie-alert .tw-ca-inner .tw-btn span { display: block; margin-top: -2px; } .tw-cookie-alert-wrap .tw-cookie-alert .tw-ca-inner a { color: #165b8b; } .tw-cookie-alert-wrap .tw-cookie-alert .tw-front-popup-close-btn { position: absolute; top: 12px; right: 12px; border-radius: 50%; height: 20px; width: 20px; font-family: "LatoBold", sans-serif; font-size: 17px; line-height: 20px; text-align: center; color: #fff; background-color: #004373; cursor: pointer; } .tw-cookie-alert-wrap .tw-cookie-alert .tw-front-popup-close-btn:hover, .tw-cookie-alert-wrap .tw-cookie-alert .tw-front-popup-close-btn:focus, .tw-cookie-alert-wrap .tw-cookie-alert .tw-front-popup-close-btn:active { background-color: #005b9b; } .tw-front-popup.pop--up.video-pop--up { max-width: 900px; overflow: visible; } .tw-front-popup.pop--up.video-pop--up .tw-front-popup-body { padding: 0px; } .tw-front-popup.pop--up.video-pop--up .tw-front-popup-body iframe { display: block; } .tw-front-popup.pop--up.video-pop--up .tw-front-popup-header { height: 47px; } .tw-front-popup.pop--up.video-pop--up .tw-front-popup-close-btn { top: -28px; right: -57px; width: 52px; height: 52px; font-size: 52px; line-height: 50px; background-color: transparent; } .tw-time-tracking-video--button { font-family: "LatoRegular"; text-align: left; color: #4b5155; font-size: 22px; padding: 10px 10px 9px 80px; margin: 0; position: relative; cursor: pointer; margin-bottom: 20px; background-color: transparent; transition: background-color 0.1s; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; color: #004373; background-color: #f2f7fc; } .tw-time-tracking-video--button:hover { background-color: #e0ebf5; } .tw-time-tracking-video--button:before { content: ''; position: absolute; top: 7px; left: 7px; width: 60px; height: 60px; background-color: #4579a9; border-radius: 50%; } .tw-time-tracking-video--button .tw-material-icons { color: #fff; font-size: 32px; position: absolute; top: 20px; left: 25px; width: 60px; height: 60px; } @media (min-width: 736px) and (max-width: 1239px) { .tw-time-tracking-video--button { font-size: 1.76vw; padding: 0.8vw 0vw 0.72vw 6vw; } .tw-time-tracking-video--button:before { top: 0.56vw; left: 0.56vw; width: 4.8vw; height: 4.8vw; } .tw-time-tracking-video--button .tw-material-icons { font-size: 2.56vw; top: 1.44vw; left: 2vw; } } @media (min-width: 321px) and (max-width: 735px) { .tw-time-tracking-video--button { font-size: 5.625vw; padding: 2.1875vw 4.375vw 2.8125vw 26.5625vw; } .tw-time-tracking-video--button:before { top: 2.1875vw; left: 5vw; width: 14.375vw; height: 14.375vw; } .tw-time-tracking-video--button .tw-material-icons { font-size: 8.125vw; top: 5vw; left: 9.0625vw; } } @media screen and (max-width: 320px) { .tw-time-tracking-video--button { font-size: 18px; padding: 7px 14px 9px 60px; } .tw-time-tracking-video--button:before { top: 7px; left: 7px; width: 46px; height: 46px; } .tw-time-tracking-video--button .tw-material-icons { font-size: 22px; top: 18px; left: 22px; } } @media screen and (max-width: 960px) { .tw-front-popup.pop--up.video-pop--up .tw-front-popup-body { padding: 0; } .tw-front-popup.pop--up.video-pop--up .tw-front-popup-body iframe { width: 560px; height: 315px; } } @media screen and (max-width: 736px) { .tw-front-popup.pop--up.video-pop--up .tw-front-popup-close-btn { top: 5px; right: 5px; background-color: #000; } .tw-front-popup.pop--up.video-pop--up .tw-front-popup-body { padding: 0; background-color: #000; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; } .tw-front-popup.pop--up.video-pop--up .tw-front-popup-body iframe { width: 100%; } } .tw-front-popup.tw-ol-popup p { width: 300px; margin: 15px auto 0; font-size: 16px; } .tw-front-popup.tw-ol-popup .tw-front-popup-body .tw-list-wrap { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: center; justify-content: center; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; } .tw-front-popup.tw-ol-popup .tw-front-popup-body ul { list-style-type: none; padding: 0; width: 300px; max-width: 100%; margin: 30px 0 0; } .tw-front-popup.tw-ol-popup .tw-front-popup-body ul li { width: 100%; margin-top: 10px; } .tw-front-popup.tw-ol-popup .tw-front-popup-body ul li a { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; padding: 7px; margin-top: 0; border-radius: 8px; width: 100%; max-width: 100%; font-size: 21px; line-height: normal; color: #09508f; background-color: #f3f8ff; box-sizing: border-box; transition: background-color 0.3s; } .tw-front-popup.tw-ol-popup .tw-front-popup-body ul li a:hover, .tw-front-popup.tw-ol-popup .tw-front-popup-body ul li a:focus, .tw-front-popup.tw-ol-popup .tw-front-popup-body ul li a:active { color: #4b5155; background-color: #e0f0ff; } .tw-front-popup.tw-ol-popup .tw-front-popup-body ul li a .tw-avatar { margin-right: 14px; border-radius: 50%; background-color: #edf0f2; } .tw-front-popup.tw-ol-popup .tw-front-popup-body ul li a .tw-avatar > div { border: none !important; background: none !important; } .tw-front-popup.tw-ol-popup .tw-front-popup-body ul li a .tw-avatar > div span.tw-name { color: #353a40; top: 0px; } .tw-front-popup.tw-ol-popup .tw-front-popup-body ul li a .tw-org-name { overflow: hidden; text-overflow: ellipsis; } .tw-front-popup.tw-ol-popup .tw-front-popup-body .tw-text-center { margin-top: 30px; } .tw-front-popup.tw-ol-popup .tw-front-popup-body .tw-text-center .tw-link { color: #007ec9; text-decoration: none; font-size: 15px; } .tw-front-popup.tw-ol-popup .tw-front-popup-body .tw-text-center .tw-link:hover { color: #09508f; } .tw-front-popup-wrapper .tw-front-popup.tw-reg-org-popup .tw-front-popup-body { overflow-y: unset; } .tw-front-popup-wrapper .tw-front-popup.tw-reg-org-popup .tw-front-popup-body .tw-error { white-space: nowrap; } .tw-appsumo-logo-line { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; } .tw-appsumo-logo-line img.tw-trackabi-logo { height: 41px; } .tw-appsumo-logo-line img.tw-heart { height: 55px; } .tw-appsumo-logo-line img.tw-appsumo-logo { height: 30px; } body { font-family: "LatoRegular", sans-serif; -webkit-font-smoothing: antialiased; /* Support for all WebKit browsers. */ -webkit-font-smoothing: antialiased !important; /* Support for Safari and Chrome. */ text-rendering: optimizeLegibility; /* Support for IE. */ font-feature-settings: 'liga'; } a { color: #1c76b8; } .twlanding-body { transition: padding-top 0.5s; } .twlanding-body h1.tw-subtitle { margin-top: 0px; margin-bottom: 0px; font-family: "LatoBold", sans-serif; color: #3f3f3f; line-height: 3.06; font-size: 32px; } @media (max-width: 1239px) and (min-width: 736px) { .twlanding-body h1.tw-subtitle { font-size: 2.72vw; } } @media (max-width: 735px) and (min-width: 320px) { .twlanding-body h1.tw-subtitle { font-size: 7vw; line-height: 1.5; margin-top: 25px; margin-bottom: 25px; } } @media (max-width: 319px) { .twlanding-body h1.tw-subtitle { font-size: 7vw; line-height: 1.5; margin-top: 15px; margin-bottom: 15px; } } .twlanding-body h2.tw-subtitle { margin-top: 0px; margin-bottom: 0px; font-family: "LatoBold", sans-serif; color: #3f3f3f; line-height: 2.94; font-size: 32px; } @media (max-width: 1239px) and (min-width: 736px) { .twlanding-body h2.tw-subtitle { font-size: 2.72vw; } } @media (max-width: 735px) and (min-width: 320px) { .twlanding-body h2.tw-subtitle { font-size: 5vw; line-height: 1.5; margin-top: 25px; margin-bottom: 25px; } } @media (max-width: 319px) { .twlanding-body h2.tw-subtitle { font-size: 7vw; line-height: 1.5; margin-top: 15px; margin-bottom: 15px; } } .twlanding-body .tw-content-wrap-light { padding: 39px 0 39px; font-size: 17px; font-family: "LatoRegular", sans-serif; color: #2c2f32; background-color: #fff; } @media (max-width: 735px) { .twlanding-body .tw-content-wrap-light { font-size: 15px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-content-wrap-light { padding: 12.1875vw 0 12.1875vw; font-size: 4.6875vw; } } .twlanding-body .tw-content-wrap-light p { margin: 10px 0 15px; line-height: 1.4; } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-content-wrap-light p { margin: 3.125vw 0 4.6875vw; } } .twlanding-body .tw-content-wrap-light p + p { margin-top: 24px; } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-content-wrap-light p + p { margin-top: 7.5vw; } } .twlanding-body .tw-content-wrap-light h2 { margin: 40px 0 23px; font-size: 28px; font-family: "LatoBold", sans-serif; line-height: 1.2; } @media (max-width: 735px) { .twlanding-body .tw-content-wrap-light h2 { font-size: 23px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-content-wrap-light h2 { margin: 12.5vw 0 7.1875vw; font-size: 7.1875vw; } } .twlanding-body .tw-content-wrap-light h2 + h3 { margin-top: 23px; } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-content-wrap-light h2 + h3 { margin-top: 7.1875vw; } } .twlanding-body .tw-content-wrap-light h3 { margin: 33px 0 10px; font-size: 23px; font-family: "LatoBold", sans-serif; line-height: 1.2; } @media (max-width: 735px) { .twlanding-body .tw-content-wrap-light h3 { font-size: 19px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-content-wrap-light h3 { margin: 10.3125vw 0 3.125vw; font-size: 5.9375vw; } } .twlanding-body .tw-content-wrap-light ol, .twlanding-body .tw-content-wrap-light ul { margin: 25px 0; padding-left: 50px; } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-content-wrap-light ol, .twlanding-body .tw-content-wrap-light ul { margin: 7.8125vw 0; padding-left: 15.625vw; } } .twlanding-body .tw-content-wrap-light ol li, .twlanding-body .tw-content-wrap-light ul li { line-height: 1.4; } .twlanding-body .wrap-middle { margin: 0 auto; padding: 0; width: 1200px; max-width: 100%; padding-right: 70px; } @media screen and (max-width: 1000px) { .twlanding-body .wrap-middle { width: 100%; max-width: 768px; padding: 0 15px; margin: auto; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .wrap-middle { max-width: 240vw; padding: 0 4.6875vw; } } .twlanding-body .wrap-small { margin: 0 auto; padding: 0 15px; width: 1000px; max-width: 100%; } @media screen and (max-width: 1000px) { .twlanding-body .wrap-small { width: 100%; max-width: 768px; padding: 0 15px; margin: auto; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .wrap-small { max-width: 240vw; padding: 0 4.6875vw; } } .twlanding-body .tw-small-container { margin: 0 auto; width: 670px; max-width: 100%; } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-small-container { width: 209.375vw; } } .twlanding-body .tw-top-message .tw-tm-close-btn { top: 0; } .tw-text-center { text-align: center; } .tw-material-icons { font-family: Trackabi; font-style: normal; /* Support for all WebKit browsers. */ -webkit-font-smoothing: antialiased !important; /* Support for Safari and Chrome. */ text-rendering: optimizeLegibility; /* Support for IE. */ font-feature-settings: 'liga'; } .tw-tabs .tw-vertical .tw-scrollbars:after { display: none; } .tw-flash-message { z-index: 6; } .tw-flash-message .tw-fm-title, .tw-flash-message .tw-fm-sub-message { font-family: "LatoBold", sans-serif; } .tw-loading-cover { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; position: absolute; z-index: 100; top: 0; left: 0; right: 0; bottom: 0; opacity: 1; } .h1, .h2, .h3, .h4, .h5, .h5, .h6, h1, h2, h3, h4, h5, h5, h6 { font-weight: normal; } .h1, h1 { font-family: "LatoBold", sans-serif; font-size: 28px; line-height: 1.4; color: #165b8b; } @media (min-width: 321px) and (max-width: 735px) { .h1, h1 { font-size: 8.75vw; } } @media screen and (min-width: 1024px) { .h1, h1 { font-size: 32px; } } .h2, h2 { font-family: "LatoBold", sans-serif; font-size: 24px; line-height: 1.4; color: #778590; } @media (min-width: 321px) and (max-width: 735px) { .h2, h2 { font-size: 7.5vw; } } @media screen and (min-width: 1024px) { .h2, h2 { font-size: 30px; } } .h3, h3 { font-family: "LatoBold", sans-serif; margin: 11px 0 10px; font-size: 21px; line-height: 1.2; color: #2c2f32; text-align: center; } @media (min-width: 321px) and (max-width: 735px) { .h3, h3 { margin: 3.4375vw 0 3.125vw; font-size: 6.5625vw; } } @media screen and (min-width: 736px) { .h3, h3 { margin: 35px 0 15px; font-size: 28px; } } @media screen and (min-width: 1024px) { .h3, h3 { margin: 55px 0 17px; font-size: 30px; } } .h4, h4 { margin-top: 9px; margin-bottom: 20px; font-size: 20px; font-family: "LatoRegular", sans-serif; line-height: 1; text-align: center; color: #2c2f32; } @media (min-width: 321px) and (max-width: 735px) { .h4, h4 { margin-top: 2.8125vw; margin-bottom: 6.25vw; font-size: 6.25vw; } } @media screen and (min-width: 736px) { .h4, h4 { margin-bottom: 25px; font-size: 21px; } } @media screen and (min-width: 1024px) { .h4, h4 { margin-bottom: 29px; font-size: 22px; } } .h5, h5 { margin: 10px 0 15px; font-size: 16px; font-family: "LatoRegular", sans-serif; text-align: center; color: #6a7c89; } @media (min-width: 321px) and (max-width: 735px) { .h5, h5 { margin: 3.125vw 0 4.6875vw; font-size: 5vw; } } @media screen and (min-width: 1024px) { .h5, h5 { margin: 12px 0 22px; font-size: 18px; } } .tw-link { display: inline-block; font-family: "LatoRegular", sans-serif; line-height: 1.2; text-decoration: underline; color: #1c76b8; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; transition: color 0.3s; } .tw-link:hover, .tw-link:focus, .tw-link:active { color: #004486; } .tw-links-group .tw-link + .tw-link { margin-left: 15px; } @media (min-width: 321px) and (max-width: 735px) { .tw-links-group .tw-link + .tw-link { margin-left: 4.6875vw; } } div.tw-link-button, .tw-link-button { font-family: "LatoRegular", sans-serif; } div.tw-link-button.tw-add .label, .tw-link-button.tw-add .label { display: inline-block; margin-top: -4px; } @media (min-width: 321px) and (max-width: 735px) { div.tw-link-button.tw-add .label, .tw-link-button.tw-add .label { margin-top: -0.3125vw; } } .tw-btn { padding: 5px 10px; display: inline-block; border-radius: 8px; font-family: "LatoRegular", sans-serif; font-size: 18px; text-align: center; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-decoration: none; color: #ffffff; background-color: #004373; cursor: pointer; transition: background-color 0.3s; } @media (min-width: 736px) { .tw-btn { font-size: 19px; } } .tw-btn.fixed-style { background-color: #0070b2; } .tw-btn.fixed-style:hover { background-color: #00568a; } .tw-btn.reset-style { width: auto; color: #a9b0b7; background-color: #eef2f6; } .tw-btn.reset-style:hover { background-color: #f5f8fb; } .tw-btn.tw-auto-width { width: auto; padding-left: 25px; padding-right: 25px; } @media (min-width: 321px) and (max-width: 735px) { .tw-btn.tw-auto-width { padding-left: 7.8125vw; padding-right: 7.8125vw; } } .tw-btn:hover, .tw-btn:focus, .tw-btn:active { background-color: #005b9b; } .tw-btn.tw-disabled { cursor: default; background-color: rgba(0, 67, 115, 0.3); } .tw-btn.tw-disabled:hover, .tw-btn.tw-disabled:focus, .tw-btn.tw-disabled:active { background-color: rgba(0, 67, 115, 0.3); } .tw-btn.tw-dim { font-family: "LatoRegular", sans-serif; font-size: 18px; color: #004373; background-color: #b2cae1; } @media (min-width: 321px) and (max-width: 735px) { .tw-btn.tw-dim { font-size: 5.625vw; } } .tw-btn.tw-dim.tw-support-btn { background-color: transparent; } .tw-btn.tw-dim:hover, .tw-btn.tw-dim:focus, .tw-btn.tw-dim:active { background-color: #d8e8f8; } .tw-btn.tw-dim:hover.tw-support-btn, .tw-btn.tw-dim:focus.tw-support-btn, .tw-btn.tw-dim:active.tw-support-btn { background-color: #f8fbfd; } .tw-btn.tw-link { font-family: "LatoRegular", sans-serif; font-size: 18px; color: #004373; background-color: transparent; transition: color 0.5s; } @media (min-width: 321px) and (max-width: 735px) { .tw-btn.tw-link { font-size: 5.625vw; } } .tw-btn.tw-link:hover, .tw-btn.tw-link:focus, .tw-btn.tw-link:active { color: #005b9b; } .tw-btn.tw-light { color: #004373; background-color: #fff; } .tw-btn.tw-light:hover, .tw-btn.tw-light:focus, .tw-btn.tw-light:active { background-color: #ecf2f8; } .tw-btn.tw-cta { color: #fff; background-color: #ff5c5e; padding: 0; } .tw-btn.tw-cta:hover, .tw-btn.tw-cta:focus, .tw-btn.tw-cta:active { background-color: #f74b4d; } .tw-btn.tw-btn-gamification { color: #fff; background-color: #9abede; padding: 0; } .tw-btn.tw-btn-gamification:hover, .tw-btn.tw-btn-gamification:focus, .tw-btn.tw-btn-gamification:active { background-color: #80b3df; } .tw-btn.tw-table { display: table; margin: auto; } .tw-btn.tw-arrow-left:before, .tw-btn.tw-arrow-left:after, .tw-btn.tw-arrow-right:before, .tw-btn.tw-arrow-right:after { content: 'keyboard_arrow_right_thin'; display: none; font-family: Trackabi; font-size: 12px; vertical-align: baseline; color: inherit; /* Support for all WebKit browsers. */ -webkit-font-smoothing: antialiased !important; /* Support for Safari and Chrome. */ text-rendering: optimizeLegibility; /* Support for IE. */ font-feature-settings: 'liga'; } @media (min-width: 321px) and (max-width: 735px) { .tw-btn.tw-arrow-left:before, .tw-btn.tw-arrow-left:after, .tw-btn.tw-arrow-right:before, .tw-btn.tw-arrow-right:after { font-size: 3.75vw; } } .tw-btn.tw-arrow-left.v2:before, .tw-btn.tw-arrow-left.v2:after, .tw-btn.tw-arrow-right.v2:before, .tw-btn.tw-arrow-right.v2:after { content: 'theme_arrow_next'; font-size: 20px; } .tw-btn.tw-arrow-left:before { display: inline-block; margin-right: 5px; transform: rotate(180deg); } @media (min-width: 321px) and (max-width: 735px) { .tw-btn.tw-arrow-left:before { margin-right: 1.5625vw; } } .tw-btn.tw-arrow-right:after { display: inline-block; margin-left: 5px; vertical-align: baseline; } @media (min-width: 321px) and (max-width: 735px) { .tw-btn.tw-arrow-right:after { margin-left: 1.5625vw; } } .tw-btn.tw-btn-big { width: auto; padding-left: 15px; padding-right: 15px; font-size: 24px; } .tw-btn.tw-btn-big:after { font-size: 17px; } .tw-btn.tw-light--bordered { color: #004373; border: 2px solid #9abede; background-color: #fff; font-size: 24px; line-height: normal; padding: 5px 16px; } .tw-btn.tw-light--bordered:after { margin-left: 10px; font-size: 24px !important; } .tw-btn.tw-light--bordered:hover, .tw-btn.tw-light--bordered:focus, .tw-btn.tw-light--bordered:active { background-color: #ecf2f8; } @media (max-width: 320px) { .tw-btn.tw-light--bordered { line-height: 30px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-btn.tw-light--bordered { line-height: 9.375vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-btn.tw-light--bordered { line-height: 4.16691vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-btn.tw-light--bordered { line-height: 44px; } } .tw-btn.tw-cta { height: 46px; line-height: 46px; } @media (max-width: 320px) { .tw-btn.tw-cta { height: 32px; line-height: 32px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-btn.tw-cta { height: 10vw; line-height: 10vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-btn.tw-cta { height: 34px; line-height: 34px; height: 4.42734vw; line-height: 4.42734vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-btn.tw-cta { height: 46px; line-height: 46px; } } .tw-btn.tw-cta.tw-arrow-right { width: auto; padding-left: 15px; padding-right: 13px; font-size: 24px; } @media (max-width: 320px) { .tw-btn.tw-cta.tw-arrow-right { padding-left: 8px; padding-right: 8px; font-size: 20px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-btn.tw-cta.tw-arrow-right { padding-left: 2.5vw; padding-right: 2.5vw; font-size: 6.25vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-btn.tw-cta.tw-arrow-right { padding-left: 11px; padding-right: 9px; font-size: 18px; padding-left: 1.43237vw; padding-right: 1.17194vw; font-size: 2.34388vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-btn.tw-cta.tw-arrow-right { padding-left: 15px; padding-right: 9px; font-size: 18px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-btn.tw-cta.tw-arrow-right { padding-left: 1.2vw; padding-right: 1.04vw; font-size: 1.92vw; } } .tw-btn.tw-cta.tw-arrow-right:after { content: 'arrow_cta'; font-size: 17px; margin-left: 12px; } @media (min-width: 736px) and (max-width: 1023px) { .tw-btn.tw-cta.tw-arrow-right:after { font-size: 12px; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-btn.tw-cta.tw-arrow-right:after { font-size: 12px; } } .tw-btn.tw-cta.tw-arrow-right.thin:after { content: 'keyboard_arrow_right_thin'; } .tw-checkbox { display: inline-block; position: relative; padding-left: 24px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; cursor: pointer; } @media (min-width: 321px) and (max-width: 735px) { .tw-checkbox { padding-left: 7.5vw; } } .tw-checkbox [type='checkbox'] { display: none; } .tw-checkbox .tw-icon:before { content: 'theme_checkbox_false'; display: block; position: absolute; top: 2px; left: 0; height: 18px; width: 18px; font-family: Trackabi; font-size: 16px; line-height: 18px; text-align: center; /* Support for all WebKit browsers. */ -webkit-font-smoothing: antialiased !important; /* Support for Safari and Chrome. */ text-rendering: optimizeLegibility; /* Support for IE. */ font-feature-settings: 'liga'; } @media (min-width: 321px) and (max-width: 735px) { .tw-checkbox .tw-icon:before { height: 5.625vw; width: 5.625vw; top: 0.625vw; font-size: 5vw; line-height: 5.625vw; } } .tw-checkbox [type='checkbox']:checked ~ .tw-icon:before { content: 'theme_checkbox_true'; } .tw-checkbox [type='checkbox']:disabled ~ * { color: #b3b7b9; cursor: not-allowed; } .tw-info { position: relative; padding-left: 31px; color: #3e4145; } @media (min-width: 321px) and (max-width: 735px) { .tw-info { padding-left: 9.6875vw; } } .tw-info:before { content: 'theme_info'; display: inline-block; position: absolute; left: 0; top: 2px; height: 21px; width: 21px; font-size: 20px; font-family: 'Trackabi'; color: #3896db; } @media (min-width: 321px) and (max-width: 735px) { .tw-info:before { top: 0.625vw; height: 6.5625vw; width: 6.5625vw; font-size: 6.25vw; } } .tw-info:first-child { margin-top: 0; margin-bottom: 23px; } @media (min-width: 321px) and (max-width: 735px) { .tw-info:first-child { margin-bottom: 7.1875vw; } } .tw-info.tw-smaller { margin-left: -28px; padding-left: 28px; font-size: 14px; line-height: 1.2; } @media (min-width: 321px) and (max-width: 735px) { .tw-info.tw-smaller { margin-left: -8.75vw; padding-left: 8.75vw; font-size: 4.375vw; } } .tw-info.tw-smaller:before { top: -1px; font-size: 18px; } @media (min-width: 321px) and (max-width: 735px) { .tw-info.tw-smaller:before { top: -0.3125vw; font-size: 5.625vw; } } .tw-check-list--page { color: #004f88; margin-left: 0; padding-left: 0; margin-top: 24px; margin-bottom: 60px; list-style-type: none; } @media (max-width: 320px) { .tw-check-list--page { margin-top: 24px; margin-bottom: 30px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-check-list--page { margin-top: 7.5vw; margin-bottom: 9.375vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-check-list--page { margin-left: 0; padding-left: 0; margin-top: 24px; margin-bottom: 60px; margin-top: 3.12518vw; margin-bottom: 7.81295vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-check-list--page { margin-left: 0; padding-left: 0; margin-top: 24px; margin-bottom: 60px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-check-list--page { margin-left: 0; padding-left: 0; margin-top: 1.92vw; margin-bottom: 4.8vw; } } @media (min-width: 1240px) { .tw-check-list--page { margin-left: 0; padding-left: 0; margin-top: 24px; margin-bottom: 60px; } } .tw-check-list--page li { text-align: left; margin-top: 0; padding-top: 10px; padding-right: 27px; padding-bottom: 0px; padding-left: 60px; border-radius: 6px; margin-bottom: 8px; max-width: 400px; width: 100%; position: relative; } @media (max-width: 320px) { .tw-check-list--page li { margin-top: 0; padding: 10px 0 0 20px; border-radius: 6px; margin-bottom: 8px; max-width: 400px; width: 100%; font-size: 14px !important; } } @media (min-width: 321px) and (max-width: 735px) { .tw-check-list--page li { margin-top: 0; padding: 3.125vw 0 0 9.375vw; border-radius: 1.875vw; margin-bottom: 2.5vw; max-width: 125vw; width: 100%; font-size: 4.375vw !important; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-check-list--page li { padding: 10px 27px 0 60px; border-radius: 6px; margin-top: 0; margin-bottom: 8px; max-width: 400px; width: 100%; padding: 1.30216vw 3.51583vw 0 3.90647vw; border-radius: 0.78129vw; margin-bottom: 1.04173vw; max-width: 52.08633vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-check-list--page li { padding-top: 10px; padding-right: 27px; padding-bottom: 0px; padding-left: 60px; border-radius: 6px; margin-top: 0; margin-bottom: 8px; max-width: 400px; width: 100%; font-size: 18px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-check-list--page li { margin-top: 0; padding-top: 0.8vw; padding-right: 2.16vw; padding-left: 4.8vw; border-radius: 0.48vw; margin-bottom: 0.64vw; max-width: 32vw; font-size: 2.08vw; width: 100%; } } @media (min-width: 1240px) { .tw-check-list--page li { padding-top: 10px; padding-right: 27px; padding-bottom: 0px; padding-left: 60px; border-radius: 6px; margin-top: 0; margin-bottom: 8px; max-width: 400px; width: 100%; font-size: 26px; } } .tw-check-list--page li:before { top: 14px; content: 'theme_checked_bold'; position: absolute; top: 7px; left: -30px; left: 28px; font-family: Trackabi; font-size: 22px; } @media (max-width: 320px) { .tw-check-list--page li:before { top: 12px; left: 7px; font-size: 10px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-check-list--page li:before { top: 4.0625vw; left: 4.6875vw; font-size: 3.125vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-check-list--page li:before { top: 10px; left: 15px; top: 1.56259vw; left: 1.95324vw; font-size: 1.30216vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-check-list--page li:before { top: 14px; left: 28px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-check-list--page li:before { top: 0.88vw; left: 2.24vw; } } @media (min-width: 1240px) { .tw-check-list--page li:before { top: 14px; left: 28px; } } .tw-check-list--page--desktop-app { color: #004f88; margin-left: 0; padding-left: 0; margin-top: 19px; margin-bottom: 85px; list-style-type: none; } @media (max-width: 320px) { .tw-check-list--page--desktop-app { margin-top: 19px; margin-bottom: 30px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-check-list--page--desktop-app { margin-top: 5.9375vw; margin-bottom: 9.375vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-check-list--page--desktop-app { margin-left: 0; padding-left: 0; margin-top: 19px; margin-top: 2.4741vw; margin-bottom: 8.46403vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-check-list--page--desktop-app { margin-left: 0; padding-left: 0; margin-top: 19px; margin-bottom: 85px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-check-list--page--desktop-app { margin-left: 0; padding-left: 0; margin-top: 1.52vw; margin-bottom: 6.8vw; } } @media (min-width: 1240px) { .tw-check-list--page--desktop-app { margin-left: 0; padding-left: 0; margin-top: 19px; margin-bottom: 85px; } } .tw-check-list--page--desktop-app li { text-align: left; position: relative; margin-top: 0; padding: 10px 27px 0 60px; border-radius: 6px; margin-bottom: 8px; max-width: 400px; width: 100%; } @media (max-width: 320px) { .tw-check-list--page--desktop-app li { margin-top: 0; padding: 10px 0 0 20px; border-radius: 6px; margin-bottom: 8px; max-width: 400px; width: 100%; font-size: 14px !important; } } @media (min-width: 321px) and (max-width: 735px) { .tw-check-list--page--desktop-app li { margin-top: 0; padding: 3.125vw 0 0 6.25vw; border-radius: 1.875vw; margin-bottom: 2.5vw; max-width: 125vw; width: 100%; font-size: 4.375vw !important; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-check-list--page--desktop-app li { padding: 10px 0 0 20px; border-radius: 6px; margin-top: 0; margin-bottom: 8px; max-width: 400px; width: 100%; padding: 1.30216vw 0 0 3.90647vw; border-radius: 0.78129vw; margin-bottom: 1.04173vw; max-width: 52.08633vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-check-list--page--desktop-app li { padding: 10px 27px 0 30px; border-radius: 6px; margin-top: 0; margin-bottom: 8px; max-width: 400px; width: 100%; font-size: 18px; left: 20px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-check-list--page--desktop-app li { margin-top: 0; padding-top: 0.8vw; padding-right: 2.16vw; padding-left: 4.8vw; border-radius: 0.48vw; margin-bottom: 0.64vw; max-width: 32vw; font-size: 1.76vw; left: 1.6vw; width: 100%; } } @media (min-width: 1240px) { .tw-check-list--page--desktop-app li { padding-top: 10px; padding-right: 27px; padding-bottom: 0px; padding-left: 60px; border-radius: 6px; margin-top: 0; margin-bottom: 8px; max-width: 400px; width: 100%; font-size: 22px; left: 20px; } } .tw-check-list--page--desktop-app li:before { top: 14px; content: 'theme_checked_bold'; position: absolute; top: 7px; left: -30px; left: 35px; font-family: Trackabi; font-size: 18px; } @media (max-width: 320px) { .tw-check-list--page--desktop-app li:before { top: 14px; left: 5px; font-size: 10px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-check-list--page--desktop-app li:before { top: 3.75vw; left: 1.875vw; font-size: 3.125vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-check-list--page--desktop-app li:before { top: 12px; left: 28px; top: 1.6277vw; left: 1.95324vw; font-size: 1.30216vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-check-list--page--desktop-app li:before { top: 10px; left: 7px; font-size: 18px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-check-list--page--desktop-app li:before { top: 1.12vw; left: 2.8vw; font-size: 1.44vw; } } @media (min-width: 1240px) { .tw-check-list--page--desktop-app li:before { top: 14px; left: 35px; font-size: 18px; } } .tw-check-list--landing { list-style-type: none; padding-left: 18px; padding-top: 30px; margin-top: 0; margin-bottom: 60px; } @media (max-width: 320px) { .tw-check-list--landing { padding-left: 10px; margin-bottom: 26px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-check-list--landing { padding-left: 3.125vw; margin-bottom: 8.125vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-check-list--landing { padding-left: 18px; margin-bottom: 20px; padding-left: 2.34388vw; margin-bottom: 2.60432vw; } } @media screen and (min-width: 1024px) and (max-width: 1026px) { .tw-check-list--landing { margin-bottom: 20px; padding-top: 20px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-check-list--landing { padding-left: 1.44vw; margin-bottom: 5.2vw; margin-bottom: 5.6vw; } } .tw-check-list--landing li { text-align: left; position: relative; color: #125687; width: 100%; margin-top: 0; margin-bottom: 0; } @media (max-width: 320px) { .tw-check-list--landing li { padding-bottom: 5px; padding-left: 30px; font-size: 18px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-check-list--landing li { padding-bottom: 1.5625vw; padding-left: 9.375vw; font-size: 5.625vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-check-list--landing li { padding-bottom: 10px; padding-left: 30px; font-size: 20px; padding-bottom: 1.30216vw; padding-left: 3.90647vw; font-size: 2.60432vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-check-list--landing li { padding-top: 10px; padding-bottom: 12px; padding-left: 30px; font-size: 30px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-check-list--landing li { padding-bottom: 0.96vw; padding-left: 2.4vw; max-width: 32vw; font-size: 1.92vw; width: 100%; font-size: 2.4vw; } } @media (min-width: 1240px) { .tw-check-list--landing li { padding-bottom: 12px; padding-left: 30px; border-radius: 6px; font-size: 32px; line-height: normal; } } .tw-check-list--landing li:before { content: 'theme_checked_bold'; position: absolute; font-family: Trackabi; font-size: 16px; left: 0; } @media (max-width: 320px) { .tw-check-list--landing li:before { top: 9px; font-size: 14px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-check-list--landing li:before { top: 1.25vw; font-size: 4.375vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-check-list--landing li:before { top: 3px; font-size: 16px; top: 0.19532vw; font-size: 2.60432vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-check-list--landing li:before { top: 20px; font-size: 20px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-check-list--landing li:before { top: 7px; font-size: 1.6vw; } } @media (min-width: 1240px) { .tw-check-list--landing li:before { top: 5px; font-size: 26px; } } .tw-check-list--gamification { list-style-type: none; padding: 0; margin: 0; } @media (max-width: 320px) { .tw-check-list--gamification { padding-left: 24px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-check-list--gamification { padding-left: 7.5vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-check-list--gamification { margin-top: 10px; padding-left: 10px; margin-top: 1.30216vw; padding-left: 1.30216vw; } } @media screen and (min-width: 1024px) and (max-width: 1026px) { .tw-check-list--gamification { margin-bottom: 20px; margin-top: 20px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-check-list--gamification { margin-top: 20px; } } @media screen and (min-width: 1240px) { .tw-check-list--gamification { margin-top: 20px; } } .tw-check-list--gamification li { text-align: left; position: relative; color: #3e3e3e; width: 100%; margin-top: 0; margin-bottom: 0; line-height: 1; padding-bottom: 0; } @media (max-width: 320px) { .tw-check-list--gamification li { padding-top: 5px; padding-left: 20px; font-size: 14px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-check-list--gamification li { padding-top: 1.5625vw; padding-left: 6.25vw; font-size: 4.375vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-check-list--gamification li { padding-top: 10px; padding-left: 30px; font-size: 20px; padding-top: 1.30216vw; padding-left: 3.90647vw; font-size: 2.60432vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-check-list--gamification li { margin-top: 0; padding-top: 10px; padding-left: 30px; font-size: 26px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-check-list--gamification li { padding-top: 0.8vw; padding-left: 2.4vw; max-width: 32vw; width: 100%; font-size: 2.08vw; } } @media (min-width: 1240px) { .tw-check-list--gamification li { border-radius: 6px; padding-top: 10px; padding-left: 30px; font-size: 24px; } } .tw-check-list--gamification li:before { content: 'theme_checked_bold'; position: absolute; font-family: Trackabi; font-size: 16px; left: 0; } @media (max-width: 320px) { .tw-check-list--gamification li:before { top: 7px; font-size: 12px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-check-list--gamification li:before { top: 2.1875vw; font-size: 3.75vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-check-list--gamification li:before { top: 14px; font-size: 16px; top: 1.82302vw; font-size: 2.60432vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-check-list--gamification li:before { top: 17px; font-size: 20px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-check-list--gamification li:before { top: 1.36vw; font-size: 1.6vw; } } @media (min-width: 1240px) { .tw-check-list--gamification li:before { top: 15px; font-size: 20px; } } .tw-check-list--gamification--golden { list-style-type: none; padding: 0; margin: 0; } @media (max-width: 320px) { .tw-check-list--gamification--golden { padding-left: 24px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-check-list--gamification--golden { padding-left: 7.5vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-check-list--gamification--golden { margin-top: 10px; padding-left: 10px; margin-top: 1.30216vw; padding-left: 1.30216vw; } } @media screen and (min-width: 1024px) and (max-width: 1026px) { .tw-check-list--gamification--golden { margin-bottom: 20px; margin-top: 10px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-check-list--gamification--golden { margin-top: 10px; } } @media screen and (min-width: 1240px) { .tw-check-list--gamification--golden { margin-top: 10px; } } .tw-check-list--gamification--golden li { text-align: left; position: relative; width: 100%; margin-top: 0; margin-bottom: 0; line-height: 1; color: #f6931e; padding-top: 0; padding-bottom: 2px; } @media (max-width: 320px) { .tw-check-list--gamification--golden li { padding-left: 20px; font-size: 14px; padding-bottom: 4px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-check-list--gamification--golden li { padding-left: 6.25vw; font-size: 4.375vw; padding-bottom: 1.25vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-check-list--gamification--golden li { padding-left: 30px; font-size: 20px; padding-left: 3.90647vw; font-size: 2.60432vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-check-list--gamification--golden li { padding-left: 30px; font-size: 24px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-check-list--gamification--golden li { padding-left: 2.4vw; max-width: 32vw; width: 100%; font-size: 1.92vw; } } @media (min-width: 1240px) { .tw-check-list--gamification--golden li { border-radius: 6px; padding-left: 30px; font-size: 24px; } } .tw-check-list--gamification--golden li:before { content: 'theme_checked_bold'; position: absolute; font-family: Trackabi; font-size: 16px; left: 4px; } @media (max-width: 320px) { .tw-check-list--gamification--golden li:before { top: 2px; font-size: 12px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-check-list--gamification--golden li:before { top: 0.625vw; font-size: 3.75vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-check-list--gamification--golden li:before { top: 6px; font-size: 16px; top: 0.78129vw; font-size: 2.08345vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-check-list--gamification--golden li:before { top: 6px; font-size: 16px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-check-list--gamification--golden li:before { top: 0.48vw; font-size: 1.28vw; } } @media (min-width: 1240px) { .tw-check-list--gamification--golden li:before { top: 6px; font-size: 16px; } } .tw-check-list--apps { list-style-type: none; padding: 0; margin: 0; margin-bottom: 14px; } @media (max-width: 320px) { .tw-check-list--apps { margin-bottom: 14px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-check-list--apps { margin-bottom: 4.375vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-check-list--apps { margin-bottom: 10px; margin-bottom: 1.82302vw; } } @media screen and (min-width: 1024px) and (max-width: 1026px) { .tw-check-list--apps { margin-bottom: 14px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-check-list--apps { margin-bottom: 14px; } } @media screen and (min-width: 1240px) { .tw-check-list--apps { margin-bottom: 14px; } } .tw-check-list--apps li { text-align: left; position: relative; width: 100%; margin-top: 0; margin-bottom: 0; line-height: 1.22; color: #3f3f3f; padding-top: 0; padding-bottom: 0px; margin-bottom: 5px; } @media (max-width: 320px) { .tw-check-list--apps li { padding-left: 20px; font-size: 14px; margin-bottom: 5px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-check-list--apps li { padding-left: 6.25vw; font-size: 4.375vw; margin-bottom: 1.5625vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-check-list--apps li { padding-left: 30px; font-size: 14px; padding-left: 3.90647vw; font-size: 1.82302vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-check-list--apps li { padding-left: 30px; font-size: 18px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-check-list--apps li { padding-left: 2.4vw; max-width: 32vw; width: 100%; font-size: 1.44vw; } } @media (min-width: 1240px) { .tw-check-list--apps li { padding-left: 20px; font-size: 18px; min-height: 27px; } } .tw-check-list--apps li:before { content: 'theme_checked_bold'; position: absolute; font-family: Trackabi; font-size: 16px; left: 0px; } @media (max-width: 320px) { .tw-check-list--apps li:before { top: 2px; font-size: 12px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-check-list--apps li:before { top: 0.625vw; font-size: 3.75vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-check-list--apps li:before { top: 4px; font-size: 16px; top: 0.52086vw; font-size: 2.08345vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-check-list--apps li:before { top: 4px; font-size: 16px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-check-list--apps li:before { top: 0.32vw; font-size: 1.28vw; } } @media (min-width: 1240px) { .tw-check-list--apps li:before { top: 4px; font-size: 16px; } } .tw-check-list--product-tour { list-style-type: none; padding: 0; margin: 0; } .tw-check-list--product-tour li { text-align: left; position: relative; color: #3f3f3f; width: 100%; line-height: 1.2; font-family: "LatoRegular"; direction: ltr; } @media (max-width: 320px) { .tw-check-list--product-tour li { padding-top: 5px; padding-bottom: 5px; padding-left: 20px; font-size: 14px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-check-list--product-tour li { padding-top: 1.5625vw; padding-bottom: 1.5625vw; padding-left: 6.25vw; font-size: 4.375vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-check-list--product-tour li { padding-top: 8px; padding-bottom: 10px; padding-left: 30px; font-size: 14px; padding-top: 1.04173vw; padding-bottom: 1.30216vw; padding-left: 3.90647vw; font-size: 1.82302vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-check-list--product-tour li { margin-top: 0; padding-top: 10px; padding-bottom: 10px; padding-left: 22px; font-size: 20px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-check-list--product-tour li { padding-top: 0.8vw; padding-bottom: 0.8vw; padding-left: 1.76vw; width: 100%; font-size: 1.6vw; } } @media (min-width: 1240px) { .tw-check-list--product-tour li { padding-top: 10px; padding-bottom: 10px; padding-left: 22px; font-size: 20px; } } .tw-check-list--product-tour li:before { content: 'theme_checked_bold'; position: absolute; font-family: Trackabi; font-size: 17px; left: 0; } @media (max-width: 320px) { .tw-check-list--product-tour li:before { top: 7px; font-size: 12px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-check-list--product-tour li:before { top: 2.1875vw; font-size: 3.75vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-check-list--product-tour li:before { top: 1.30216vw; left: 0.65108vw; font-size: 1.95324vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-check-list--product-tour li:before { top: 13px; font-size: 17px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-check-list--product-tour li:before { top: 1.04vw; font-size: 1.36vw; } } @media (min-width: 1240px) { .tw-check-list--product-tour li:before { top: 13px; font-size: 17px; } } #tw-join-us-svg { text-align: center; padding-top: 34px; background-color: transparent; float: right; position: relative; } @media (max-width: 735px) { #tw-join-us-svg { float: none; padding-bottom: 0; } } @media (min-width: 321px) and (max-width: 735px) { #tw-join-us-svg { padding-top: 3.75vw; margin-top: -7.5vw; padding-bottom: 7.1875vw; } } @media (max-width: 320px) { #tw-join-us-svg { padding-top: 12px; margin-top: -24px; padding-bottom: 23px; } } #tw-join-us-svg .tw-wrap { margin: auto; padding: 11px 5px 0 5px; max-width: 720px; } @media screen and (min-width: 736px) { #tw-join-us-svg .tw-wrap { padding-top: 0px; padding-bottom: 66px; } } @media screen and (min-width: 1024px) { #tw-join-us-svg .tw-wrap { padding-top: 22px; padding-bottom: 100px; } } #tw-join-us-svg .tw-content { position: relative; background-image: url("/img/front/desktop-app/explore-trackabi.svg"); background-repeat: no-repeat; background-size: contain; background-position: 100% 100%; margin: auto; } @media (max-width: 320px) { #tw-join-us-svg .tw-content { width: 260px; height: 115px; } } @media (min-width: 321px) and (max-width: 735px) { #tw-join-us-svg .tw-content { width: 81.25vw; height: 35.9375vw; } } @media (min-width: 736px) and (max-width: 1023px) { #tw-join-us-svg .tw-content { width: 252px; height: 108px; width: 32.81439vw; height: 14.06331vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { #tw-join-us-svg .tw-content { width: 292px; height: 110px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { #tw-join-us-svg .tw-content { width: 30.56vw; height: 11.2vw; } } @media screen and (min-width: 1240px) { #tw-join-us-svg .tw-content { width: 382px; height: 140px; } } #tw-join-us-svg .tw-cta { opacity: 0 !important; background-color: transparent !important; position: absolute; font-size: 1px; color: transparent !important; left: 0; top: 0; width: 100%; height: 100%; } .join-us--product-tour-page #tw-join-us-svg, .join-us--features-page #tw-join-us-svg { float: none; } @media (min-width: 736px) and (max-width: 1023px) { .join-us--product-tour-page #tw-join-us-svg .tw-content, .join-us--features-page #tw-join-us-svg .tw-content { width: 350px; height: 140px; width: 45.57554vw; height: 18.23022vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .join-us--product-tour-page #tw-join-us-svg .tw-content, .join-us--features-page #tw-join-us-svg .tw-content { width: 400px; height: 150px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .join-us--product-tour-page #tw-join-us-svg .tw-content, .join-us--features-page #tw-join-us-svg .tw-content { width: 41.92vw; height: 15.2vw; } } @media screen and (min-width: 1240px) { .join-us--product-tour-page #tw-join-us-svg .tw-content, .join-us--features-page #tw-join-us-svg .tw-content { width: 524px; height: 190px; } } .join-us--blog-page #tw-join-us-svg { float: none; } @media (min-width: 736px) and (max-width: 1023px) { .join-us--blog-page #tw-join-us-svg .tw-content { width: 350px; height: 140px; width: 45.57554vw; height: 18.23022vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .join-us--blog-page #tw-join-us-svg .tw-content { width: 400px; height: 150px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .join-us--blog-page #tw-join-us-svg .tw-content { width: 41.92vw; height: 15.2vw; } } @media screen and (min-width: 1240px) { .join-us--blog-page #tw-join-us-svg .tw-content { width: 524px; height: 190px; } } .twlanding-body .twlanding-features { padding: 0; margin: 0; list-style: none; } .twlanding-body .twlanding-features-content h2 { font-family: "LatoRegular"; color: #004373; margin-top: 45px; margin-bottom: 37px; } @media screen and (min-width: 736px) { .twlanding-body .twlanding-features-content h2 { margin-top: 60px; } } @media screen and (min-width: 1240px) { .twlanding-body .twlanding-features-content h2 { padding-bottom: 0; font-size: 36px; padding-left: 0px; } } @media screen and (min-width: 736px) { .twlanding-body .twlanding-features-content .wrap.desktop-no-padding { padding: 0; } } @media screen and (min-width: 1240px) { .twlanding-body .twlanding-features-content .wrap.desktop-no-padding { max-width: 1222px; padding-right: 28px; } } .twlanding-body .twlanding-features-content .twlanding-features { overflow: hidden; margin-bottom: 15px; height: 589px; } @media screen and (min-width: 736px) { .twlanding-body .twlanding-features-content .twlanding-features { margin-bottom: 0; } } .twlanding-body .twlanding-features-content .img-block { text-align: center; } .twlanding-body .twlanding-features-content .img-block img { max-width: 100%; } .twlanding-body .twlanding-features-content .features-row { position: relative; margin: 0 auto 21px; overflow: hidden; width: 868px; text-align: left; float: left; } @media screen and (min-width: 736px) { .twlanding-body .twlanding-features-content .features-row .twlanding-features { float: left; } } .twlanding-body .twlanding-features-content .features-row .img-block { margin-bottom: 15px; width: 100%; padding: 10px; position: relative; text-align: left; } @media screen and (min-width: 736px) { .twlanding-body .twlanding-features-content .features-row .img-block { float: left; margin-bottom: 0; } } .twlanding-body .twlanding-features-content .features-row .img-block img { display: inline-block; overflow: hidden; box-shadow: 0 0 11px 1px rgba(0, 0, 0, 0.25); max-width: 100%; } .twlanding-body .twlanding-features-content .tw-link { font-size: 15px; } .twlanding-body .twlanding-features-sections .twlanding-features-section { background-color: #fff; } .twlanding-body .twlanding-features-sections .twlanding-features-section:nth-child(even) { background-color: #f2f7fc; } .twlanding-body .twlanding-features-sections .twlanding-features-section:nth-child(even) .wrap.desktop-no-padding { padding-right: 0; padding-left: 10px; } .twlanding-body .twlanding-features-sections .twlanding-features-section:nth-child(even) h2 { margin-top: 20px; } @media screen and (min-width: 736px) { .twlanding-body .twlanding-features-sections .twlanding-features-section:nth-child(even) h2 { margin-top: 60px; } } .twlanding-body .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features-content .features-row { float: right; width: 858px; } @media screen and (min-width: 736px) { .twlanding-body .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features-content .features-row .twlanding-features { float: right; } } @media screen and (min-width: 736px) and (min-width: 736px) { .twlanding-body .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features-content .features-row .twlanding-features .img-block { float: right; } } .twlanding-body .features-top-video-section { max-width: 367px !important; height: 70px; margin: auto; margin-top: 15px; margin-bottom: 2px; padding: 0 20px; } @media screen and (max-width: 320px) { .twlanding-body .features-top-video-section { max-width: 100% !important; margin-top: 16px; margin-bottom: -10px; padding: 0 20px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .features-top-video-section { max-width: 100% !important; height: 21.875vw; margin: auto; margin-top: 5vw; margin-bottom: -3.125vw; padding: 0 6.25vw; } } @media (min-width: 736px) { .twlanding-body .features-top-video-section { padding-right: 37px; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .features-top-video-section { max-width: 28vw !important; height: 5.6vw; margin: auto; margin-top: 1.2vw; margin-bottom: 0.16vw; padding: 0 1.6vw; padding-right: 2.16vw; } } .twlanding-body h3 + #tw-video-popup--component { padding-top: 20px; } .twlanding-body h3 + #tw-video-popup--component .tw-time-tracking-video--button { border-left: 15px solid #fff; } @media screen and (max-width: 320px) { .twlanding-body h3 + #tw-video-popup--component .tw-time-tracking-video--button { border-left: 0; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body h3 + #tw-video-popup--component .tw-time-tracking-video--button { border-left: 0; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body h3 + #tw-video-popup--component .tw-time-tracking-video--button { border-left: vm(15) solid #fff; } } @keyframes tw-featured-menu-before-animation { 0% { border-right-color: #f2f7fc; } 100% { border-right-color: #e0ebf5; } } @keyframes tw-featured-menu-before-animation--left { 0% { border-left-color: #e9f1f8; } 100% { border-left-color: #dae7f3; } } @keyframes tw-featured-image-animation { 0% { opacity: 0; transform: translate(-20px, 50px); } 100% { opacity: 1; transform: translate(0px, 0px); } } @keyframes tw-featured-menu-animation { 0% { background-color: #e0ebf5; } 100% { background-color: transparent; } } @keyframes tw-featured-menu-animation--left { 0% { background-color: #dae7f3; } 100% { background-color: transparent; } } @keyframes tw-featured-menu-animation--active { 0% { background-color: #f2f7fc; } 100% { background-color: #e0ebf5; } } @keyframes tw-featured-menu-animation--active--left { 0% { background-color: #e9f1f8; } 100% { background-color: #dae7f3; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content h2 { margin-bottom: 3.2vw; } .twlanding-body .twlanding-features-content .twlanding-features { margin-bottom: 1.2vw; height: 47.12vw; } .twlanding-body .twlanding-features-content .features-row { margin: 0 auto 1.68vw; width: 69.44vw; } .twlanding-body .twlanding-features-content .features-row .img-block { margin-bottom: 1.2vw; padding: 0.8vw; } .twlanding-body .twlanding-features-content .features-row .img-block img { box-shadow: 0 0 0.88vw 0.08vw rgba(0, 0, 0, 0.25); } .twlanding-body .twlanding-features-content .tw-link { font-size: 1.2vw; } .twlanding-body .twlanding-features-sections .twlanding-features-section { padding-left: 1.6vw; padding-right: 2.08vw; } .twlanding-body .twlanding-features-sections .twlanding-features-section .wrap.desktop-no-padding { padding-left: 0; padding-right: 0; } .twlanding-body .twlanding-features-sections .twlanding-features-section:nth-child(even) { padding-left: 2.08vw; padding-right: 1.6vw; } .twlanding-body .twlanding-features-sections .twlanding-features-section:nth-child(even) .wrap.desktop-no-padding { padding-right: 0; padding-left: 0; } .twlanding-body .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features-content .features-row { float: right; width: 68.64vw; } } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content h2 { margin-top: 20px; margin-bottom: 20px; } .twlanding-body .twlanding-features-content .twlanding-features { overflow: hidden; margin-bottom: 15px; height: auto; padding: 0; } .twlanding-body .twlanding-features-content .features-row { margin: 0px auto 21px; padding: 0px; max-width: 280px; float: none; width: 87.5vw; height: 60.9375vw; } .twlanding-body .twlanding-features-content .features-row .img-block { margin-bottom: 15px; } .twlanding-body .twlanding-features-content .tw-link { font-size: 15px; } .twlanding-body .twlanding-features-sections .twlanding-features-section:nth-child(even) .wrap.desktop-no-padding { padding-right: 10px; padding-left: 10px; } .twlanding-body .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features-content .features-row { float: none; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content h2 { margin-top: 6.25vw; margin-bottom: 6.25vw; } .twlanding-body .twlanding-features-content .twlanding-features { overflow: hidden; margin-bottom: 4.6875vw; height: auto; padding: 0; } .twlanding-body .twlanding-features-content .features-row { margin: 0px auto 0; padding: 0px; max-width: 87.5vw; float: none; width: 87.5vw; height: 60.9375vw; } .twlanding-body .twlanding-features-content .features-row .img-block { margin-bottom: 0; } .twlanding-body .twlanding-features-content .tw-link { font-size: 4.6875vw; } .twlanding-body .twlanding-features-sections .twlanding-features-section:nth-child(even) .wrap.desktop-no-padding { padding-right: 3.125vw; padding-left: 3.125vw; } .twlanding-body .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features-content .features-row { float: none; } } .twlanding-body .twlanding-features-content .twlanding-features--menu { padding-top: 12px; cursor: pointer; background-color: #fff; } .twlanding-body .twlanding-features-content .twlanding-features--menu h3 { font-family: "LatoRegular"; text-align: left; color: #4b5155; font-size: 22px; margin: 0; position: relative; cursor: pointer; margin-bottom: 20px; background-color: transparent; transition: background-color 0.1s; min-height: 70px; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; } .twlanding-body .twlanding-features-content .twlanding-features--menu h3:after { content: ''; position: absolute; bottom: -10px; height: 1px; background-color: #4b5155; } .twlanding-body .twlanding-features-content .twlanding-features--menu h3:last-of-type:after { display: none; } .twlanding-body .twlanding-features-content .twlanding-features--menu h3:before { content: ''; } .twlanding-body .twlanding-features-content .twlanding-features--menu h3:hover { background-color: #f2f7fc; } .twlanding-body .twlanding-features-content .twlanding-features--menu h3.active, .twlanding-body .twlanding-features-content .twlanding-features--menu h3.active:hover { color: #004373; background-color: #e0ebf5; animation: tw-featured-menu-animation--active 0.3s ease-in-out; z-index: 2; } .twlanding-body .twlanding-features-content .twlanding-features--menu h3.active:before, .twlanding-body .twlanding-features-content .twlanding-features--menu h3.active:hover:before { content: ''; position: absolute; top: 0; animation: tw-featured-menu-before-animation 0.3s ease-in-out; } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .twlanding-features--menu { -ms-flex-order: 0; order: 0; } .twlanding-body .twlanding-features-content .twlanding-features--menu h3 { font-size: 1.76vw; } .twlanding-body .twlanding-features-content .twlanding-features--menu h3:after { bottom: -0.8vw; height: 1px; } } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .twlanding-features--menu h3 { font-size: 15px; min-height: 40px; margin: 0; margin-bottom: 10px; } .twlanding-body .twlanding-features-content .twlanding-features--menu h3:after { bottom: -5px; height: 1px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .twlanding-features--menu h3 { font-size: 4.6875vw; margin: 0; margin-bottom: 3.125vw; min-height: 12.5vw; } .twlanding-body .twlanding-features-content .twlanding-features--menu h3:after { bottom: -5px; height: 1px; } .twlanding-body .twlanding-features-content .twlanding-features--menu h3.active:before, .twlanding-body .twlanding-features-content .twlanding-features--menu h3.active:hover:before { display: none; } } .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu { background-color: #f2f7fc; } .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu h3:hover { background-color: #e9f1f8; } .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu h3.active, .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu h3.active:hover { background-color: #dae7f3; animation: tw-featured-menu-animation--active--left 0.3s ease-in-out; } .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu h3.active:before, .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu h3.active:hover:before { content: ''; position: absolute; top: 0; left: auto; animation: tw-featured-menu-before-animation--left 0.3s ease-in-out; } @media (min-width: 321px) and (max-width: 735px) { .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu h3.active:before, .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu h3.active:hover:before { display: none; } } .twlanding-features-sections .twlanding-features-section:nth-child(odd) .twlanding-features--menu { float: right; width: 326px; padding-left: 30px; } .twlanding-features-sections .twlanding-features-section:nth-child(odd) .twlanding-features--menu h3 { padding: 7px 10px 9px 20px; border-left: 15px solid #fff; } .twlanding-features-sections .twlanding-features-section:nth-child(odd) .twlanding-features--menu h3:after { right: 12px; width: 260px; } .twlanding-features-sections .twlanding-features-section:nth-child(odd) .twlanding-features--menu h3.active, .twlanding-features-sections .twlanding-features-section:nth-child(odd) .twlanding-features--menu h3.active:hover { border-left: 0; } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-features-sections .twlanding-features-section:nth-child(odd) .twlanding-features--menu h3.active, .twlanding-features-sections .twlanding-features-section:nth-child(odd) .twlanding-features--menu h3.active:hover { padding-left: 2.8vw; } } .twlanding-features-sections .twlanding-features-section:nth-child(odd) .twlanding-features--menu h3.active:before, .twlanding-features-sections .twlanding-features-section:nth-child(odd) .twlanding-features--menu h3.active:hover:before { left: -60px; border: 35px solid transparent; border-right: 25px solid #e0ebf5; } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-features-sections .twlanding-features-section:nth-child(odd) .twlanding-features--menu { width: 24.8vw; padding-left: 1.84vw; padding-top: 0.96vw; } .twlanding-features-sections .twlanding-features-section:nth-child(odd) .twlanding-features--menu h3 { padding: 0.56vw 0.8vw 0.72vw 1.6vw; margin-bottom: 1.6vw; min-height: 5.6vw; border-left: 1.2vw solid #fff; } .twlanding-features-sections .twlanding-features-section:nth-child(odd) .twlanding-features--menu h3:after { right: 0.96vw; width: 20vw; } .twlanding-features-sections .twlanding-features-section:nth-child(odd) .twlanding-features--menu h3.active:before, .twlanding-features-sections .twlanding-features-section:nth-child(odd) .twlanding-features--menu h3.active:hover:before { left: -4.8vw; border: 2.8vw solid transparent; border-right: 2vw solid #e0ebf5; } } @media screen and (max-width: 320px) { .twlanding-features-sections .twlanding-features-section:nth-child(odd) .twlanding-features--menu { float: none; width: 100%; padding-left: 0px; } .twlanding-features-sections .twlanding-features-section:nth-child(odd) .twlanding-features--menu h3 { padding: 7px 14px 9px 14px; border-left: 0; } .twlanding-features-sections .twlanding-features-section:nth-child(odd) .twlanding-features--menu h3:after { right: 12px; width: calc(100% - 24px); } .twlanding-features-sections .twlanding-features-section:nth-child(odd) .twlanding-features--menu h3.active:before, .twlanding-features-sections .twlanding-features-section:nth-child(odd) .twlanding-features--menu h3.active:hover:before { display: none; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-features-sections .twlanding-features-section:nth-child(odd) .twlanding-features--menu { float: none; width: 100%; padding-left: 0px; } .twlanding-features-sections .twlanding-features-section:nth-child(odd) .twlanding-features--menu h3 { padding: 2.1875vw 4.375vw 2.8125vw 4.375vw; border-left: 0; } .twlanding-features-sections .twlanding-features-section:nth-child(odd) .twlanding-features--menu h3:after { right: 12px; width: calc(100% - 24px); } } .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu { float: left; width: 336px; padding-left: 0; padding-right: 40px; } .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu h3 { padding: 7px 20px 9px 14px; } .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu h3:after { right: 26px; width: 255px; } .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu h3:not(.active) { position: relative; } .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu h3:not(.active):before { content: ''; position: absolute; width: 10px; right: 0px; height: 100%; background-color: #f2f7fc; } .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu h3.active:before, .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu h3.active:hover:before { right: -60px; border: 35px solid transparent; border-right: 35px solid transparent; border-left: 25px solid #dae7f3; } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu { width: 24.8vw; padding-top: 0.96vw; padding-right: 1.6vw; padding-left: 0; } .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu h3 { padding: 0.56vw 2.8vw 0.72vw 1.12vw; } .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu h3:after { right: 2.08vw; width: 20.4vw; } .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu h3.active:before, .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu h3.active:hover:before { right: -4.8vw; border: 2.8vw solid transparent; border-right: 2.8vw solid transparent; border-left: 2vw solid #dae7f3; } } @media screen and (max-width: 320px) { .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu { float: none; width: 100%; padding-left: 0px; padding-right: 0; } .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu h3 { padding: 7px 14px 9px 14px; } .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu h3:not(.active):before { display: none; } .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu h3:after { right: 15px; width: calc(100% - 24px); } .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu h3.active:before, .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu h3.active:hover:before { display: none; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu { float: none; width: 100%; padding-left: 0px; padding-right: 0; } .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu h3 { padding: 2.1875vw 4.375vw 2.8125vw 4.375vw; } .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu h3:not(.active):before { display: none; } .twlanding-features-sections .twlanding-features-section:nth-child(even) .twlanding-features--menu h3:after { right: 15px; width: calc(100% - 24px); } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-using-timer { height: 546px; overflow: hidden; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-using-timer { height: 180px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-using-timer { height: 56.25vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-using-timer { height: 43.68vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-using-timer img { width: 842px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-using-timer img { width: 240px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-using-timer img { width: 75vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-using-timer img { width: 67.36vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-using-timer img + img { position: absolute; width: 214px; bottom: 31px; right: 99px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-using-timer img + img { width: 66px; bottom: 10px; right: 50px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-using-timer img + img { width: 20.625vw; bottom: 3.125vw; right: 15.625vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-using-timer img + img { width: 17.12vw; bottom: 2.48vw; right: 7.92vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-custom-fields { height: 522px; overflow: hidden; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-custom-fields { height: 230px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-custom-fields { height: 71.875vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-custom-fields { height: 41.76vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-custom-fields img { width: 608px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-custom-fields img { width: 240px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-custom-fields img { width: 75vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-custom-fields img { width: 48.64vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-custom-fields img + img { position: absolute; width: 498px; bottom: 10px; right: 16px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-custom-fields img + img { width: 158px; bottom: 10px; right: 16px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-custom-fields img + img { width: 49.375vw; bottom: 3.125vw; right: 5vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-custom-fields img + img { width: 39.84vw; bottom: 0.8vw; right: 1.28vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-manually { height: 516px; overflow: hidden; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-manually { height: 200px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-manually { height: 62.5vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-manually { height: 41.28vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-manually img { width: 842px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-manually img { width: 260px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-manually img { width: 81.25vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-manually img { width: 67.36vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-manually img + img { position: absolute; width: 327px; bottom: 10px; right: auto; left: 145px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-manually img + img { width: 120px; bottom: 10px; right: auto; left: 45px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-manually img + img { width: 37.5vw; bottom: 3.125vw; right: auto; left: 14.0625vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-manually img + img { width: 26.16vw; bottom: 0.8vw; right: auto; left: 11.6vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-manually img + img + img { position: absolute; width: 384px; bottom: 30px; right: 40px; left: auto; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-manually img + img + img { width: 160px; bottom: 20px; right: 20px; left: auto; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-manually img + img + img { width: 50vw; bottom: 6.25vw; right: 6.25vw; left: auto; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-manually img + img + img { width: 30.72vw; bottom: 3.2vw; right: 6.4vw; left: auto; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-editable-table { overflow: hidden; } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-editable-table img { width: 842px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-editable-table img { width: 260px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-editable-table img { width: 81.25vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-editable-table img { width: 67.36vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-logged { height: 525px; overflow: hidden; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-logged { height: 180px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-logged { height: 56.25vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-logged { height: 42vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-logged img { width: 842px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-logged img { width: 260px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-logged img { width: 81.25vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-logged img { width: 67.36vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-logged img + img { position: absolute; width: 395px; bottom: 35px; right: 85px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-logged img + img { width: 120px; bottom: 35px; right: 85px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-logged img + img { width: 37.5vw; bottom: 10.9375vw; right: 26.5625vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-logged img + img { width: 31.6vw; bottom: 2.8vw; right: 6.8vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-logged img + img + img { position: absolute; width: 225px; bottom: 7px; right: 52px; box-shadow: none; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-logged img + img + img { width: 60px; bottom: 7px; right: 25px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-logged img + img + img { width: 18.75vw; bottom: 2.1875vw; right: 7.8125vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-logged img + img + img { width: 16vw; bottom: 0.56vw; right: 4.16vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-user-roles { overflow: hidden; } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-user-roles img { width: 842px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-user-roles img { width: 240px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-user-roles img { width: 75vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-user-roles img { width: 67.36vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-clients { overflow: hidden; } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-clients img { width: 842px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-clients img { width: 240px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-clients img { width: 75vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-clients img { width: 67.36vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-members { height: 483px; overflow: hidden; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-members { height: 190px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-members { height: 59.375vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-members { height: 38.64vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-members img { width: 692px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-members img { width: 240px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-members img { width: 75vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-members img { width: 55.36vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-members img + img { position: absolute; width: 317px; bottom: 80px; right: 10px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-members img + img { width: 100px; bottom: 50px; right: 40px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-members img + img { width: 31.25vw; bottom: 15.625vw; right: 12.5vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-members img + img { width: 25.36vw; bottom: 6.4vw; right: 0.8vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-personal-leaves-schedule { height: 514px; overflow: hidden; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-personal-leaves-schedule { height: 180px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-personal-leaves-schedule { height: 56.25vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-personal-leaves-schedule { height: 41.12vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-personal-leaves-schedule img { width: 719px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-personal-leaves-schedule img { width: 220px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-personal-leaves-schedule img { width: 68.75vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-personal-leaves-schedule img { width: 57.52vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-personal-leaves-schedule img + img { position: absolute; width: 494px; bottom: 10px; right: 10px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-personal-leaves-schedule img + img { width: 136px; bottom: 10px; right: 60px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-personal-leaves-schedule img + img { width: 42.5vw; bottom: 3.125vw; right: 18.75vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-personal-leaves-schedule img + img { width: 39.52vw; bottom: 0.8vw; right: 0.8vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-leaves-schedule { height: 514px; overflow: hidden; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-leaves-schedule { height: 180px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-leaves-schedule { height: 56.25vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-leaves-schedule { height: 41.12vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-leaves-schedule img { width: 756px; float: right; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-leaves-schedule img { width: 220px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-leaves-schedule img { width: 68.75vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-leaves-schedule img { width: 60.48vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-leaves-schedule img + img { position: absolute; width: 443px; bottom: 10px; right: auto; left: 10px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-leaves-schedule img + img { width: 136px; bottom: 10px; right: auto; left: 10px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-leaves-schedule img + img { width: 42.5vw; bottom: 3.125vw; right: auto; left: 3.125vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-leaves-schedule img + img { width: 35.44vw; bottom: 0.8vw; right: auto; left: 0.8vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-saved-reports { height: 476px; overflow: hidden; padding-top: 40px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-saved-reports { height: 180px; padding-top: 10px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-saved-reports { height: 56.25vw; padding-top: 3.125vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-saved-reports { height: 38.08vw; padding-top: 3.2vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-saved-reports img { width: 719px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-saved-reports img { width: 260px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-saved-reports img { width: 81.25vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-saved-reports img { width: 57.52vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-saved-reports img + img { position: absolute; width: 523px; bottom: 10px; right: 10px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-saved-reports img + img { width: 130px; bottom: 10px; right: 10px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-saved-reports img + img { width: 40.625vw; bottom: 3.125vw; right: 3.125vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-saved-reports img + img { width: 41.84vw; bottom: 0.8vw; right: 0.8vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-export { height: 515px; padding-top: 30px; overflow: hidden; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-export { height: 190px; padding-top: 20px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-export { height: 59.375vw; padding-top: 6.25vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-export { height: 41.2vw; padding-top: 2.4vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-export img { width: 610px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-export img { width: 200px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-export img { width: 62.5vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-export img { width: 48.8vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-export img + img { position: absolute; width: 347px; bottom: 10px; right: 10px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-export img + img { width: 120px; bottom: 10px; right: 10px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-export img + img { width: 37.5vw; bottom: 3.125vw; right: 3.125vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-export img + img { width: 27.76vw; bottom: 0.8vw; right: 0.8vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-export img + img + img { position: absolute; width: 270px; bottom: 40px; right: 315px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-export img + img + img { width: 80px; bottom: 25px; right: 100px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-export img + img + img { width: 25vw; bottom: 7.8125vw; right: 31.25vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-export img + img + img { width: 21.6vw; bottom: 3.2vw; right: 25.2vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-customization { height: 470px; overflow: hidden; padding-top: 40px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-customization { height: 190px; padding-top: 20px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-customization { height: 59.375vw; padding-top: 6.25vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-customization { height: 37.6vw; padding-top: 3.2vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-customization img { width: 558px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-customization img { width: 220px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-customization img { width: 68.75vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-customization img { width: 44.64vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-customization img + img { position: absolute; width: 417px; bottom: 10px; right: 10px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-customization img + img { width: 160px; bottom: 10px; right: 10px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-customization img + img { width: 50vw; bottom: 3.125vw; right: 3.125vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-reports-customization img + img { width: 33.36vw; bottom: 0.8vw; right: 0.8vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-company-dashboard { overflow: hidden; } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-company-dashboard img { width: 838px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-company-dashboard img { width: 260px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-company-dashboard img { width: 81.25vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-company-dashboard img { width: 67.04vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-personal-dashboard { overflow: hidden; } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-personal-dashboard img { width: 839px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-personal-dashboard img { width: 260px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-personal-dashboard img { width: 81.25vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-personal-dashboard img { width: 67.12vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-teams { overflow: hidden; } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-teams img { width: 839px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-teams img { width: 260px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-teams img { width: 81.25vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-teams img { width: 67.12vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-import { height: 530px; overflow: hidden; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-import { height: 210px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-import { height: 65.625vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-import { height: 42.4vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-import img { width: 582px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-import img { width: 190px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-import img { width: 59.375vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-import img { width: 46.56vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-import img + img { position: absolute; width: 417px; bottom: 10px; right: auto; left: 45px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-import img + img { width: 150px; bottom: 10px; right: auto; left: 25px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-import img + img { width: 46.875vw; bottom: 3.125vw; right: auto; left: 7.8125vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-import img + img { width: 33.36vw; bottom: 0.8vw; right: auto; left: 3.6vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-import img + img + img { position: absolute; width: 475px; bottom: 90px; right: 10px; left: auto; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-import img + img + img { width: 150px; bottom: 40px; right: 30px; left: auto; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-import img + img + img { width: 46.875vw; bottom: 12.5vw; right: 9.375vw; left: auto; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-import img + img + img { width: 38vw; bottom: 7.2vw; right: 2.4vw; left: auto; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-work-breakdown { height: 483px; overflow: hidden; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-work-breakdown { height: 190px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-work-breakdown { height: 59.375vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-work-breakdown { height: 38.64vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-work-breakdown img { width: 722px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-work-breakdown img { width: 240px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-work-breakdown img { width: 75vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-work-breakdown img { width: 57.76vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-work-breakdown img + img { position: absolute; width: 317px; bottom: 64px; right: 60px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-work-breakdown img + img { width: 100px; bottom: 50px; right: 40px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-work-breakdown img + img { width: 31.25vw; bottom: 15.625vw; right: 12.5vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-work-breakdown img + img { width: 25.36vw; bottom: 5.12vw; right: 4.8vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-project-plan { height: 476px; overflow: hidden; padding-top: 50px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-project-plan { height: 180px; padding-top: 10px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-project-plan { height: 56.25vw; padding-top: 3.125vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-project-plan { height: 38.08vw; padding-top: 4vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-project-plan img { width: 340px; position: relative; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-project-plan img { width: 120px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-project-plan img { width: 37.5vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-project-plan img { width: 28vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-project-plan img + img { position: absolute; width: 656px; bottom: 10px; right: 10px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-project-plan img + img { width: 200px; bottom: 10px; right: 40px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-project-plan img + img { width: 62.5vw; bottom: 12.5vw; right: 3.125vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-project-plan img + img { width: 52.48vw; bottom: 0.8vw; right: 0.8vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-generating { height: 540px; overflow: hidden; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-generating { height: 190px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-generating { height: 59.375vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-generating { height: 43.2vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-generating img { width: 480px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-generating img { width: 170px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-generating img { width: 53.125vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-generating img { width: 38.4vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-generating img + img { position: absolute; width: 627px; bottom: 10px; right: 22px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-generating img + img { width: 190px; bottom: 10px; right: 10px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-generating img + img { width: 59.375vw; bottom: 3.125vw; right: 3.125vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-generating img + img { width: 50.16vw; bottom: 0.8vw; right: 1.76vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-tracking-payments { height: 540px; overflow: hidden; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-tracking-payments { height: 190px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-tracking-payments { height: 59.375vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-tracking-payments { height: 43.2vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-tracking-payments img { width: 844px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-tracking-payments img { width: 260px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-tracking-payments img { width: 81.25vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-tracking-payments img { width: 67.52vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-sending { height: 540px; overflow: hidden; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-sending { height: 190px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-sending { height: 59.375vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-sending { height: 43.2vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-sending img { width: 390px; position: absolute; top: 30px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-sending img { width: 140px; top: 20px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-sending img { width: 43.75vw; top: 6.25vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-sending img { width: 31.2vw; top: 2.4vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-sending img + img { position: absolute; width: 452px; top: 10px; right: 22px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-sending img + img { width: 160px; top: 10px; right: 10px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-sending img + img { width: 50vw; top: 3.125vw; right: 3.125vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-sending img + img { width: 36.16vw; top: 0.8vw; right: 1.76vw; } } .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-sending img + img + img { position: absolute; width: 360px; top: 182px; left: 59px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-sending img + img + img { width: 140px; top: 70px; left: 30px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-sending img + img + img { width: 43.75vw; top: 21.875vw; left: 9.375vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-features-content .features-row .img-block.time-tracking-invoicing-sending img + img + img { width: 28.8vw; top: 14.56vw; left: 4.72vw; } } .twlanding-body .twlanding-product-tour-content h2 { font-family: "LatoBold"; line-height: 1.2; color: #3f3f3f; margin: 0 auto; padding: 50px 0 0 0; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-product-tour-content h2 { padding-top: 20px; padding-bottom: 20px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-product-tour-content h2 { padding-top: 6.25vw; padding-bottom: 20px; font-size: 4.6875vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-product-tour-content h2 { font-size: 2.1875vw; } } @media screen and (min-width: 1240px) { .twlanding-body .twlanding-product-tour-content h2 { font-size: 28px; } } .twlanding-body .twlanding-product-tour-content:first-child h2 { padding-top: 20px; } .twlanding-body .twlanding-product-tour-content .wrap.desktop-no-padding { max-width: 1200px; padding-left: 0; padding-right: 0; } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-product-tour-content .wrap.desktop-no-padding { padding-right: 3.125vw; padding-left: 3.125vw; } } @media screen and (min-width: 736px) { .twlanding-body .twlanding-product-tour-content .wrap.desktop-no-padding { padding: 0; } } .twlanding-body .twlanding-product-tour-content .img-block { text-align: center; } .twlanding-body .twlanding-product-tour-content .img-block img { bottom: auto; height: auto; z-index: 1; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-drag: none; width: 100%; } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-product-tour-content .img-block img { width: 100%; } } .twlanding-body .twlanding-product-tour-content .product-tour-row { position: relative; overflow: visible; text-align: left; float: left; height: 100%; } .twlanding-body .twlanding-product-tour-content .product-tour-row .img-block { margin-bottom: 15px; width: 100%; height: 100%; overflow: visible; position: relative; text-align: left; } @media screen and (min-width: 736px) { .twlanding-body .twlanding-product-tour-content .product-tour-row .img-block { float: left; margin-bottom: 0; } } .twlanding-body .twlanding-product-tour-content .product-tour-row .img-block img { display: block; } .twlanding-body .twlanding-product-tour--row { margin: 0; list-style: none; overflow: hidden; height: auto; display: -ms-grid; display: grid; -ms-grid-columns: 700px auto; grid-template-columns: 700px auto; column-gap: 30px; width: 100%; padding: 30px 20px 20px; } .twlanding-body .twlanding-product-tour--row.tw-image-right { direction: rtl; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-product-tour--row { -ms-grid-columns: 1fr; grid-template-columns: 1fr; overflow: hidden; padding: 0; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-product-tour--row { -ms-grid-columns: 1fr; grid-template-columns: 1fr; -ms-grid-rows: 1fr auto; grid-template-rows: 1fr auto; overflow: hidden; padding: 0; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .twlanding-product-tour--row { padding-top: 2.60432vw; padding-bottom: 2.60432vw; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .twlanding-product-tour--row { -ms-grid-columns: 56vw auto; grid-template-columns: 56vw auto; padding-top: 1.6vw; padding-bottom: 1.6vw; } } .twlanding-body .twlanding-product-tour-sections .twlanding-product-tour-section .tw-check-list--product-tour { padding-right: 25px; padding-left: 0; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-product-tour-sections .twlanding-product-tour-section .tw-check-list--product-tour { padding: 0 7.8125vw; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-product-tour-sections .twlanding-product-tour-section .tw-check-list--product-tour { padding: 0 3.125vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .twlanding-product-tour-sections .twlanding-product-tour-section .tw-check-list--product-tour { padding-right: 1.5625vw; padding-left: 0; } } .twlanding-body .twlanding-product-tour-sections .twlanding-product-tour-section:nth-child(even) .tw-check-list--product-tour { padding-right: 0; padding-left: 25px; } @media screen and (max-width: 320px) { .twlanding-body .twlanding-product-tour-sections .twlanding-product-tour-section:nth-child(even) .tw-check-list--product-tour { padding: 0 7.8125vw; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-product-tour-sections .twlanding-product-tour-section:nth-child(even) .tw-check-list--product-tour { padding: 0 3.125vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .twlanding-product-tour-sections .twlanding-product-tour-section:nth-child(even) .tw-check-list--product-tour { padding-right: 0; padding-left: 1.5625vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .twlanding-top-row { padding-left: 52px; padding-right: 52px; padding-left: 6.77122vw; padding-right: 6.77122vw; } } @media screen and (min-width: 1024px) and (max-width: 1342px) { .twlanding-body .twlanding-top-row { padding-left: 70px; padding-right: 70px; } } .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 { font-family: "LatoBold", sans-serif; color: #004373; font-size: 21px; line-height: 1; margin: 0; padding: 0; line-height: 1.4; } @media (max-width: 320px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 { line-height: 1.5; font-size: 18px; padding: 1px 0 0 18px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 { line-height: 1.5; font-size: 5.625vw; padding: 0.3125vw 0 0 5.625vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 { font-size: 19px; padding: 4px 0 0 12px; font-size: 2.4741vw; padding: 0.26043vw 0 0 2.34388vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 { font-size: 25px; padding: 2px 0 0 20px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 { font-size: 2.56vw; padding: 0.32vw 0 0 1.92vw; } } @media (min-width: 1240px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 { padding: 6px 0 0 24px; font-size: 32px; } } .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 span { font-family: inherit; font-size: inherit; line-height: inherit; letter-spacing: inherit; text-align: left; position: relative; display: block; color: #004373; position: relative; display: block; } @media (max-width: 320px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 span.trackabi-solution-h-01 { top: 0px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 span.trackabi-solution-h-01 { top: 0vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 span.trackabi-solution-h-01 { top: 0vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 span.trackabi-solution-h-01 { top: 0px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 span.trackabi-solution-h-01 { top: 0vw; } } @media (min-width: 1240px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 span.trackabi-solution-h-01 { top: 0px; } } @media (max-width: 320px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 span.trackabi-solution-h-02 { top: 0px; left: -5px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 span.trackabi-solution-h-02 { top: 0vw; left: -1.5625vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 span.trackabi-solution-h-02 { top: 0vw; left: -0.91151vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 span.trackabi-solution-h-02 { top: 0px; left: -9px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 span.trackabi-solution-h-02 { top: 0vw; left: -0.72vw; } } @media (min-width: 1240px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 span.trackabi-solution-h-02 { top: 0px; left: -9px; } } @media (max-width: 320px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 span.trackabi-solution-h-03 { top: 0px; left: 2px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 span.trackabi-solution-h-03 { top: 0vw; left: 0.625vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 span.trackabi-solution-h-03 { top: 0.13022vw; left: 0.13022vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 span.trackabi-solution-h-03 { top: 1px; left: 4px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 span.trackabi-solution-h-03 { top: 0.08vw; left: 0.32vw; } } @media (min-width: 1240px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution h1 span.trackabi-solution-h-03 { top: 1px; left: 4px; } } .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution .text { font-family: "LatoRegular", sans-serif; color: #eff5fa; margin: 0; line-height: 1.2; } @media (max-width: 320px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution .text { font-size: 10px; padding: 2px 10px 0 8px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution .text { font-size: 3.125vw; padding: 0.625vw 3.125vw 0 2.5vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution .text { padding: 14px 7px 7px 26px; font-size: 13px; padding: 1.30216vw 0.91151vw 0.91151vw 1.82302vw; font-size: 1.30216vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution .text { padding: 9px 36px 25px 14px; font-size: 13px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution .text { font-size: 1.36vw; padding: 0.88vw 2.88vw 2vw 1.12vw; } } @media (min-width: 1240px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .trackabi-solution .text { font-size: 17px; padding: 11px 36px 25px 14px; } } .twlanding-body .twlanding-top-row .trackabi-solution--section .btn-row .tw-btn { font-size: 24px; width: 252px; float: right; margin-right: 98px; } @media (max-width: 320px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .btn-row .tw-btn { padding-left: 5px; padding-right: 5px; height: 32px; line-height: 32px; margin-right: 42px; font-size: 15px; width: 182px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .btn-row .tw-btn { padding-left: 1.5625vw; padding-right: 1.5625vw; height: 10vw; width: 56.875vw; line-height: 10vw; font-size: 4.6875vw; margin-right: 13.125vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .btn-row .tw-btn { font-size: 15px; width: 154px; height: 34px; line-height: 34px; margin-right: 56px; font-size: 1.95324vw; width: 20.05324vw; height: 4.42734vw; line-height: 4.42734vw; margin-right: 7.29209vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .btn-row .tw-btn { font-size: 20px; width: 206px; height: 46px; line-height: 46px; margin-right: 75px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .twlanding-top-row .trackabi-solution--section .btn-row .tw-btn { font-size: 1.92vw; width: 20.16vw; margin-right: 7.84vw; } } .trackabi-solution { background-image: url("/img/front/top-row/trackabi-solution-gamification.svg"); background-repeat: no-repeat; background-size: 100%; background-position: 0 0; margin-left: 0; position: relative; left: 0; } @media (max-width: 320px) { .trackabi-solution { margin-top: 26px; width: 288px; height: 155px; margin-bottom: 18px; } } @media (min-width: 321px) and (max-width: 735px) { .trackabi-solution { margin-top: 8.125vw; width: 90vw; height: 48.4375vw; margin-bottom: 5.625vw; } } @media (min-width: 736px) and (max-width: 1023px) { .trackabi-solution { width: 39.06475vw; height: 20.83453vw; margin-top: 20px; margin-bottom: 18px; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .trackabi-solution { width: 386px; height: 208px; margin-top: 20px; margin-bottom: 18px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .trackabi-solution { width: 39.68vw; height: 20.8vw; margin-top: 20px; margin-bottom: 18px; } } @media (min-width: 1240px) { .trackabi-solution { width: 496px; height: 260px; margin-top: 20px; margin-bottom: 18px; } } .twlanding-body .twlanding-top-row { position: relative; background-image: url("/img/front/landing-bg/bg-landing--top.svg"); background-repeat: no-repeat; background-size: cover; background-position: 50% -52px; background-size: 2072px; } @media (max-width: 320px) { .twlanding-body .twlanding-top-row { background-position: -366px -60px; background-size: 1482px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-top-row { background-position: -114.375vw -25vw; background-size: 463.125vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .twlanding-top-row { background-position: -315px -10px; background-size: 1420px; background-size: 184.90647vw; background-position: -315px -6.51079vw; } } @media screen and (min-width: 860px) { .twlanding-body .twlanding-top-row { background-position: -345px -7.16187vw; } } @media screen and (min-width: 920px) { .twlanding-body .twlanding-top-row { background-position: -385px -7.81295vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .twlanding-top-row { background-size: 2000px; background-position: -470px -58px; } } @media screen and (min-width: 1026px) { .twlanding-body .twlanding-top-row { background-size: 165.76vw; background-position: -480px -4.8vw; } } @media screen and (min-width: 1060px) { .twlanding-body .twlanding-top-row { background-size: 165.76vw; background-position: -490px -4.8vw; } } @media screen and (min-width: 1120px) { .twlanding-body .twlanding-top-row { background-size: 165.76vw; background-position: -500px -4.8vw; } } @media screen and (min-width: 1180px) and (max-width: 1239px) { .twlanding-body .twlanding-top-row { background-size: 165.76vw; background-position: -510px -5.6vw; } } @media (min-width: 1240px) and (max-width: 1399px) { .twlanding-body .twlanding-top-row { background-size: 2072px; background-position: 50% -52px; } } @media (min-width: 1400px) { .twlanding-body .twlanding-top-row { background-size: 2072px; background-position: 50% -52px; } } .top-row--big-img { -ms-flex-negative: 0; flex-shrink: 0; max-width: none; width: 100%; padding-top: 32px; } .top-row--big-img img { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-drag: none; } @media (max-width: 320px) { .top-row--big-img { padding-top: 0; } } @media (min-width: 321px) and (max-width: 735px) { .top-row--big-img { padding-top: 0; } } @media (max-width: 735px) { .top-row--big-img { margin: auto; } } @media (min-width: 736px) and (max-width: 1023px) { .top-row--big-img { width: 270px; width: 35.15827vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .top-row--big-img { width: 360px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .top-row--big-img { width: 35.04vw; } } @media (min-width: 1240px) { .top-row--big-img { width: 438px; } } .twlanding-body .twlanding-top-row .wrap { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; position: relative; z-index: 1; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: none; flex-wrap: nowrap; } @media (max-width: 320px) { .twlanding-body .twlanding-top-row .wrap { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; padding: 15px 16px 16px 16px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-top-row .wrap { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; padding: 4.6875vw 5vw 5vw 5vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .twlanding-top-row .wrap { padding-top: 18px; padding-bottom: 19px; padding-left: 2.86475vw; padding-right: 1.04173vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .twlanding-top-row .wrap { padding-top: 18px; padding-bottom: 19px; padding-left: 34px; padding-right: 10px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .twlanding-top-row .wrap { padding-top: 18px; padding-bottom: 19px; padding-left: 2.88vw; padding-right: 0.96vw; } } @media (min-width: 1240px) { .twlanding-body .twlanding-top-row .wrap { padding-top: 18px; padding-bottom: 19px; padding-left: 80px; padding-right: 48px; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .features-block { padding-left: 52px; padding-right: 52px; padding-right: 6.77122vw; } } @media screen and (min-width: 1024px) and (max-width: 1342px) { .twlanding-body .features-block { padding-left: 70px; padding-right: 70px; } } .twlanding-body .features-block .wrap { overflow: visible; position: relative; bottom: -24px; } @media (max-width: 320px) { .twlanding-body .features-block .wrap { padding-left: 10px; padding-right: 10px; bottom: -12px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .features-block .wrap { padding-left: 3.125vw; padding-right: 3.125vw; bottom: -12px; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .features-block .wrap { padding-left: 0; padding-right: 0; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .features-block .wrap { padding-left: 0; padding-right: 0; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .features-block .wrap { padding-left: 0; padding-right: 0; } } @media (min-width: 1240px) { .twlanding-body .features-block .wrap { padding-left: 0; padding-right: 0; } } .twlanding-body .features-block .wrap-inner { padding: 0; position: relative; border-radius: 8px; z-index: 2; background-color: #fff; } @media (max-width: 320px) { .twlanding-body .features-block .wrap-inner { padding-top: 10px; padding-bottom: 10px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .features-block .wrap-inner { padding-top: 3.125vw; padding-bottom: 3.125vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .features-block .wrap-inner { padding: 2.60432vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .features-block .wrap-inner { padding: 30px; padding-bottom: 24px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .features-block .wrap-inner { padding: 2.4vw; padding-bottom: 1.92vw; } } @media (min-width: 1240px) { .twlanding-body .features-block .wrap-inner { padding: 30px; padding-bottom: 24px; } } .twlanding-body .features-block .wrap-inner:before { display: block; width: 100%; content: ''; left: 0; position: absolute; background-color: #fff; z-index: 2; height: 20px; border-radius: 0 0 8px 8px; bottom: 6px; } @media (max-width: 320px) { .twlanding-body .features-block .wrap-inner:before { height: 8px; border-radius: 0 0 3px 3px; bottom: 6px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .features-block .wrap-inner:before { height: 8px; border-radius: 0 0 3px 3px; bottom: 6px; } } .twlanding-body .features-block .wrap-inner:after { display: block; content: ''; position: absolute; background-color: #8ab1d4; z-index: 1; width: calc(100% + 20px); bottom: -4px; height: 28px; border-radius: 0 0 16px 16px; left: -10px; } @media (max-width: 320px) { .twlanding-body .features-block .wrap-inner:after { width: calc(100% + 12px); height: 12px; border-radius: 0 0 8px 8px; left: -6px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .features-block .wrap-inner:after { width: calc(100% + 12px); height: 16px; border-radius: 0 0 8px 8px; left: -6px; } } .twlanding-body .features-block .features-items-list { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: stretch; align-items: stretch; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; padding: 0; position: relative; } @media (max-width: 320px) { .twlanding-body .features-block .features-items-list { -ms-flex-direction: column; flex-direction: column; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .features-block .features-items-list { -ms-flex-direction: column; flex-direction: column; } } .twlanding-body .features-block .block { display: block; position: relative; text-decoration: none; cursor: pointer; transition: background-color 0.5s; overflow: visible; width: 33.33%; padding-right: 44px; margin-bottom: 10px; } @media (max-width: 320px) { .twlanding-body .features-block .block { width: 100%; padding-right: 10px; margin-bottom: 10px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .features-block .block { width: 100%; padding-right: 3.125vw; margin-bottom: 3.125vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .features-block .block { min-height: 80px; min-height: 10.41727vw; margin-bottom: 10px; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .features-block .block { min-height: 100px; margin-bottom: 10px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .features-block .block { height: 8.56vw; padding-right: 3.52vw; margin-bottom: 10px; } } @media (min-width: 1240px) { .twlanding-body .features-block .block { height: 107px; padding-right: 44px; margin-bottom: 10px; } } @media (max-width: 320px) { .twlanding-body .features-block .block .feature-description { padding-left: 50px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .features-block .block .feature-description { padding-left: 15.625vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .features-block .block .feature-description { padding-left: 50px; padding-top: 1.30216vw; padding-left: 4.68777vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .features-block .block .feature-description { padding-top: 10px; padding-left: 45px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .features-block .block .feature-description { padding-left: 3.6vw; padding-top: 0.8vw; } } @media (min-width: 1240px) { .twlanding-body .features-block .block .feature-description { padding-left: 45px; padding-top: 10px; } } .twlanding-body .features-block .block h2 { font-family: "LatoRegular", sans-serif; line-height: 1.2; text-align: left; padding: 0; color: #004f88; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; white-space: nowrap; margin: 0 0 2px; } @media (max-width: 320px) { .twlanding-body .features-block .block h2 { font-size: 16px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .features-block .block h2 { font-size: 5vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .features-block .block h2 { font-size: 16px; min-height: 17px; font-size: 1.69281vw; min-height: 2.21367vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .features-block .block h2 { font-size: 18px; min-height: 17px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .features-block .block h2 { font-size: 1.76vw; min-height: 1.36vw; } } @media (min-width: 1200px) { .twlanding-body .features-block .block h2 { font-size: 22px; min-height: 17px; } } @media (min-width: 1300px) { .twlanding-body .features-block .block h2 { font-size: 24px; min-height: 17px; } } .twlanding-body .features-block .block p { font-family: "LatoRegular", sans-serif; font-size: 16px; color: #3f3f3f; margin: 0; } @media (max-width: 320px) { .twlanding-body .features-block .block p { font-size: 12px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .features-block .block p { font-size: 3.75vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .features-block .block p { font-size: 9px; font-size: 1.17194vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .features-block .block p { font-size: 12px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .features-block .block p { font-size: 1.2vw; } } @media (min-width: 1240px) { .twlanding-body .features-block .block p { font-size: 15px; } } .ico-block { position: absolute; height: 80px; width: 80px; top: 0; left: 0; display: -ms-flexbox; display: flex; -ms-flex-align: baseline; align-items: baseline; -ms-flex-pack: center; justify-content: center; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } @media (max-width: 320px) { .ico-block { height: 50px; width: 50px; } } @media (min-width: 321px) and (max-width: 735px) { .ico-block { height: 15.625vw; width: 15.625vw; } } @media (min-width: 736px) and (max-width: 1023px) { .ico-block { height: 50px; width: 50px; height: 6.51079vw; width: 6.51079vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .ico-block { height: 64px; width: 64px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .ico-block { height: 6.4vw; width: 6.4vw; } } .ico-block .tw-front-font-icon { color: #004f88; position: relative; top: 0; } @media (max-width: 320px) { .ico-block .tw-front-font-icon { font-size: 26px; } } @media (min-width: 321px) and (max-width: 735px) { .ico-block .tw-front-font-icon { font-size: 8.125vw; } } @media (min-width: 736px) and (max-width: 1023px) { .ico-block .tw-front-font-icon { font-size: 3.12518vw; top: 0.26043vw; left: -1.04173vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .ico-block .tw-front-font-icon { font-size: 24px; top: 2px; left: -8px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .ico-block .tw-front-font-icon { font-size: 2.56vw; top: 0.16vw; left: -1.44vw; } } @media (min-width: 1240px) { .ico-block .tw-front-font-icon { font-size: 30px; top: 4px; left: -18px; } } .features-bg--top-left { background-image: url("/img/front/landing-bg/homepage-tl.svg"); background-repeat: no-repeat; position: absolute; z-index: 1; background-position: 0 0; background-size: 274px; width: 274px; height: 28px; top: -28px; left: 65px; } @media (max-width: 320px) { .features-bg--top-left { display: none; } } @media (min-width: 321px) and (max-width: 735px) { .features-bg--top-left { display: none; } } @media (min-width: 736px) and (max-width: 1023px) { .features-bg--top-left { background-size: 25.00144vw; width: 25.00144vw; height: 2.86475vw; top: -2.34388vw; left: 5.33885vw; } } .features-bg--bottom-left { background-image: url("/img/front/landing-bg/homepage-lb.svg"); background-repeat: no-repeat; background-position: 0 0; position: absolute; z-index: 1; background-size: 48px; width: 48px; height: 204px; bottom: 24px; left: -48px; } @media (max-width: 320px) { .features-bg--bottom-left { display: none; } } @media (min-width: 321px) and (max-width: 735px) { .features-bg--bottom-left { display: none; } } @media (min-width: 736px) and (max-width: 1023px) { .features-bg--bottom-left { width: 48px; height: 170px; background-size: 48px; left: -3.64604vw; bottom: 24px; } } .features-bg--top-right { background-image: url("/img/front/landing-bg/homepage-tr.svg"); background-repeat: no-repeat; position: absolute; z-index: 1; background-position: 0 0; background-size: 580px; width: 580px; height: 346px; top: -56px; right: -34px; } @media (max-width: 320px) { .features-bg--top-right { display: none; } } @media (min-width: 321px) and (max-width: 735px) { .features-bg--top-right { display: none; } } @media (min-width: 736px) and (max-width: 1023px) { .features-bg--top-right { background-size: 69.53525vw; width: 69.53525vw; height: 34.37698vw; top: -5.7295vw; right: -3.64604vw; } } .browser-image--component { display: inline-block; border-radius: 8px; overflow: hidden; box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.1); margin: 0px 17px 10px 17px; max-width: 100%; border: 1px solid #ededed; } @media (max-width: 735px) { .browser-image--component { margin: 12px 11px; max-width: 100%; } } .browser-image--component img { border-radius: 0 0 8px 8px; display: block; } .browser-image--component .browser-top { background-color: #fcfcfc; border-bottom: 1px solid #e2e2e2; position: relative; height: 20px; } @media screen and (max-width: 735px) { .browser-image--component .browser-top { height: 12px; } } .browser-image--component .browser-top .rounder { position: absolute; display: block; top: 6px; left: 8px; } .browser-image--component .browser-top .rounder .round { border-radius: 50%; width: 8px; height: 8px; margin-right: 5px; float: left; display: block; } @media screen and (max-width: 735px) { .browser-image--component .browser-top .rounder .round { width: 4px; height: 4px; margin-right: 3px; } } .browser-image--component .browser-top .rounder .round.red { background-color: #ff1a1a; } .browser-image--component .browser-top .rounder .round.yellow { background-color: #ffb11a; } .browser-image--component .browser-top .rounder .round.green { background-color: #00af12; } @media screen and (max-width: 735px) { .browser-image--component .browser-top { height: 12px; } .browser-image--component .browser-top .rounder { position: absolute; display: block; top: 4px; left: 6px; } .browser-image--component .browser-top .rounder .round { width: 4px; height: 4px; margin-right: 3px; } } .browser-image--component.small .browser-top { height: 12px; } .browser-image--component.small .browser-top .rounder { position: absolute; display: block; top: 4px; left: 6px; } .browser-image--component.small .browser-top .rounder .round { width: 4px; height: 4px; margin-right: 3px; } .twlanding-body #benefits--section { background-color: transparent; } @media (min-width: 1024px) and (max-width: 1239px) { .twlanding-body #benefits--section { padding-left: 40px; padding-right: 40px; } } @media screen and (min-width: 1240px) { .twlanding-body #benefits--section { padding-left: 19px; } } .twlanding-body #benefits--section .tw-container { padding-top: 0; margin-bottom: 0; } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body #benefits--section .tw-container { padding-top: 27px; padding-top: 3.51583vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body #benefits--section .tw-container { padding-top: 40px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body #benefits--section .tw-container { padding-top: 3.2vw; } } @media screen and (min-width: 1240px) { .twlanding-body #benefits--section .tw-container { padding-top: 40px; } } .twlanding-body #benefits--section .tw-columns { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: justify; justify-content: space-between; } @media (max-width: 320px) { .twlanding-body #benefits--section .tw-columns { -ms-flex-direction: column; flex-direction: column; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body #benefits--section .tw-columns { -ms-flex-direction: column; flex-direction: column; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body #benefits--section .tw-columns { padding-left: 30px; padding-right: 30px; padding-left: 3.90647vw; padding-right: 3.90647vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body #benefits--section .tw-columns { padding-left: 64px; padding-right: 54px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body #benefits--section .tw-columns { padding-left: 5.12vw; padding-right: 4.32vw; } } @media screen and (min-width: 1240px) { .twlanding-body #benefits--section .tw-columns { padding-left: 70px; padding-right: 70px; } } .twlanding-body #benefits--section .tw-columns .tw-col--main h2 { color: #004f88; line-height: 1.2; padding: 0; margin: 0; margin-bottom: 6px; } @media (max-width: 320px) { .twlanding-body #benefits--section .tw-columns .tw-col--main h2 { font-size: 30px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body #benefits--section .tw-columns .tw-col--main h2 { font-size: 9.375vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body #benefits--section .tw-columns .tw-col--main h2 { font-size: 40px; margin-bottom: 6px; font-size: 5.20863vw; margin-bottom: 0.78129vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body #benefits--section .tw-columns .tw-col--main h2 { font-size: 50px; margin-bottom: 6px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body #benefits--section .tw-columns .tw-col--main h2 { font-size: 4vw; margin-bottom: 0.48vw; } } @media screen and (min-width: 1240px) { .twlanding-body #benefits--section .tw-columns .tw-col--main h2 { margin-bottom: 6px; font-size: 56px; } } .twlanding-body #benefits--section .tw-columns .tw-col--main p { color: #004f88; line-height: 1; margin: 0; } @media (max-width: 320px) { .twlanding-body #benefits--section .tw-columns .tw-col--main p { font-size: 22px; text-align: center; margin-bottom: 20px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body #benefits--section .tw-columns .tw-col--main p { font-size: 6.875vw; text-align: center; margin-bottom: 6.25vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body #benefits--section .tw-columns .tw-col--main p { margin-bottom: 20px; font-size: 28px; margin-bottom: 2.60432vw; font-size: 3.64604vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body #benefits--section .tw-columns .tw-col--main p { margin-bottom: 24px; font-size: 32px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body #benefits--section .tw-columns .tw-col--main p { margin-bottom: 1.92vw; font-size: 2.56vw; } } @media screen and (min-width: 1240px) { .twlanding-body #benefits--section .tw-columns .tw-col--main p { margin-bottom: 30px; font-size: 40px; } } .twlanding-body #benefits--section .tw-columns .tw-col--main .button-row { padding-left: 0; } @media (max-width: 320px) { .twlanding-body #benefits--section .tw-columns .tw-col--main .button-row { text-align: center; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body #benefits--section .tw-columns .tw-col--main .button-row { text-align: center; } } .twlanding-body #benefits--section .tw-columns .tw-col--secondary { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; } @media (max-width: 320px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary { padding-top: 32px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary { padding-top: 10vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary { padding-top: 16px; padding-top: 2.08345vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary { padding-top: 16px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary { padding-top: 1.28vw; } } @media screen and (min-width: 1240px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary { padding-top: 16px; } } @media (max-width: 320px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary .img-block { width: 70px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary .img-block { width: 21.875vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary .img-block { width: 80px; padding-top: 17px; width: 10.41727vw; padding-top: 2.21367vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary .img-block { width: 84px; padding-top: 17px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary .img-block { width: 6.72vw; padding-top: 1.36vw; } } @media screen and (min-width: 1240px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary .img-block { width: 98px; padding-top: 14px; left: 3px; position: relative; } } .twlanding-body #benefits--section .tw-columns .tw-col--secondary .img-block img { width: 100%; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-drag: none; } .twlanding-body #benefits--section .tw-columns .tw-col--secondary .text-block { text-align: left; } @media (max-width: 320px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary .text-block { padding-left: 20px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary .text-block { padding-left: 6.25vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary .text-block { padding-left: 22px; padding-left: 2.86475vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary .text-block { padding-left: 26px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary .text-block { padding-left: 2.08vw; } } @media screen and (min-width: 1240px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary .text-block { padding-left: 32px; } } .twlanding-body #benefits--section .tw-columns .tw-col--secondary .text-block span { color: #3f3f3f; display: block; line-height: 1.2; } @media (max-width: 320px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary .text-block span { font-size: 12px; margin-bottom: 8px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary .text-block span { font-size: 3.75vw; margin-bottom: 2.5vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary .text-block span { font-size: 14px; margin-bottom: 18px; font-size: 1.82302vw; margin-bottom: 2.34388vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary .text-block span { font-size: 14px; margin-bottom: 18px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary .text-block span { font-size: 1.12vw; margin-bottom: 1.44vw; } } @media screen and (min-width: 1240px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary .text-block span { font-size: 14px; margin-bottom: 18px; } } .twlanding-body #benefits--section .tw-columns .tw-col--secondary .text-block p { margin: 0; color: #3e3e3e; line-height: 1.2; } @media (max-width: 320px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary .text-block p { font-size: 16px; margin-bottom: 8px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary .text-block p { font-size: 5vw; margin-bottom: 2.5vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary .text-block p { font-size: 18px; margin-bottom: 12px; font-size: 2.34388vw; margin-bottom: 1.56259vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary .text-block p { font-size: 20px; margin-bottom: 14px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary .text-block p { font-size: 1.6vw; margin-bottom: 1.12vw; } } @media screen and (min-width: 1240px) { .twlanding-body #benefits--section .tw-columns .tw-col--secondary .text-block p { font-size: 22px; margin-bottom: 14px; } } .twlanding-body #benefits--section .tw-columns .tw-col--secondary .text-block p:last-of-type { margin-bottom: 0; } .twlanding-body .product-tour--images { position: relative; text-align: center; } @media (max-width: 320px) { .twlanding-body .product-tour--images { margin-bottom: -20px; height: 180px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .product-tour--images { margin-bottom: -6.25vw; height: 56.25vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .product-tour--images { height: 280px; height: 36.46043vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .product-tour--images { height: 280px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .product-tour--images { height: 22.4vw; } } @media (min-width: 1240px) { .twlanding-body .product-tour--images { height: 294px; } } .twlanding-body .product-tour--images .browser-image--component { position: absolute; z-index: 1; box-shadow: 0px 0 20px 0px rgba(0, 0, 0, 0.1); } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .product-tour--images .browser-image--component { top: 56px; top: 7.29209vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .product-tour--images .browser-image--component { top: 56px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .product-tour--images .browser-image--component { top: 4.48vw; } } @media (min-width: 1240px) { .twlanding-body .product-tour--images .browser-image--component { top: 56px; } } .twlanding-body .product-tour--images .browser-image--component img { width: 100%; height: auto; display: block; } .twlanding-body .product-tour--images .browser-image--component .tw-img-wrap { width: 489px; height: 275px; } @media (max-width: 320px) { .twlanding-body .product-tour--images .browser-image--component .tw-img-wrap { width: 100%; height: auto; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .product-tour--images .browser-image--component .tw-img-wrap { width: 100%; height: auto; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .product-tour--images .browser-image--component .tw-img-wrap { width: 63.67554vw; height: 35.80935vw; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .product-tour--images .browser-image--component .tw-img-wrap { width: 39.12vw; height: 22vw; } } .twlanding-body .product-tour--images .browser-image--component:nth-child(1) { left: 0; box-shadow: -5px 0 20px 0px rgba(0, 0, 0, 0.1); } @media (max-width: 320px) { .twlanding-body .product-tour--images .browser-image--component:nth-child(1) { left: -50px; bottom: 0px; width: 200px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .product-tour--images .browser-image--component:nth-child(1) { left: -15.625vw; bottom: 0; width: 62.5vw; } } @media screen and (min-width: 1240px) { .twlanding-body .product-tour--images .browser-image--component:nth-child(1) { left: -16px; } } .twlanding-body .product-tour--images .browser-image--component:nth-child(2) { position: relative; z-index: 2; } @media (max-width: 320px) { .twlanding-body .product-tour--images .browser-image--component:nth-child(2) { bottom: -20px; width: 200px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .product-tour--images .browser-image--component:nth-child(2) { bottom: -9.375vw; width: 81.25vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .product-tour--images .browser-image--component:nth-child(2) { margin: auto; top: 28px; top: 3.64604vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .product-tour--images .browser-image--component:nth-child(2) { margin: auto; top: 28px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .product-tour--images .browser-image--component:nth-child(2) { margin: auto; top: 2.24vw; } } @media screen and (min-width: 1240px) { .twlanding-body .product-tour--images .browser-image--component:nth-child(2) { margin: auto; top: 28px; } } .twlanding-body .product-tour--images .browser-image--component:nth-child(3) { right: 0; box-shadow: 5px 0 20px 0px rgba(0, 0, 0, 0.1); } @media (max-width: 320px) { .twlanding-body .product-tour--images .browser-image--component:nth-child(3) { right: -50px; top: auto; bottom: 0px; width: 200px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .product-tour--images .browser-image--component:nth-child(3) { right: -15.625vw; top: auto; bottom: 0; width: 62.5vw; } } @media screen and (min-width: 1240px) { .twlanding-body .product-tour--images .browser-image--component:nth-child(3) { right: -16px; } } #tw-desktop-app .browser-image { margin-top: 20px; margin-bottom: 35px; } #tw-desktop-app .browser-image .tw-img-wrap { position: relative; background-color: #fff; } #tw-desktop-app .browser-image img { max-width: 100%; } #tw-desktop-app .browser-image .tw-current-date { position: absolute; top: 4.9%; left: 0; width: 100%; text-align: center; font-size: 19px; line-height: 1; white-space: nowrap; color: #3e4145; } @media (min-width: 736px) and (max-width: 1239px) { #tw-desktop-app .browser-image .tw-current-date { font-size: 1.53vw; top: 5.1%; } } @media (max-width: 600px) { #tw-desktop-app .browser-image .tw-current-date { font-size: 3.27vw; top: 5.1%; } } #tw-desktop-app .browser-image .tw-time-log-line { position: absolute; top: 0; left: 0; height: 100%; width: 100%; overflow: hidden; } #tw-desktop-app .browser-image .tw-time-log-line img { height: 100%; max-width: none; } #tw-desktop-app .browser-image .tw-current-time { position: absolute; top: 0; left: 0; height: 100%; } #tw-desktop-app .browser-image .tw-current-time:before { content: ''; display: block; position: absolute; top: 15.6%; right: 0; height: 12%; width: 1px; background-color: #004373; opacity: 0.2; } #tw-desktop-app .browser-image .tw-time-container { position: absolute; top: 38.7%; left: 0; width: 100%; font-size: 12.3px; line-height: 1; color: #414347; } @media (min-width: 736px) and (max-width: 1239px) { #tw-desktop-app .browser-image .tw-time-container { font-size: 1.13vw; } } @media (max-width: 600px) { #tw-desktop-app .browser-image .tw-time-container { font-size: 2vw; } } #tw-desktop-app .browser-image .tw-time-container > * { position: absolute; } #tw-desktop-app .browser-image .tw-time-container .tw-start-time { left: 42.8%; } #tw-desktop-app .browser-image .tw-time-container .tw-end-time { left: 56.6%; color: #8d999f; } #tw-desktop-app .browser-image .tw-timer { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: left; justify-content: left; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; position: absolute; top: 193px; width: 100%; font-size: 25px; color: #2878b7; padding-left: 45px; } @media (min-width: 736px) and (max-width: 1239px) { #tw-desktop-app .browser-image .tw-timer { font-size: 1.9vw; padding-left: 3.7vw; top: 35.9%; } } @media (min-width: 601px) and (max-width: 735px) { #tw-desktop-app .browser-image .tw-timer { top: 192px; font-size: 26px; } } @media (max-width: 600px) { #tw-desktop-app .browser-image .tw-timer { top: 30.9vw; font-size: 4.1vw; padding-left: 7.5vw; } } @media (max-width: 470px) { #tw-desktop-app .browser-image .tw-timer { top: 32.6vw; font-size: 3.9vw; } } @media (max-width: 400px) { #tw-desktop-app .browser-image .tw-timer { top: 32.7vw; font-size: 3.8vw; } } @media (max-width: 340px) { #tw-desktop-app .browser-image .tw-timer { top: 31.1vw; font-size: 3.7vw; } } .tw-landing-available-for { background-color: #fff; display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-align: center; align-items: center; -ms-flex-pack: justify; justify-content: space-between; height: 40px; width: 322px; border-radius: 6px; padding: 0 19px 0 17px; margin-bottom: 25px; } @media (max-width: 320px) { .tw-landing-available-for { height: 40px; width: 100%; border-radius: 6px; padding: 0 19px 0 17px; margin-bottom: 22px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-landing-available-for { width: 100%; padding: 0 5.9375vw 0 5.3125vw; height: 12.5vw; border-radius: 1.875vw; margin-bottom: 6.875vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-landing-available-for { margin-bottom: 34px; width: 41.9295vw; padding: 0 2.4741vw 0 2.21367vw; height: 5.20863vw; border-radius: 0.78129vw; margin-bottom: 1.82302vw; } } @media screen and (min-width: 1024px) and (max-width: 1026px) { .tw-landing-available-for { margin-bottom: 24px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-landing-available-for { width: 25.76vw; padding: 0 1.52vw 0 2.21367vw; height: 3.2vw; border-radius: 0.48vw; margin-bottom: 3.52vw; } } .tw-landing-available-for .tw-landing-available-for--title { color: #4679a9; font-size: 18px; } @media (max-width: 320px) { .tw-landing-available-for .tw-landing-available-for--title { font-size: 16px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-landing-available-for .tw-landing-available-for--title { font-size: 5vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-landing-available-for .tw-landing-available-for--title { font-size: 2.34388vw; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-landing-available-for .tw-landing-available-for--title { font-size: 1.44vw; } } .tw-landing-available-for .tw-platforms { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; } .tw-landing-available-for .tw-platforms img { display: block; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-drag: none; } .tw-landing-available-for .tw-platforms .windows { height: 27px; } @media (min-width: 321px) and (max-width: 735px) { .tw-landing-available-for .tw-platforms .windows { height: 8.4375vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-landing-available-for .tw-platforms .windows { height: 3.51583vw; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-landing-available-for .tw-platforms .windows { height: 2.16vw; } } .tw-landing-available-for .tw-platforms .linux { height: 31px; margin: 0 20px; } @media (max-width: 320px) { .tw-landing-available-for .tw-platforms .linux { margin: 0 10px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-landing-available-for .tw-platforms .linux { height: 9.6875vw; margin: 0 3.125vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-landing-available-for .tw-platforms .linux { height: 4.03669vw; margin: 0 2.60432vw; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-landing-available-for .tw-platforms .linux { height: 2.48vw; margin: 0 1.6vw; } } .tw-landing-available-for .tw-platforms .mac { height: 16px; } @media (min-width: 321px) and (max-width: 735px) { .tw-landing-available-for .tw-platforms .mac { height: 5vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-landing-available-for .tw-platforms .mac { height: 2.08345vw; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-landing-available-for .tw-platforms .mac { height: 1.28vw; } } #tw-desktop-app--landing { position: relative; } @media (min-width: 736px) and (max-width: 1023px) { #tw-desktop-app--landing { height: 61.20144vw; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { #tw-desktop-app--landing { height: 49.52vw; } } @media screen and (min-width: 1240px) { #tw-desktop-app--landing { height: 619px; } } #tw-desktop-app--landing:after { position: absolute; z-index: 1; display: block; content: ''; left: 0; width: 100%; height: 66px; background-color: #fff; } @media (min-width: 321px) and (max-width: 735px) { #tw-desktop-app--landing:after { height: 15.625vw; bottom: -8.125vw; } } @media (min-width: 736px) and (max-width: 1023px) { #tw-desktop-app--landing:after { height: 13.80288vw; top: 47.91942vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { #tw-desktop-app--landing:after { height: 37px; top: 505px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { #tw-desktop-app--landing:after { height: 5.28vw; top: 45.76vw; } } @media screen and (min-width: 1240px) { #tw-desktop-app--landing:after { height: 66px; bottom: 0; } } #tw-desktop-app--landing #tw-desktop-app .browser-image { margin: 0; } #tw-desktop-app--landing .wrap { border-top: 10px solid #8ab1d4; position: relative; z-index: 2; overflow: visible; } #tw-desktop-app--landing .wrap:before { display: block; content: ''; background-color: #8ab1d4; position: absolute; left: -10px; top: -10px; width: calc(100% + 20px); height: 10px; } @media (max-width: 320px) { #tw-desktop-app--landing .tw-container { margin-top: 30px; } } @media (min-width: 321px) and (max-width: 735px) { #tw-desktop-app--landing .tw-container { margin-top: 9.375vw; } } @media (min-width: 736px) and (max-width: 1023px) { #tw-desktop-app--landing .tw-container { margin-bottom: 0; margin-top: 6.90144vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { #tw-desktop-app--landing .tw-container { margin-top: 53px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { #tw-desktop-app--landing .tw-container { margin-bottom: 0; margin-top: 4.24vw; } } @media screen and (min-width: 1240px) { #tw-desktop-app--landing .tw-container { margin-bottom: 0; margin-top: 53px; } } #tw-desktop-app--landing .tw-desktop-app--landing-description { padding-top: 29px; } @media (min-width: 736px) and (max-width: 1023px) { #tw-desktop-app--landing .tw-desktop-app--landing-description { padding-left: 6px; padding-top: 10px; padding-left: 0.78129vw; padding-top: 1.30216vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { #tw-desktop-app--landing .tw-desktop-app--landing-description { padding-left: 26px; padding-top: 29px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { #tw-desktop-app--landing .tw-desktop-app--landing-description { padding-left: 2.08vw; padding-top: 2.32vw; } } @media screen and (min-width: 1240px) { #tw-desktop-app--landing .tw-desktop-app--landing-description { padding-left: 56px; padding-top: 29px; } } #tw-desktop-app--landing .tw-desktop-app--landing-description h2 { margin-bottom: 18px; text-align: left; line-height: 1.2; } @media (max-width: 320px) { #tw-desktop-app--landing .tw-desktop-app--landing-description h2 { text-align: center; } } @media (min-width: 321px) and (max-width: 735px) { #tw-desktop-app--landing .tw-desktop-app--landing-description h2 { margin-bottom: 5.625vw; text-align: center; } } @media (min-width: 736px) and (max-width: 1023px) { #tw-desktop-app--landing .tw-desktop-app--landing-description h2 { margin-bottom: 18px; margin-bottom: 2.34388vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { #tw-desktop-app--landing .tw-desktop-app--landing-description h2 { font-size: 36px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { #tw-desktop-app--landing .tw-desktop-app--landing-description h2 { margin-bottom: 0.64vw; font-size: 2.88vw; } } @media screen and (min-width: 1240px) { #tw-desktop-app--landing .tw-desktop-app--landing-description h2 { margin-bottom: 8px; font-size: 42px; } } #tw-desktop-app--landing .tw-desktop-app--landing-description p { font-size: 16px; } @media (min-width: 321px) and (max-width: 735px) { #tw-desktop-app--landing .tw-desktop-app--landing-description p { font-size: 2.8125vw; } } @media (min-width: 736px) and (max-width: 1023px) { #tw-desktop-app--landing .tw-desktop-app--landing-description p { font-size: 14px; font-size: 1.82302vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { #tw-desktop-app--landing .tw-desktop-app--landing-description p { font-size: 14px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { #tw-desktop-app--landing .tw-desktop-app--landing-description p { font-size: 1.28vw; } } @media (min-width: 736px) and (max-width: 1023px) { #tw-desktop-app--landing .tw-desktop-app--landing-description .tw-btn-big { margin-left: 18px; margin-left: 2.34388vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { #tw-desktop-app--landing .tw-desktop-app--landing-description .tw-btn-big { margin-left: 18px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { #tw-desktop-app--landing .tw-desktop-app--landing-description .tw-btn-big { margin-left: 1.44vw; } } @media screen and (min-width: 1240px) { #tw-desktop-app--landing .tw-desktop-app--landing-description .tw-btn-big { margin-left: 18px; } } #tw-desktop-app--landing .row { -ms-flex-pack: center; justify-content: center; } #tw-desktop-app--landing .row .col-sm-2 { -ms-flex-negative: 0; flex-shrink: 0; max-width: 564px; } @media (max-width: 600px) { #tw-desktop-app--landing .row .col-sm-2 { max-width: 100%; width: 100%; } } @media (max-width: 850px) { #tw-desktop-app--landing .row { -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: center; justify-content: center; } } @media screen and (min-width: 1024px) { #tw-desktop-app--landing #tw-desktop-app { position: relative; right: -14px; } } .congrats { width: 100% !important; height: 100% !important; position: absolute; top: 0px; left: 0px; z-index: 2; overflow: hidden; } .twlanding-gamification .wrap { position: relative; } .twlanding-body .twlanding-gamification { padding-top: 0px; padding-bottom: 60px; position: relative; z-index: 1; background-color: transparent; } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .twlanding-gamification { padding-top: 70px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .twlanding-gamification { padding-top: 70px; } } @media screen and (min-width: 1240px) { .twlanding-body .twlanding-gamification { padding-top: 70px; } } .twlanding-body .twlanding-gamification .tw-gamification-heading { text-align: center; } .twlanding-body .twlanding-gamification .tw-gamification-heading h2 { margin-bottom: 18px; padding: 0; line-height: 1.2; } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-gamification .tw-gamification-heading h2 { margin-bottom: 5.625vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .twlanding-gamification .tw-gamification-heading h2 { margin-bottom: 18px; margin-bottom: 2.34388vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .twlanding-gamification .tw-gamification-heading h2 { font-size: 36px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .twlanding-gamification .tw-gamification-heading h2 { margin-bottom: 0.64vw; font-size: 2.88vw; } } @media screen and (min-width: 1240px) { .twlanding-body .twlanding-gamification .tw-gamification-heading h2 { margin-bottom: 8px; font-size: 42px; } } .twlanding-body .twlanding-gamification .tw-gamification-heading p { margin: 0; margin-bottom: 18px; line-height: 1.2; font-family: "LatoBold"; color: #3f3f3f; } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-gamification .tw-gamification-heading p { margin-bottom: 6.25vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .twlanding-gamification .tw-gamification-heading p { margin-bottom: 20px; font-size: 20px; margin-bottom: 2.60432vw; font-size: 2.60432vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .twlanding-gamification .tw-gamification-heading p { font-size: 26px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .twlanding-gamification .tw-gamification-heading p { margin-bottom: 2.08vw; font-size: 2.24vw; } } @media screen and (min-width: 1240px) { .twlanding-body .twlanding-gamification .tw-gamification-heading p { margin-bottom: 26px; font-size: 34px; } } .twlanding-body .twlanding-gamification .tw-gamification--columns { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: justify; justify-content: space-between; max-width: 980px; padding-top: 8px; margin: auto; } @media (min-width: 736px) { .twlanding-body .twlanding-gamification .tw-gamification--columns { -ms-flex-direction: row; flex-direction: row; } } .twlanding-body .twlanding-gamification .tw-gamification--columns .tw-gamification--greeting-img { position: relative; } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .twlanding-gamification .tw-gamification--columns .tw-gamification--greeting-img { width: 370px; margin-top: 10px; width: 48.17986vw; margin-top: 1.30216vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .twlanding-gamification .tw-gamification--columns .tw-gamification--greeting-img { width: 458px; margin-top: 12px; margin-bottom: 0; } } @media screen and (min-width: 1026px) { .twlanding-body .twlanding-gamification .tw-gamification--columns .tw-gamification--greeting-img { padding-left: 10px; width: 530px; margin-top: 1px; margin-bottom: 0; } } .twlanding-body .twlanding-gamification .tw-gamification--columns .tw-gamification--rewards { overflow: hidden; } .twlanding-body .twlanding-gamification .tw-gamification--columns .tw-check-list--gamification--golden { float: left; padding-top: 10px; } @media (max-width: 320px) { .twlanding-body .twlanding-gamification .tw-gamification--columns .tw-check-list--gamification--golden { margin-top: 30px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-gamification .tw-gamification--columns .tw-check-list--gamification--golden { margin-top: 9.375vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .twlanding-gamification .tw-gamification--columns .tw-check-list--gamification--golden { padding-top: 0; } } .twlanding-body .twlanding-gamification .tw-gamification--columns .tw-gamification--rewards-img { float: left; } @media (max-width: 320px) { .twlanding-body .twlanding-gamification .tw-gamification--columns .tw-gamification--rewards-img { width: 78px; margin: 30px 0 10px 30px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .twlanding-gamification .tw-gamification--columns .tw-gamification--rewards-img { width: 24.375vw; margin: 9.375vw 0 3.125vw 9.375vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .twlanding-gamification .tw-gamification--columns .tw-gamification--rewards-img { width: 118px; padding-left: 20px; width: 15.36547vw; padding-left: 2.60432vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .twlanding-gamification .tw-gamification--columns .tw-gamification--rewards-img { width: 140px; padding-left: 0px; margin-right: 18px; } } @media screen and (min-width: 1026px) { .twlanding-body .twlanding-gamification .tw-gamification--columns .tw-gamification--rewards-img { width: 140px; padding-left: 0px; margin-right: 18px; } } .twlanding-body .twlanding-gamification .tw-gamification--columns .tw-gamification--rewards-img img { width: 100%; } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .twlanding-gamification .tw-gamification--columns .tw-gamification--list-section { width: 350px; width: 45.57554vw; } } @media screen and (min-width: 1024px) { .twlanding-body .twlanding-gamification .tw-gamification--columns .tw-gamification--list-section { width: 435px; padding-left: 10px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .twlanding-gamification .tw-gamification--columns .tw-gamification--list-section { padding-left: 3.2vw; } } @media (min-width: 1240px) { .twlanding-body .twlanding-gamification .tw-gamification--columns .tw-gamification--list-section { padding-left: 40px; } } .twlanding-body .twlanding-gamification .btn-row { text-align: center; padding-top: 20px; position: relative; z-index: 2; } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .twlanding-gamification .btn-row { padding-top: 20px; padding-top: 2.60432vw; } } @media screen and (min-width: 1024px) { .twlanding-body .twlanding-gamification .btn-row { padding-top: 43px; } } .twlanding-body .twlanding-gamification .btn-row .tw-btn { margin: auto; } .tw-landing-available-for.for-mobile { margin-bottom: 0px; width: 240px; } @media (max-width: 320px) { .tw-landing-available-for.for-mobile { width: 100%; } } @media (min-width: 321px) and (max-width: 735px) { .tw-landing-available-for.for-mobile { width: 100%; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-landing-available-for.for-mobile { width: 31.2518vw; padding: 0 1.82302vw 0 1.95324vw; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-landing-available-for.for-mobile { width: 19.2vw; padding: 0 1.12vw 0 1.2vw; } } @media screen and (min-width: 1240px) { .tw-landing-available-for.for-mobile { padding: 0 14px 0 15px; } } .tw-landing-available-for.for-mobile .tw-platforms .ios { height: 18px; } @media (min-width: 321px) and (max-width: 735px) { .tw-landing-available-for.for-mobile .tw-platforms .ios { height: 5.625vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-landing-available-for.for-mobile .tw-platforms .ios { height: 2.34388vw; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-landing-available-for.for-mobile .tw-platforms .ios { height: 1.44vw; } } .tw-landing-available-for.for-mobile .tw-platforms .android { height: 22px; margin-right: 0; margin-left: 15px; } @media (max-width: 320px) { .tw-landing-available-for.for-mobile .tw-platforms .android { margin-right: 0; margin-left: 10px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-landing-available-for.for-mobile .tw-platforms .android { height: 6.875vw; margin-right: 0; margin-left: 3.125vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-landing-available-for.for-mobile .tw-platforms .android { height: 2.86475vw; margin-right: 0; margin-left: 1.95324vw; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-landing-available-for.for-mobile .tw-platforms .android { height: 1.76vw; margin-right: 0; margin-left: 1.2vw; } } #tw-mobile-app--landing { position: relative; } #tw-mobile-app--landing:after { position: absolute; z-index: 1; display: block; content: ''; bottom: 0; left: 0; width: 100%; height: 66px; background-color: #fff; } @media screen and (min-width: 1024px) and (max-width: 1026px) { #tw-mobile-app--landing:after { height: 25px; bottom: -1px; } } @media (max-width: 320px) { #tw-mobile-app--landing:after { height: 22px; } } @media (min-width: 321px) and (max-width: 735px) { #tw-mobile-app--landing:after { height: 6.875vw; } } #tw-mobile-app--landing .tw-container { margin-bottom: 0; } @media (max-width: 735px) { #tw-mobile-app--landing .tw-container { margin-bottom: 30px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { #tw-mobile-app--landing .tw-container { margin-top: 2.24vw; } } @media (min-width: 1240px) { #tw-mobile-app--landing .tw-container { margin-top: 28px; } } #tw-mobile-app--landing .wrap { border-top: 10px solid #eef6ff; position: relative; z-index: 2; overflow: visible; } #tw-mobile-app--landing .wrap:before { display: block; content: ''; background-color: #8ab1d4; position: absolute; left: -10px; top: -10px; width: calc(100% + 20px); height: 10px; } #tw-mobile-app--landing .section--centered { margin: auto; overflow: hidden; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-align: center; align-items: center; } @media (min-width: 736px) { #tw-mobile-app--landing .section--centered { -ms-flex-direction: row; flex-direction: row; -ms-flex-align: start; align-items: flex-start; -ms-flex-pack: center; justify-content: center; } } @media (min-width: 736px) and (max-width: 1023px) { #tw-mobile-app--landing .section--centered { height: 400px; height: 49.48201vw; } } @media screen and (min-width: 1024px) { #tw-mobile-app--landing .section--centered { height: 438px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { #tw-mobile-app--landing .section--centered { height: 46.8vw; } } @media screen and (min-width: 1240px) { #tw-mobile-app--landing .section--centered { width: 100%; height: 585px; } } #tw-mobile-app--landing .tw-mobile-app--landing-description { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: justify; justify-content: space-between; } @media (min-width: 736px) { #tw-mobile-app--landing .tw-mobile-app--landing-description { min-height: 100%; } } @media (min-width: 736px) and (max-width: 1023px) { #tw-mobile-app--landing .tw-mobile-app--landing-description { padding-top: 20px; padding-top: 2.60432vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { #tw-mobile-app--landing .tw-mobile-app--landing-description { padding-top: 38px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { #tw-mobile-app--landing .tw-mobile-app--landing-description { padding-top: 3.04vw; padding-left: 1.76vw; margin-top: 1.92vw; } } @media screen and (min-width: 1240px) { #tw-mobile-app--landing .tw-mobile-app--landing-description { padding-top: 38px; padding-left: 22px; margin-top: 24px; } } #tw-mobile-app--landing .tw-mobile-app--landing-description h2 { margin-bottom: 18px; text-align: left; line-height: 1.2; } @media (max-width: 320px) { #tw-mobile-app--landing .tw-mobile-app--landing-description h2 { text-align: center; } } @media (min-width: 321px) and (max-width: 735px) { #tw-mobile-app--landing .tw-mobile-app--landing-description h2 { margin-bottom: 5.625vw; text-align: center; } } @media (min-width: 736px) and (max-width: 1023px) { #tw-mobile-app--landing .tw-mobile-app--landing-description h2 { margin-bottom: 18px; margin-bottom: 2.34388vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { #tw-mobile-app--landing .tw-mobile-app--landing-description h2 { font-size: 36px; margin-bottom: 8px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { #tw-mobile-app--landing .tw-mobile-app--landing-description h2 { margin-bottom: 0.64vw; font-size: 2.88vw; } } @media screen and (min-width: 1240px) { #tw-mobile-app--landing .tw-mobile-app--landing-description h2 { margin-bottom: 8px; font-size: 42px; } } #tw-mobile-app--landing .tw-mobile-app--landing-description p { font-size: 16px; } @media (min-width: 321px) and (max-width: 735px) { #tw-mobile-app--landing .tw-mobile-app--landing-description p { font-size: 2.8125vw; } } @media (min-width: 736px) and (max-width: 1023px) { #tw-mobile-app--landing .tw-mobile-app--landing-description p { font-size: 14px; font-size: 1.82302vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { #tw-mobile-app--landing .tw-mobile-app--landing-description p { font-size: 14px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { #tw-mobile-app--landing .tw-mobile-app--landing-description p { font-size: 1.28vw; } } #tw-mobile-app--landing .tw-mobile-app--landing-description .button-row { padding-bottom: 68px; } @media (max-width: 735px) { #tw-mobile-app--landing .tw-mobile-app--landing-description .button-row { padding-bottom: 0; } } @media screen and (min-width: 1240px) { #tw-mobile-app--landing .tw-check-list--landing { position: relative; top: 30px; } } @media screen and (min-width: 1240px) { #tw-mobile-app--landing .tw-check-list--landing li { padding-bottom: 7px; } } @media screen and (min-width: 1240px) { #tw-mobile-app--landing .tw-check-list--landing li:before { left: 0px; font-size: 26px; top: 14px; } } #tw-mobile-app--landing .tw-phone-img { float: right; padding-left: 40px; } @media (max-width: 735px) { #tw-mobile-app--landing .tw-phone-img { display: none; } } @media (min-width: 736px) and (max-width: 1023px) { #tw-mobile-app--landing .tw-phone-img { padding-left: 40px; padding-left: 5.20863vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { #tw-mobile-app--landing .tw-phone-img { padding-left: 40px; margin-bottom: 0; } } @media screen and (min-width: 1026px) { #tw-mobile-app--landing .tw-phone-img { padding-left: 3.2vw; margin-bottom: 0; } } @media screen and (min-width: 1240px) { #tw-mobile-app--landing .tw-phone-img { padding-left: 40px; padding-right: 10px; } } #tw-mobile-app--landing .tw-phone-img .tw-img-wrap { position: relative; padding: 10px 10px 0px 10px; width: 696px; height: 574px; } @media (min-width: 736px) and (max-width: 1023px) { #tw-mobile-app--landing .tw-phone-img .tw-img-wrap { padding: 0.78129vw 0.91151vw 0px 0.91151vw; width: 50.26331vw; height: 49.48201vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { #tw-mobile-app--landing .tw-phone-img .tw-img-wrap { width: 445px; height: 438px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { #tw-mobile-app--landing .tw-phone-img .tw-img-wrap { padding: 0.8vw 0.8vw 0px 0.8vw; width: 55.68vw; height: 45.92vw; } } #tw-mobile-app--landing .tw-phone-img img { display: inline-block; border-radius: 20px; width: 100%; } .twlanding-body .tw-landing-integrations { padding: 0px 0 40px; } .twlanding-body .tw-landing-integrations h2 { text-align: center; } .twlanding-body .tw-landing-integrations h2 span { display: inline-block; height: 56px; line-height: 56px; border-radius: 6px; position: relative; top: -6px; background-color: #fff; padding: 0 19px; } .twlanding-body .tw-landing-integrations .tw-one-line { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: center; justify-content: center; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; margin: 0 -25px; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group { -ms-flex-positive: 1; flex-grow: 1; padding: 0 40px 0 12px; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group .tw-list { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: center; justify-content: center; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; position: relative; margin-bottom: 6px; border-bottom: 1px solid #d0d6d6; padding: 45px 0 0; min-height: 134px; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group .tw-list:before, .twlanding-body .tw-landing-integrations .tw-one-line .tw-group .tw-list:after { content: ''; display: block; position: absolute; height: 15px; width: 1px; bottom: 0; background-color: #d0d6d6; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group .tw-list:before { left: 0; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group .tw-list:after { right: 0; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group .tw-list .tw-item { margin-bottom: 15px; padding: 0 30px; max-width: 100%; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group .tw-list .tw-item img { max-width: 100%; width: 100%; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group.tw-second { -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 0; flex-shrink: 0; max-width: 435px; padding: 0 31px 0 12px; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group .tw-dim { padding: 0 15px; font-size: 16px; line-height: 1.3; text-align: center; color: #9da9b5; } .twlanding-body .tw-landing-integrations .tw-custom { padding: 25px; max-width: 90%; height: auto; width: 330px; white-space: normal; line-height: 1.2; } @media (max-width: 480px) { .twlanding-body .tw-landing-integrations .tw-custom { padding: 6vw; font-size: 5vw; } } @media (max-width: 735px) { .twlanding-body .tw-landing-integrations .tw-one-line { display: block; padding: 0 26px; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group { display: block; padding: 0; max-width: none; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group .tw-list { padding: 33px 0 0; margin-bottom: 3px; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group .tw-list .tw-item { width: 50%; margin-bottom: 26px; padding: 0 20px; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group .tw-list .tw-item.tw-bitbucket { margin-bottom: 21px; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group.tw-second { display: block; padding: 0; max-width: none; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group.tw-second .tw-list { padding: 44px 20px 0px 20px; min-height: 42px; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group.tw-second .tw-list .tw-item { margin-bottom: 22px; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group .tw-dim { padding: 0 5px; font-size: 12px; } } @media (max-width: 735px) and (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-landing-integrations .tw-one-line .tw-group .tw-dim { padding: 0 1.5625vw; font-size: 3.75vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .tw-landing-integrations .wrap { padding-left: 18px; padding-right: 18px; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group { padding: 0 22px 0 28px; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group .tw-list { padding: 5px 0 0; min-height: 62px; margin-bottom: 2px; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group .tw-list .tw-item { height: 35px; margin-bottom: 15px; padding: 0 25px; width: 32%; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group.tw-second { max-width: 280px; padding: 0 20px 0 12px; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group.tw-second .tw-list .tw-item { width: 50%; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group .tw-dim { padding: 0 5px; font-size: 12px; } } @media (min-width: 1240px) { .twlanding-body .tw-landing-integrations .wrap { padding-left: 26px; padding-right: 26px; } .twlanding-body .tw-landing-integrations h2 { padding-bottom: 20px; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group { padding: 0 40px 0 12px; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group .tw-list { padding: 45px 0 0; min-height: 134px; margin-bottom: 6px; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group .tw-list .tw-item { height: 50px; margin-bottom: 15px; padding: 0 30px; width: 32%; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group.tw-second { max-width: 435px; padding: 0 31px 0 12px; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group.tw-second .tw-list .tw-item { width: 50%; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group .tw-dim { padding: 0 15px; font-size: 16px; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .tw-landing-integrations .wrap { padding-left: 26px; padding-right: 26px; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group { padding: 0 28px 0 28px; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group .tw-list { padding: 14px 0 0; min-height: 86px; margin-bottom: 4px; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group .tw-list .tw-item { height: 42px; margin-bottom: 15px; padding: 0 30px; width: 32%; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group.tw-second { max-width: 358px; padding: 0 31px 0 12px; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group.tw-second .tw-list .tw-item { width: 50%; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group .tw-dim { padding: 0 5px; font-size: 13px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .tw-landing-integrations .wrap { padding-left: 2.08vw; padding-right: 2.08vw; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group { padding: 0 3.2vw 0 0.96vw; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group .tw-list { padding: 3.6vw 0 0; min-height: 10.72vw; margin-bottom: 0.48vw; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group .tw-list .tw-item { height: 4vw; margin-bottom: 1.2vw; padding: 0 2.4vw; width: 32%; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group.tw-second { max-width: 34.8vw; padding: 0 2.48vw 0 0.96vw; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group.tw-second .tw-list .tw-item { width: 50%; } .twlanding-body .tw-landing-integrations .tw-one-line .tw-group .tw-dim { padding: 0 1.2vw; font-size: 1.28vw; } } .twlanding-body .h2, .twlanding-body h2 { color: #3f3f3f; font-family: "LatoBold"; text-align: center; } @media (max-width: 320px) { .twlanding-body .h2, .twlanding-body h2 { margin: 0; font-size: 20px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .h2, .twlanding-body h2 { margin: 0; font-size: 6.25vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .h2, .twlanding-body h2 { margin: 0; font-size: 26px; font-size: 3.38561vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .h2, .twlanding-body h2 { margin: 0; padding-bottom: 2px; font-size: 26px; padding-left: 0px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .h2, .twlanding-body h2 { margin: 0; padding-bottom: 2.72vw; font-size: 2.72vw; } } @media (min-width: 1240px) { .twlanding-body .h2, .twlanding-body h2 { margin: 0; padding-bottom: 15px; font-size: 34px; } } .twlanding-body .tw-landing-text-page h2 { text-align: left; font-size: 26px; font-family: "LatoRegular"; margin: 33px 0 0px; padding-left: 0; padding-bottom: 0; } .twlanding-body .tw-highlight-container { background-color: #eef6ff; } .twlanding-body .col-sm-1, .twlanding-body .col-lg-1 { padding: 0 15px; max-width: 100%; } .twlanding-body .col-sm-2, .twlanding-body .col-lg-2 { padding: 0 15px; max-width: 100%; } .twlanding-body .col-sm-3, .twlanding-body .col-lg-3 { padding: 0 15px; max-width: 100%; } .twlanding-body .col-sm-4, .twlanding-body .col-lg-4 { padding: 0 15px; max-width: 100%; } .twlanding-body .col-sm-5, .twlanding-body .col-lg-5 { padding: 0 15px; max-width: 100%; } .twlanding-body .col-sm-6, .twlanding-body .col-lg-6 { padding: 0 15px; max-width: 100%; } .twlanding-body .col-sm-7, .twlanding-body .col-lg-7 { padding: 0 15px; max-width: 100%; } .twlanding-body .col-sm-8, .twlanding-body .col-lg-8 { padding: 0 15px; max-width: 100%; } .twlanding-body .col-sm-9, .twlanding-body .col-lg-9 { padding: 0 15px; max-width: 100%; } .twlanding-body .col-sm-10, .twlanding-body .col-lg-10 { padding: 0 15px; max-width: 100%; } .twlanding-body .col-sm-11, .twlanding-body .col-lg-11 { padding: 0 15px; max-width: 100%; } .twlanding-body .col-sm-12, .twlanding-body .col-lg-12 { padding: 0 15px; max-width: 100%; } @media (min-width: 736px) { .twlanding-body .col-sm-1 { width: 100%; } .twlanding-body .col-sm-2 { width: 50%; } .twlanding-body .col-sm-3 { width: 33.33333%; } .twlanding-body .col-sm-4 { width: 25%; } .twlanding-body .col-sm-5 { width: 20%; } .twlanding-body .col-sm-6 { width: 16.66667%; } .twlanding-body .col-sm-7 { width: 14.28571%; } .twlanding-body .col-sm-8 { width: 12.5%; } .twlanding-body .col-sm-9 { width: 11.11111%; } .twlanding-body .col-sm-10 { width: 10%; } .twlanding-body .col-sm-11 { width: 9.09091%; } .twlanding-body .col-sm-12 { width: 8.33333%; } } @media (min-width: 1280px) { .twlanding-body .col-lg-1 { width: 100%; } .twlanding-body .col-lg-2 { width: 50%; } .twlanding-body .col-lg-3 { width: 33.33333%; } .twlanding-body .col-lg-4 { width: 25%; } .twlanding-body .col-lg-5 { width: 20%; } .twlanding-body .col-lg-6 { width: 16.66667%; } .twlanding-body .col-lg-7 { width: 14.28571%; } .twlanding-body .col-lg-8 { width: 12.5%; } .twlanding-body .col-lg-9 { width: 11.11111%; } .twlanding-body .col-lg-10 { width: 10%; } .twlanding-body .col-lg-11 { width: 9.09091%; } .twlanding-body .col-lg-12 { width: 8.33333%; } } .twlanding-body .row { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; margin: 0 -15px; } @media (max-width: 735px) { .twlanding-body .row { -ms-flex-wrap: wrap; flex-wrap: wrap; } } .twlanding-body .tw-container { margin: 53px 0; } .twlanding-body h2.tw-text-big, .twlanding-body *.tw-text-big { font-size: 40px; } @media (max-width: 480px) { .twlanding-body h2.tw-text-big, .twlanding-body *.tw-text-big { font-size: 7vw; } } .twlanding-body h2.tw-text-highlight, .twlanding-body *.tw-text-highlight { color: #004373; } .twlanding-body .tw-top-offset { margin-top: 88px; } .twlanding-body .tw-medium-lh { line-height: 1.2; } .twlanding-body h2.tw-bottom-padding { padding-bottom: 2.72vw; } #twlanding-home { background-color: #c8dff2; } .twlanding-pricing-content .tw-members-slider { margin: 33px 0 23px; padding: 0 10px 1px; width: 100%; max-width: calc(100% - 3px); text-align: left; } .twlanding-pricing-content .tw-members-slider > div > div { height: 10px !important; background-color: #e9eef1; position: relative; cursor: pointer !important; } .twlanding-pricing-content .tw-members-slider > div > div:before, .twlanding-pricing-content .tw-members-slider > div > div:after { content: ''; display: block; position: absolute; top: 0; height: 100%; width: 10px; } .twlanding-pricing-content .tw-members-slider > div > div:before { left: -10px; background-color: #6d7e8e; border-top-left-radius: 5px; border-bottom-left-radius: 5px; } .twlanding-pricing-content .tw-members-slider > div > div:after { right: -10px; background-color: #e9eef1; border-top-right-radius: 5px; border-bottom-right-radius: 5px; } .twlanding-pricing-content .tw-members-slider > div > div > div { top: 0 !important; height: 10px !important; } .twlanding-pricing-content .tw-members-slider > div > div > div > div:first-child { background-color: #6d7e8e !important; } .twlanding-pricing-content .tw-members-slider > div > div > div > div:nth-of-type(2) { background-color: #e9eef1 !important; } .twlanding-pricing-content .tw-members-slider > div > div > div > div:last-child { margin: 0 !important; margin-left: -10px !important; border: none !important; border-radius: 5px !important; height: 10px !important; width: 20px !important; background-color: #6d7e8e !important; transform: none !important; } .twlanding-pricing-content .tw-members-slider > div > div > div > div:last-child:before { content: ''; display: block; position: absolute; top: 0; left: 50%; height: 100%; width: 1px; background: #e9eef1; } .twlanding-pricing-content .tw-members-slider > div > div > div > div:last-child > div { display: none; top: calc(50% - 6px) !important; left: calc(50% - 6px) !important; } .twlanding-pricing-content .tw-members-slider .tw-labels { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; position: relative; width: 100%; font-family: "LatoRegular", sans-serif; font-size: 15px; color: #6d7e8e; } .twlanding-pricing-content .tw-members-slider .tw-labels .tw-label { -ms-flex-positive: 1; flex-grow: 1; -ms-flex-negative: 1; flex-shrink: 1; display: block; position: relative; height: 10px; width: calc(100% / 39); } .twlanding-pricing-content .tw-members-slider .tw-labels .tw-label:last-child { width: 0; } .twlanding-pricing-content .tw-members-slider .tw-labels .tw-label:before { content: ''; position: absolute; display: block; height: 100%; width: 1px; background: #6d7e8e !important; top: 0; left: 0; transform: translateY(-100%); cursor: pointer; } .twlanding-pricing-content .tw-members-slider .tw-labels .tw-label:not(.odd) > span { position: absolute; top: -33px; } .twlanding-pricing-content .tw-members-slider .tw-labels .tw-label.tw-selected:before { background-color: #fff !important; } .twlanding-pricing-content .tw-members-slider .tw-labels .tw-label > span { display: inline-block; margin-top: 1px; transform: translateX(-50%); cursor: pointer; } .twlanding-pricing-blocks { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; } .twlanding-pricing-blocks .h1, .twlanding-pricing-blocks .h2, .twlanding-pricing-blocks .h3, .twlanding-pricing-blocks .h4, .twlanding-pricing-blocks .h5, .twlanding-pricing-blocks .h6, .twlanding-pricing-blocks h1, .twlanding-pricing-blocks h2, .twlanding-pricing-blocks h3, .twlanding-pricing-blocks h4, .twlanding-pricing-blocks h5, .twlanding-pricing-blocks h6 { font-weight: 400; } @media screen and (min-width: 736px) { .twlanding-pricing-blocks { -ms-flex-align: stretch; align-items: stretch; -ms-flex-wrap: none; flex-wrap: nowrap; margin-bottom: 130px; } } @media screen and (min-width: 1024px) { .twlanding-pricing-blocks { margin-bottom: 0; } } .twlanding-pricing-blocks .pricing-block { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 1; flex-grow: 1; -ms-flex-negative: 1; flex-shrink: 1; width: 100%; } .twlanding-pricing-blocks .pricing-block.tw-disabled { cursor: not-allowed; } .twlanding-pricing-blocks .pricing-block.tw-disabled .pricing-block--header .pricing-block--title { background-color: #d8dfe6; } .twlanding-pricing-blocks .pricing-block.tw-disabled .pricing-block--header .tw-short-info { background-color: #edf2f6 !important; } .twlanding-pricing-blocks .pricing-block.tw-disabled .pricing-block--header .tw-short-info .pricing-block--price, .twlanding-pricing-blocks .pricing-block.tw-disabled .pricing-block--header .tw-short-info .pricing-block--desc, .twlanding-pricing-blocks .pricing-block.tw-disabled .pricing-block--header .tw-short-info .tw-team-size { color: #b5bfc9; } .twlanding-pricing-blocks .pricing-block.tw-disabled .pricing-block--header .tw-short-info .tw-price-by-year { color: #b5bfc9; background-color: #fff; } .twlanding-pricing-blocks .pricing-block.tw-disabled .pricing-block--includes ul li, .twlanding-pricing-blocks .pricing-block.tw-disabled .pricing-block--includes ul li:before, .twlanding-pricing-blocks .pricing-block.tw-disabled .pricing-block--includes h3, .twlanding-pricing-blocks .pricing-block.tw-disabled .pricing-block--includes h4 { color: #a2adb8; } .twlanding-pricing-blocks .pricing-block.tw-disabled .pricing-block--btn p { color: #a2adb8; } .twlanding-pricing-blocks .pricing-block > div { width: 100%; } @media screen and (max-width: 735px) { .twlanding-pricing-blocks .pricing-block { margin-bottom: 30px; } } @media screen and (min-width: 736px) { .twlanding-pricing-blocks .pricing-block { width: 25%; box-sizing: border-box; } } @media screen and (min-width: 736px) { .twlanding-pricing-blocks .pricing-block:nth-child(2n) { margin: 0 0.5%; } .twlanding-pricing-blocks .pricing-block:nth-child(2n).Business, .twlanding-pricing-blocks .pricing-block:nth-child(2n).business { margin-top: -10px; margin-bottom: -10px; } .twlanding-pricing-blocks .pricing-block:nth-child(2n).Business .pricing-block--header, .twlanding-pricing-blocks .pricing-block:nth-child(2n).business .pricing-block--header { height: 251px; } .twlanding-pricing-blocks .pricing-block:nth-child(2n).Business .pricing-block--header .tw-team-size, .twlanding-pricing-blocks .pricing-block:nth-child(2n).business .pricing-block--header .tw-team-size { position: relative; top: -9px; margin-bottom: 5px; } .twlanding-pricing-blocks .pricing-block:nth-child(2n).Business .pricing-block--btn, .twlanding-pricing-blocks .pricing-block:nth-child(2n).business .pricing-block--btn { padding-top: 16px; } } .twlanding-pricing-blocks .pricing-block:last-child { margin-right: 0; } .twlanding-pricing-blocks .pricing-block .pricing-block--header { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; height: 231px; text-align: center; border-bottom: 1px solid #fff; overflow: hidden; } .twlanding-pricing-blocks .pricing-block .pricing-block--header .pricing-block--title { -ms-flex-positive: 0; flex-grow: 0; width: 100%; font-family: "LatoBold", sans-serif; font-size: 26px; text-align: center; height: 53px; line-height: 53px; position: relative; color: #fff; } .twlanding-pricing-blocks .pricing-block .pricing-block--header .tw-short-info { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 1; flex-grow: 1; -ms-flex-negative: 1; flex-shrink: 1; margin-top: 1px; padding-top: 19px; padding-bottom: 28px; width: 100%; } .twlanding-pricing-blocks .pricing-block .pricing-block--header .pricing-block--price { position: relative; font-family: "LatoBold", sans-serif; font-size: 48px; line-height: 1; color: #3f3f3f; text-align: center; transition: color 0.3s; margin-bottom: 5px; } .twlanding-pricing-blocks .pricing-block .pricing-block--header .pricing-block--price .tw-small, .twlanding-pricing-blocks .pricing-block .pricing-block--header .pricing-block--price .tw-month, .twlanding-pricing-blocks .pricing-block .pricing-block--header .pricing-block--price .tw-user { display: inline-block; position: relative; width: 0; } .twlanding-pricing-blocks .pricing-block .pricing-block--header .pricing-block--price .tw-small { left: -19px; font-size: 70%; vertical-align: top; } @media (max-width: 735px) { .twlanding-pricing-blocks .pricing-block .pricing-block--header .pricing-block--price .tw-small { left: -5.9375vw; } } .twlanding-pricing-blocks .pricing-block .pricing-block--header .pricing-block--price .tw-user, .twlanding-pricing-blocks .pricing-block .pricing-block--header .pricing-block--price .tw-month { font-family: "LatoRegular"; font-size: 13px; } .twlanding-pricing-blocks .pricing-block .pricing-block--header .pricing-block--price .tw-user { padding-left: 5px; top: -17px; } .twlanding-pricing-blocks .pricing-block .pricing-block--header .tw-price-by-year { display: inline-block; margin-top: 10px; margin-bottom: 15px; border-radius: 10px; padding: 3px 10px 3px 15px; font-family: "LatoRegular", sans-serif; font-size: 17px; line-height: normal; background-color: #a4abb0; color: white; transition: background-color 0.3s, color 0.3s; } .twlanding-pricing-blocks .pricing-block .pricing-block--header .tw-price-by-year .tw-small { display: inline-block; position: relative; width: 0; left: -8px; font-size: 85%; vertical-align: top; } .twlanding-pricing-blocks .pricing-block .pricing-block--header .tw-price-by-year .bolder { font-family: "LatoBold", sans-serif; } .twlanding-pricing-blocks .pricing-block .pricing-block--header .tw-team-size { margin-top: 2px; font-size: 19px; color: #4b5155; font-family: "LatoBold"; } .twlanding-pricing-blocks .pricing-block .pricing-block--header .pricing-block--desc { margin-left: 5px; margin-bottom: 5px; text-align: center; font-family: "LatoRegular", sans-serif; font-size: 20px; color: #4b5155; width: calc(100% - 13px); transition: color 0.3s; } .twlanding-pricing-blocks .pricing-block .pricing-block--header .pricing-block--desc .tw-small { display: inline-block; position: relative; width: 0; left: -8px; font-size: 80%; vertical-align: top; font-family: "LatoBold", sans-serif; } @media (max-width: 735px) { .twlanding-pricing-blocks .pricing-block .pricing-block--header .pricing-block--desc .tw-small { left: -2.1875vw; font-size: 70%; } } .twlanding-pricing-blocks .pricing-block .pricing-block--header .pricing-block--desc .bolder { font-family: "LatoBold", sans-serif; } @media (max-width: 735px) { .twlanding-pricing-blocks .pricing-block.Starter .pricing-block--header, .twlanding-pricing-blocks .pricing-block.starter .pricing-block--header { height: 170px; } } .twlanding-pricing-blocks .pricing-block.Starter .pricing-block--header .tw-short-info, .twlanding-pricing-blocks .pricing-block.starter .pricing-block--header .tw-short-info { padding-top: 13px; -ms-flex-pack: start; justify-content: flex-start; } .twlanding-pricing-blocks .pricing-block.Starter .pricing-block--header .pricing-block--price, .twlanding-pricing-blocks .pricing-block.starter .pricing-block--header .pricing-block--price { font-size: 54px; left: 10px; } .twlanding-pricing-blocks .pricing-block.Starter .pricing-block--header .pricing-block--price .tw-small, .twlanding-pricing-blocks .pricing-block.starter .pricing-block--header .pricing-block--price .tw-small { left: -25px; font-size: 70%; vertical-align: top; } @media (max-width: 735px) { .twlanding-pricing-blocks .pricing-block.Starter .pricing-block--header .pricing-block--price .tw-small, .twlanding-pricing-blocks .pricing-block.starter .pricing-block--header .pricing-block--price .tw-small { left: -7.8125vw; } } .twlanding-pricing-blocks .pricing-block.Starter .pricing-block--header .tw-short-info, .twlanding-pricing-blocks .pricing-block.starter .pricing-block--header .tw-short-info { background-color: #c3f0ff; } .twlanding-pricing-blocks .pricing-block.Starter .pricing-block--header .tw-team-size, .twlanding-pricing-blocks .pricing-block.starter .pricing-block--header .tw-team-size { font-family: "LatoRegular"; font-size: 16px; position: relative; top: -5px; } .twlanding-pricing-blocks .pricing-block.Starter .pricing-block--title, .twlanding-pricing-blocks .pricing-block.starter .pricing-block--title { background-color: #55c5e9; } .twlanding-pricing-blocks .pricing-block.Starter .pricing-block--free-exceeded, .twlanding-pricing-blocks .pricing-block.starter .pricing-block--free-exceeded { padding: 7px 0 15px 0; height: 76px; } .twlanding-pricing-blocks .pricing-block.Starter .pricing-block--free-exceeded .ico, .twlanding-pricing-blocks .pricing-block.starter .pricing-block--free-exceeded .ico { float: left; width: 50px; height: 100px; margin-right: -50px; background-image: url("/img/front/exclamation.svg"); background-repeat: no-repeat; background-size: 30px; background-position: 17px 19px; } .twlanding-pricing-blocks .pricing-block.Starter .pricing-block--free-exceeded p, .twlanding-pricing-blocks .pricing-block.starter .pricing-block--free-exceeded p { float: left; padding-left: 64px; text-align: left; padding-right: 30px; font-size: 15px; color: #4b5155; } .twlanding-pricing-blocks .pricing-block.Business .pricing-block--header .tw-price-by-year, .twlanding-pricing-blocks .pricing-block.business .pricing-block--header .tw-price-by-year { background-color: #bed600; } .twlanding-pricing-blocks .pricing-block.Business .pricing-block--title, .twlanding-pricing-blocks .pricing-block.business .pricing-block--title { background-color: #bed600; } .twlanding-pricing-blocks .pricing-block.Business .tw-short-info, .twlanding-pricing-blocks .pricing-block.business .tw-short-info { background-color: #f7fbd8; } .twlanding-pricing-blocks .pricing-block.Business.Plus .pricing-block--header .tw-price-by-year, .twlanding-pricing-blocks .pricing-block.business_plus .pricing-block--header .tw-price-by-year { background-color: #ff6f40; } .twlanding-pricing-blocks .pricing-block.Business.Plus .pricing-block--title, .twlanding-pricing-blocks .pricing-block.business_plus .pricing-block--title { background-color: #ff6f40; } .twlanding-pricing-blocks .pricing-block.Business.Plus .tw-short-info, .twlanding-pricing-blocks .pricing-block.business_plus .tw-short-info { background-color: #ffe5dc; padding-top: 16px; } .twlanding-pricing-blocks .pricing-block.Business.Plus .tw-team-size, .twlanding-pricing-blocks .pricing-block.business_plus .tw-team-size { position: relative; top: -10px; } .twlanding-pricing-blocks .pricing-block.enterprise .pricing-block--title { background-color: #2a4d72; } .twlanding-pricing-blocks .pricing-block.enterprise .tw-short-info { background-color: #c5d5e6; } .twlanding-pricing-blocks .pricing-block.enterprise .tw-short-info a { color: #2c2f31; text-decoration: none; font-size: 22px; font-family: 'LatoBold'; } .twlanding-pricing-blocks .pricing-block.enterprise .tw-short-info a:hover { text-decoration: underline; } .twlanding-pricing-blocks .pricing-block .pricing-block--includes { -ms-flex-positive: 1; flex-grow: 1; margin-top: 1px; padding: 20px 10px; min-height: 50px; text-align: center; overflow: hidden; background-color: #f8fbfd; } .twlanding-pricing-blocks .pricing-block .pricing-block--includes h4 { margin: 0 0 15px; text-align: center; font-family: "LatoBold"; font-size: 18px; color: #004f88; } .twlanding-pricing-blocks .pricing-block .pricing-block--includes h3 { margin: 0 0 15px; font-family: "LatoBold"; font-size: 16px; color: #3f3f3f; } .twlanding-pricing-blocks .pricing-block .pricing-block--includes ul { margin: 0 20px; padding: 0; max-width: 214px; list-style: none; text-align: left; } @media (max-width: 735px) { .twlanding-pricing-blocks .pricing-block .pricing-block--includes ul { padding: 0 15px 0 35px; max-width: 400px; } } .twlanding-pricing-blocks .pricing-block .pricing-block--includes ul li { position: relative; margin-bottom: 10px; padding: 0; font-size: 15px; color: #3f3f3f; list-style-type: disc; list-style-position: outside; } .twlanding-pricing-blocks .pricing-block .pricing-block--includes ul li::marker { text-indent: 5px !important; text-align: right !important; } .twlanding-pricing-blocks .pricing-block .pricing-block--includes.tw-coming-soon { background-image: url("/img/front/coming-soon.svg"); background-position: 50%; background-size: 80%; background-repeat: no-repeat; } @media (min-width: 736px) { .twlanding-pricing-blocks .pricing-block .pricing-block--includes.tw-coming-soon { background-position: 50% 60px; } } @media screen and (max-width: 735px) { .twlanding-pricing-blocks .pricing-block .pricing-block--includes.tw-coming-soon { height: 250px; background-size: auto 90%; } } .twlanding-pricing-blocks .pricing-block .pricing-block--btn { text-align: center; padding: 26px 0 15px 0; height: 76px; } .twlanding-pricing-blocks .pricing-block .pricing-block--btn .tw-btn { min-width: 144px; } .twlanding-pricing-blocks .pricing-block .pricing-block--btn p { margin: 0; font-size: 15px; text-align: center; color: #2c2f32; padding-top: 3px; } .twlanding-body .twlanding-pricing-content { padding-bottom: 30px; background-color: #fff; } .twlanding-body .twlanding-pricing-content .h5 { font-size: 18px; margin-bottom: 10px; } @media screen and (min-width: 1024px) { .twlanding-body .twlanding-pricing-content .h5 { font-size: 20px; margin-top: 0; } } .twlanding-body .twlanding-pricing-content .wrap { max-width: 100%; } @media screen and (min-width: 1024px) { .twlanding-body .twlanding-pricing-content .wrap { width: 990px; margin: auto; padding: 0 10px; } } .twlanding-body .twlanding-pricing-content .wrap--wide { max-width: 100%; } @media screen and (min-width: 1024px) { .twlanding-body .twlanding-pricing-content .wrap--wide { width: 1200px; margin: auto; padding: 0 10px; } } .twlanding-body .twlanding-pricing-content .period-switcher--title { margin-top: 35px; margin-bottom: 10px; } .twlanding-body .twlanding-pricing-content .checker-row { text-align: center; margin-bottom: 10px; } .twlanding-body .twlanding-pricing-content .checker-row .checker { margin-right: 2px; height: 37px; line-height: normal; font-size: 19px; background-color: #e9eef1; display: inline-block; cursor: pointer; text-align: center; color: #767a7d; border-radius: 8px 0 0 8px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; padding: 4px 16px; transition: color 0.3s, background-color 0.3s; } @media screen and (min-width: 736px) { .twlanding-body .twlanding-pricing-content .checker-row .checker { font-size: 24px; } } .twlanding-body .twlanding-pricing-content .checker-row .checker.active, .twlanding-body .twlanding-pricing-content .checker-row .checker:hover, .twlanding-body .twlanding-pricing-content .checker-row .checker:focus, .twlanding-body .twlanding-pricing-content .checker-row .checker:active { color: #fff; background-color: #9da9b5; } .twlanding-body .twlanding-pricing-content .checker-row .checker + .checker { border-radius: 0 8px 8px 0; margin-right: 0px; } .twlanding-body .twlanding-pricing-content .tw-top-short-info { margin-top: 20px; margin-bottom: 30px; font-size: 15px; color: #6a7c89; } @media (min-width: 736px) { .twlanding-body .twlanding-pricing-content .tw-top-short-info { margin-bottom: 44px; font-size: 17px; } } .twlanding-body .twlanding-pricing-content .vat-row { clear: both; margin-top: 72px; margin-bottom: 8px; color: #2c2f32; font-size: 15px; padding-top: 12px; padding-bottom: 14px; padding-left: 5px; padding-right: 5px; border-top: 1px solid #2c2f32; border-bottom: 1px solid #2c2f32; } .twlanding-body .twlanding-pricing-content .forall-row { background-color: #f8fbfd; padding: 13px 16px 9px 14px; margin-bottom: 20px; } .twlanding-body .twlanding-pricing-content .forall-row .h3 { font-family: "LatoBold", sans-serif; font-size: 22px; color: #165b8b; text-align: left; margin-bottom: 18px; margin-top: 0; } .twlanding-body .twlanding-pricing-content .forall-row .tw-list { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; list-style: none; padding: 0; margin: 0; } .twlanding-body .twlanding-pricing-content .forall-row .tw-list .tw-col { min-width: 394px; } @media (max-width: 735px) { .twlanding-body .twlanding-pricing-content .forall-row .tw-list .tw-col { min-width: auto; } } .twlanding-body .twlanding-pricing-content .forall-row .tw-list .tw-list-item { position: relative; color: #2c2f32; font-size: 17px; padding-left: 41px; margin-bottom: 9px; } @media (max-width: 735px) { .twlanding-body .twlanding-pricing-content .forall-row .tw-list .tw-list-item { padding-left: 21px; width: 100%; } } .twlanding-header-second { position: relative; z-index: 1; background-color: #fff; } .transition-cont .tw-loading-cover { padding-top: 73px; background-color: #fff; z-index: 0; } .transition-cont.tw-pricing-page.full-height { height: 1000px; } .transition-cont.tw-pricing-page.full-height .tw-loading-cover { -ms-flex-align: start; align-items: flex-start; padding-top: 250px; height: 100%; } @media screen and (max-width: 735px) { .twlanding-pricing-content .tw-slider-wrapper { width: 100%; max-width: 100%; } .twlanding-pricing-content .tw-slider-wrapper .ps__rail-x { display: none !important; } .twlanding-pricing-content .tw-slider-wrapper::-webkit-scrollbar { display: none; } .twlanding-pricing-content .tw-members-slider { margin: 4.6875vw auto 9.6875vw; padding: 0 2.65625vw 0.3125vw; width: 200%; max-width: 200%; } .twlanding-pricing-content .tw-members-slider > div > div { height: 2.1875vw !important; background-color: #9da9b5 !important; position: relative; cursor: pointer !important; } .twlanding-pricing-content .tw-members-slider > div > div:before, .twlanding-pricing-content .tw-members-slider > div > div:after { content: ''; display: block; position: absolute; top: 0; height: 100%; width: 2.65625vw; } .twlanding-pricing-content .tw-members-slider > div > div:before { left: -2.65625vw; background-color: #9da9b5; border-top-left-radius: 1.5625vw; border-bottom-left-radius: 1.5625vw; } .twlanding-pricing-content .tw-members-slider > div > div:after { right: -2.65625vw; background-color: #e9eef1; border-top-right-radius: 1.5625vw; border-bottom-right-radius: 1.5625vw; } .twlanding-pricing-content .tw-members-slider > div > div > div { top: 0 !important; height: 2.1875vw !important; } .twlanding-pricing-content .tw-members-slider > div > div > div > div:first-child { background-color: #9da9b5 !important; } .twlanding-pricing-content .tw-members-slider > div > div > div > div:nth-of-type(2) { background-color: #e9eef1 !important; } .twlanding-pricing-content .tw-members-slider > div > div > div > div:last-child { margin: 0px !important; margin-left: -2.65625vw !important; border: none !important; border-radius: 1.5625vw !important; height: 2.1875vw !important; width: 5.3125vw !important; background-color: #728191 !important; transform: none !important; } .twlanding-pricing-content .tw-members-slider > div > div > div > div:last-child:before { content: ''; display: block; position: absolute; top: 0; left: 50%; height: 100%; width: 1px; background-color: #e9eef1; } .twlanding-pricing-content .tw-members-slider > div > div > div > div:last-child > div { display: none; top: calc(50% - 6px) !important; left: calc(50% - 6px) !important; } .twlanding-pricing-content .tw-members-slider .tw-labels { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; position: relative; width: 100%; font-family: "LatoRegular", sans-serif; font-size: 3.75vw; color: #6d7d8e; } .twlanding-pricing-content .tw-members-slider .tw-labels .tw-label { -ms-flex-positive: 1; flex-grow: 1; -ms-flex-negative: 1; flex-shrink: 1; display: block; position: relative; height: 2.1875vw; width: calc(100% / 39); } .twlanding-pricing-content .tw-members-slider .tw-labels .tw-label:not(.odd) > span { position: absolute; top: -35px; } } @media screen and (max-width: 735px) and (max-width: 735px) { .twlanding-pricing-content .tw-members-slider .tw-labels .tw-label:nth-of-type(even) span { top: -7.8125vw; } } @media screen and (max-width: 735px) { .twlanding-pricing-content .tw-members-slider .tw-labels .tw-label:last-child { width: 0; } .twlanding-pricing-content .tw-members-slider .tw-labels .tw-label:before { content: ''; position: absolute; display: block; height: 100%; width: 1px; background-color: #7f8386; top: 0; left: 0; transform: translateY(-100%); cursor: pointer; } .twlanding-pricing-content .tw-members-slider .tw-labels .tw-label.tw-selected:before { background-color: #fff; } .twlanding-pricing-content .tw-members-slider .tw-labels .tw-label > span { display: inline-block; margin-top: 0.3125vw; transform: translateX(-50%); cursor: pointer; } .twlanding-pricing-blocks { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; } .twlanding-pricing-blocks h1, .twlanding-pricing-blocks h2, .twlanding-pricing-blocks h3, .twlanding-pricing-blocks h4, .twlanding-pricing-blocks h5, .twlanding-pricing-blocks h6 { font-weight: 400; } } @media screen and (max-width: 735px) and (min-width: 736px) { .twlanding-pricing-blocks { -ms-flex-align: stretch; align-items: stretch; -ms-flex-wrap: none; flex-wrap: nowrap; } } @media screen and (max-width: 735px) { .twlanding-pricing-blocks .pricing-block { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 1; flex-grow: 1; -ms-flex-negative: 1; flex-shrink: 1; width: 100%; } .twlanding-pricing-blocks .pricing-block.tw-disabled { cursor: not-allowed; } .twlanding-pricing-blocks .pricing-block.tw-disabled .pricing-block--header .pricing-block--title { background-color: #d8dfe6; } .twlanding-pricing-blocks .pricing-block.tw-disabled .pricing-block--header .tw-short-info { background-color: #edf2f6 !important; } .twlanding-pricing-blocks .pricing-block.tw-disabled .pricing-block--header .tw-short-info .pricing-block--price, .twlanding-pricing-blocks .pricing-block.tw-disabled .pricing-block--header .tw-short-info .pricing-block--desc, .twlanding-pricing-blocks .pricing-block.tw-disabled .pricing-block--header .tw-short-info .tw-team-size { color: #b5bfc9; } .twlanding-pricing-blocks .pricing-block.tw-disabled .pricing-block--header .tw-short-info .tw-price-by-year { color: #b5bfc9; background-color: #fff; } .twlanding-pricing-blocks .pricing-block.tw-disabled .pricing-block--includes ul li, .twlanding-pricing-blocks .pricing-block.tw-disabled .pricing-block--includes ul li:before, .twlanding-pricing-blocks .pricing-block.tw-disabled .pricing-block--includes h3, .twlanding-pricing-blocks .pricing-block.tw-disabled .pricing-block--includes h4 { color: #a2adb8; } .twlanding-pricing-blocks .pricing-block.tw-disabled .pricing-block--btn p { color: #a2adb8; } .twlanding-pricing-blocks .pricing-block > div { width: 100%; } } @media screen and (max-width: 735px) and (max-width: 735px) { .twlanding-pricing-blocks .pricing-block { margin-bottom: 9.375vw; } } @media screen and (max-width: 735px) and (min-width: 736px) { .twlanding-pricing-blocks .pricing-block { width: 33%; box-sizing: border-box; } } @media screen and (max-width: 735px) and (min-width: 736px) { .twlanding-pricing-blocks .pricing-block:nth-child(2n) { margin: 0 0.5%; } .twlanding-pricing-blocks .pricing-block:nth-child(2n).Pro { margin-top: -3.125vw; margin-bottom: -3.125vw; } .twlanding-pricing-blocks .pricing-block:nth-child(2n).Pro .pricing-block--header { height: 78.4375vw; } .twlanding-pricing-blocks .pricing-block:nth-child(2n).Pro .pricing-block--header .tw-short-info { padding-top: 7.8125vw; padding-bottom: 11.875vw; } .twlanding-pricing-blocks .pricing-block:nth-child(2n).Pro .pricing-block--header .tw-team-size { position: relative; top: -2.8125vw; margin-bottom: 1.5625vw; } } @media screen and (max-width: 735px) { .twlanding-pricing-blocks .pricing-block .pricing-block--header { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; height: 72.1875vw; text-align: center; border-bottom: 1px solid #fff; overflow: hidden; } .twlanding-pricing-blocks .pricing-block .pricing-block--header .pricing-block--title { -ms-flex-positive: 0; flex-grow: 0; width: 100%; font-family: "LatoBold", sans-serif; font-size: 8.125vw; text-align: center; height: 16.5625vw; line-height: 16.5625vw; position: relative; color: #fff; } .twlanding-pricing-blocks .pricing-block .pricing-block--header .tw-short-info { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 1; flex-grow: 1; -ms-flex-negative: 1; flex-shrink: 1; margin-top: 1px; padding-top: 5.9375vw; padding-bottom: 8.75vw; width: 100%; } .twlanding-pricing-blocks .pricing-block .pricing-block--header .pricing-block--price { font-family: "LatoBold", sans-serif; font-size: 13.125vw; color: #4b5155; text-align: center; padding: 0 0 1.25vw 0; } .twlanding-pricing-blocks .pricing-block .pricing-block--header .pricing-block--price .pricing-block--price--inner { margin: auto; position: relative; text-align: center; } .twlanding-pricing-blocks .pricing-block .pricing-block--header .pricing-block--price .pricing-block--price--inner .label-currency { font-size: 6.875vw; position: absolute; top: 2.1875vw; left: -4.6875vw; font-family: "LatoBold"; } .twlanding-pricing-blocks .pricing-block .pricing-block--header .pricing-block--price .pricing-block--price--inner .label-month { font-size: 5vw; position: absolute; bottom: 2.1875vw; right: -18.125vw; font-family: "LatoRegular"; } .twlanding-pricing-blocks .pricing-block .pricing-block--header .tw-price-by-year { display: inline-block; margin-top: 1.25vw; border-radius: 1.875vw; padding: 0 3.125vw; font-family: "LatoRegular", sans-serif; font-size: 5.625vw; line-height: 7.8125vw; color: #fff; background-color: #a4abb0; } .twlanding-pricing-blocks .pricing-block .pricing-block--header .tw-team-size { margin-top: 0.625vw; font-size: 5.9375vw; color: #4b5155; font-family: "LatoBold"; } .twlanding-pricing-blocks .pricing-block .pricing-block--header .pricing-block--desc { padding: 0 1.5625vw; font-family: "LatoRegular", sans-serif; margin-top: 3.125vw; margin-bottom: 1.25vw; text-align: center; font-size: 5vw; color: #2c2f32; } } @media screen and (max-width: 735px) and (max-width: 735px) { .twlanding-pricing-blocks .pricing-block.Starter .pricing-block--header, .twlanding-pricing-blocks .pricing-block.starter .pricing-block--header { height: 53.125vw; } } @media screen and (max-width: 735px) { .twlanding-pricing-blocks .pricing-block.Starter .pricing-block--header .tw-short-info, .twlanding-pricing-blocks .pricing-block.starter .pricing-block--header .tw-short-info { padding-top: 4.0625vw; } .twlanding-pricing-blocks .pricing-block.Starter .pricing-block--header .pricing-block--price, .twlanding-pricing-blocks .pricing-block.starter .pricing-block--header .pricing-block--price { font-size: 16.875vw; } .twlanding-pricing-blocks .pricing-block.Starter .pricing-block--header .pricing-block--price .label-currency, .twlanding-pricing-blocks .pricing-block.starter .pricing-block--header .pricing-block--price .label-currency { font-size: 7.5vw; top: 3.4375vw; left: -5.9375vw; } .twlanding-pricing-blocks .pricing-block.Starter .pricing-block--header .tw-short-info, .twlanding-pricing-blocks .pricing-block.starter .pricing-block--header .tw-short-info { background-color: #c3f0ff; } .twlanding-pricing-blocks .pricing-block.Starter .pricing-block--header .tw-team-size, .twlanding-pricing-blocks .pricing-block.starter .pricing-block--header .tw-team-size { font-family: "LatoRegular"; font-size: 5vw; position: relative; top: -1.5625vw; } .twlanding-pricing-blocks .pricing-block.Starter .pricing-block--title, .twlanding-pricing-blocks .pricing-block.starter .pricing-block--title { background-color: #55c5e9; } .twlanding-pricing-blocks .pricing-block.Starter .pricing-block--free-exceeded, .twlanding-pricing-blocks .pricing-block.starter .pricing-block--free-exceeded { padding: 2.1875vw 0 4.6875vw 0; height: 34.375vw; } .twlanding-pricing-blocks .pricing-block.Starter .pricing-block--free-exceeded .ico, .twlanding-pricing-blocks .pricing-block.starter .pricing-block--free-exceeded .ico { float: left; width: 31.25vw; height: 31.25vw; margin-right: -31.25vw; background-image: url("/img/front/exclamation.svg"); background-repeat: no-repeat; background-size: 9.375vw; background-position: 15.625vw 5.9375vw; } .twlanding-pricing-blocks .pricing-block.Starter .pricing-block--free-exceeded p, .twlanding-pricing-blocks .pricing-block.starter .pricing-block--free-exceeded p { float: left; padding-left: 29.375vw; text-align: left; padding-right: 12.5vw; font-size: 4.6875vw; color: #4b5155; } .twlanding-pricing-blocks .pricing-block.Business .pricing-block--header .tw-price-by-year, .twlanding-pricing-blocks .pricing-block.business .pricing-block--header .tw-price-by-year { background-color: #bed600; } .twlanding-pricing-blocks .pricing-block.Business .pricing-block--title, .twlanding-pricing-blocks .pricing-block.business .pricing-block--title { background-color: #bed600; } .twlanding-pricing-blocks .pricing-block.Business .tw-short-info, .twlanding-pricing-blocks .pricing-block.business .tw-short-info { background-color: #f7fbd8; } .twlanding-pricing-blocks .pricing-block.enterprise .tw-short-info a { font-size: 6.875vw; } .twlanding-pricing-blocks .pricing-block.Ultimate .pricing-block--header .tw-price-by-year { background-color: #ff6f40; } .twlanding-pricing-blocks .pricing-block.Ultimate .pricing-block--title { background-color: #ff6f40; } .twlanding-pricing-blocks .pricing-block.Ultimate .tw-short-info { background-color: #ffe5dc; padding-top: 5vw; } .twlanding-pricing-blocks .pricing-block.Ultimate .tw-team-size { position: relative; top: -3.125vw; } .twlanding-pricing-blocks .pricing-block .pricing-block--includes { -ms-flex-positive: 1; flex-grow: 1; margin-top: 1px; padding: 3.4375vw 1.5625vw 5vw; min-height: 15.625vw; text-align: center; overflow: hidden; background-color: #f8fbfd; } .twlanding-pricing-blocks .pricing-block .pricing-block--includes h4 { margin-top: 2.8125vw; margin-bottom: 5.625vw; text-align: center; font-family: "LatoBold"; font-size: 6.875vw; color: #165b8b; } .twlanding-pricing-blocks .pricing-block .pricing-block--includes h3 { margin: 0 0 8.4375vw; font-family: "LatoRegular", sans-serif; font-size: 6.875vw; color: #165b8b; } .twlanding-pricing-blocks .pricing-block .pricing-block--includes ul { margin: 0 auto; padding: 0; max-width: 66.875vw; list-style: none; text-align: left; } } @media screen and (max-width: 735px) and (max-width: 1025px) { .twlanding-pricing-blocks .pricing-block .pricing-block--includes ul { max-width: 75%; } } @media screen and (max-width: 735px) and (max-width: 735px) { .twlanding-pricing-blocks .pricing-block .pricing-block--includes ul { padding: 0 4.6875vw 0 10.9375vw; max-width: 125vw; } } @media screen and (max-width: 735px) { .twlanding-pricing-blocks .pricing-block .pricing-block--includes ul li { position: relative; margin-bottom: 4.6875vw; padding: 0; font-size: 5.3125vw; color: #4b5155; } .twlanding-pricing-blocks .pricing-block .pricing-block--includes.tw-coming-soon { background-image: url("/img/front/coming-soon.svg"); background-position: 50%; background-size: 80%; background-repeat: no-repeat; } } @media screen and (max-width: 735px) and (min-width: 736px) { .twlanding-pricing-blocks .pricing-block .pricing-block--includes.tw-coming-soon { background-position: 50% 60px; } } @media screen and (max-width: 735px) and (max-width: 735px) { .twlanding-pricing-blocks .pricing-block .pricing-block--includes.tw-coming-soon { height: 78.125vw; background-size: auto 90%; } } @media screen and (max-width: 735px) { .twlanding-pricing-blocks .pricing-block .pricing-block--btn { text-align: center; padding: 8.125vw 0 4.6875vw 0; height: 23.75vw; } .twlanding-pricing-blocks .pricing-block .pricing-block--btn .tw-btn { min-width: 45vw; } .twlanding-pricing-blocks .pricing-block .pricing-block--btn p { margin: 0; font-size: 4.6875vw; text-align: center; color: #2c2f32; padding-top: 0.9375vw; } .twlanding-body .twlanding-pricing-content { padding-top: 6.25vw; padding-bottom: 9.375vw; background-color: #fff; } .twlanding-body .twlanding-pricing-content h5 { font-size: 5.625vw; margin-bottom: 3.75vw; } } @media screen and (max-width: 735px) and (min-width: 736px) { .twlanding-body .twlanding-pricing-content { padding-top: 7.8125vw; } } @media screen and (max-width: 735px) and (min-width: 1024px) { .twlanding-body .twlanding-pricing-content { padding-top: 15.3125vw; } .twlanding-body .twlanding-pricing-content h5 { font-size: 6.25vw; margin-top: 0; margin-bottom: 3.4375vw; } } @media screen and (max-width: 735px) { .twlanding-body .twlanding-pricing-content .wrap { max-width: 100%; } } @media screen and (max-width: 735px) and (min-width: 1024px) { .twlanding-body .twlanding-pricing-content .wrap { width: 990px; margin: auto; padding: 0 10px; } } @media screen and (max-width: 735px) { .twlanding-body .twlanding-pricing-content .period-switcher--title { margin-bottom: 6.25vw; } .twlanding-body .twlanding-pricing-content .checker-row { text-align: center; margin-bottom: 2.8125vw; } .twlanding-body .twlanding-pricing-content .checker-row .checker { margin-right: 0.625vw; height: auto; line-height: normal; font-size: 5vw; background-color: #e9edf0; display: inline-block; cursor: pointer; text-align: center; min-width: 42.1875vw; color: #767a7d; border-radius: 8px 0 0 8px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; transition: color 0.3s, background-color 0.3s; } } @media screen and (max-width: 735px) and (max-width: 320px) { .twlanding-body .twlanding-pricing-content .checker-row .checker { padding: 4px 3.125vw; min-width: 37.5vw; } } @media screen and (max-width: 735px) and (min-width: 736px) { .twlanding-body .twlanding-pricing-content .checker-row .checker { font-size: 7.5vw; min-width: 59.375vw; } } @media screen and (max-width: 735px) { .twlanding-body .twlanding-pricing-content .checker-row .checker:last-child { margin-right: 0; } .twlanding-body .twlanding-pricing-content .checker-row .checker.active, .twlanding-body .twlanding-pricing-content .checker-row .checker:hover, .twlanding-body .twlanding-pricing-content .checker-row .checker:focus, .twlanding-body .twlanding-pricing-content .checker-row .checker:active { color: #fff; background-color: #818e97; } .twlanding-body .twlanding-pricing-content .checker-row .checker + .checker { border-radius: 0 8px 8px 0; } .twlanding-body .twlanding-pricing-content .tw-top-short-info { margin-bottom: 5.3125vw; font-size: 4.6875vw; color: #6a7c89; } } @media screen and (max-width: 735px) and (min-width: 736px) { .twlanding-body .twlanding-pricing-content .tw-top-short-info { margin-bottom: 44px; font-size: 17px; } } @media screen and (max-width: 735px) { .twlanding-body .twlanding-pricing-content .vat-row { clear: both; margin-top: 22.5vw; margin-bottom: 2.5vw; color: #2c2f32; font-size: 4.6875vw; padding-top: 3.75vw; padding-bottom: 4.375vw; padding-left: 1.5625vw; padding-right: 1.5625vw; border-top: 1px solid #2c2f32; border-bottom: 1px solid #2c2f32; } .twlanding-body .twlanding-pricing-content .forall-row { background-color: #f8fbfd; padding: 4.0625vw 5vw 2.8125vw 4.375vw; margin-bottom: 6.25vw; } .twlanding-body .twlanding-pricing-content .forall-row h3 { font-family: "LatoBold", sans-serif; font-size: 6.875vw; color: #165b8b; text-align: left; margin-bottom: 5.625vw; margin-top: 0; } .twlanding-body .twlanding-pricing-content .forall-row .tw-list { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; list-style: none; padding: 0; margin: 0; } .twlanding-body .twlanding-pricing-content .forall-row .tw-list .tw-col { min-width: 123.125vw; } } @media screen and (max-width: 735px) and (max-width: 735px) { .twlanding-body .twlanding-pricing-content .forall-row .tw-list .tw-col { min-width: auto; } } @media screen and (max-width: 735px) { .twlanding-body .twlanding-pricing-content .forall-row .tw-list .tw-list-item { position: relative; color: #2c2f32; font-size: 5.3125vw; padding-left: 12.8125vw; margin-bottom: 2.8125vw; } } @media screen and (max-width: 735px) and (max-width: 735px) { .twlanding-body .twlanding-pricing-content .forall-row .tw-list .tw-list-item { padding-left: 6.5625vw; width: 100%; } } @media screen and (max-width: 735px) { .transition-cont .tw-loading-cover { padding-top: 22.8125vw; background-color: #fff; z-index: 0; } .transition-cont.tw-pricing-page.full-height { height: 312.5vw; } .transition-cont.tw-pricing-page.full-height .tw-loading-cover { -ms-flex-align: start; align-items: flex-start; padding-top: 78.125vw; height: 100%; } } .twlanding-body .press-kit-page .section-title { font-family: "LatoRegular"; color: #004373; padding-left: 0; margin: 0; margin-bottom: 10px; font-size: 36px; } @media screen and (max-width: 320px) { .twlanding-body .press-kit-page .section-title { margin-top: 30px; margin-bottom: 10px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .press-kit-page .section-title { margin-top: 9.375vw; margin-bottom: 3.125vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .press-kit-page .section-title { margin-top: 30px; margin-bottom: 40px; } } @media (min-width: 1024px) and (max-width: 1239px) { .twlanding-body .press-kit-page .section-title { margin-top: 30px; margin-bottom: 40px; } } @media (min-width: 1240px) { .twlanding-body .press-kit-page .section-title { margin-top: 30px; margin-bottom: 10px; } } .twlanding-body .press-kit-page .section-text { padding-top: 30px; padding-bottom: 73px; } .twlanding-body .press-kit-page .section-text .wrap { max-width: 1250px; } @media (min-width: 1024px) { .twlanding-body .press-kit-page .section-text .wrap { padding-right: 3px; } } @media (min-width: 1240px) { .twlanding-body .press-kit-page .section-text .wrap { padding-right: 10px; } } .twlanding-body .press-kit-page .section-text h2 { margin-top: -22px; } .twlanding-body .press-kit-page .section-text h3 { text-align: left; font-family: "LatoRegular"; margin-top: -6px; font-size: 26px; margin-bottom: 25px; } .twlanding-body .press-kit-page .section-text .press-kit-list { overflow: hidden; } .twlanding-body .press-kit-page .section-text .press-kit-list ul { padding: 0; margin: 0; list-style: none; text-align: left; padding-top: 10px; position: relative; } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .press-kit-page .section-text .press-kit-list ul { width: 50%; float: left; } } @media (min-width: 1024px) and (max-width: 1239px) { .twlanding-body .press-kit-page .section-text .press-kit-list ul { width: 50%; float: left; } } @media (min-width: 1240px) { .twlanding-body .press-kit-page .section-text .press-kit-list ul { width: 50%; float: left; } } .twlanding-body .press-kit-page .section-text .press-kit-list ul li { position: relative; font-size: 17px; color: #2c2f32; padding: 0; margin: 0; padding-left: 60px; margin-bottom: 10px; } @media screen and (max-width: 320px) { .twlanding-body .press-kit-page .section-text .press-kit-list ul li { padding-left: 60px; margin-bottom: 10px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .press-kit-page .section-text .press-kit-list ul li { padding-left: 18.75vw; margin-bottom: 3.125vw; font-size: 5.3125vw; } } .twlanding-body .press-kit-page .section-text .press-kit-list ul li:before { content: 'done_bold'; position: absolute; top: 0px; font-family: Trackabi; left: 35px; font-size: 18px; color: #2c2f32; /* Support for all WebKit browsers. */ -webkit-font-smoothing: antialiased !important; /* Support for Safari and Chrome. */ text-rendering: optimizeLegibility; /* Support for IE. */ font-feature-settings: 'liga'; } @media screen and (max-width: 320px) { .twlanding-body .press-kit-page .section-text .press-kit-list ul li:before { padding-left: 60px; margin-bottom: 10px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .press-kit-page .section-text .press-kit-list ul li:before { left: 10.9375vw; font-size: 4.6875vw; } } @media (min-width: 1240px) { .twlanding-body .press-kit-page .section-text .press-kit-list ul + ul { left: -30px; } } .twlanding-body .press-kit-page .section-text .social { background-color: #f6f8f9; position: relative; z-index: 1; padding: 30px; } @media screen and (max-width: 320px) { .twlanding-body .press-kit-page .section-text .social { margin-top: 60px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .press-kit-page .section-text .social { margin-top: 18.75vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .press-kit-page .section-text .social { margin-top: 60px; } } @media (min-width: 1024px) { .twlanding-body .press-kit-page .section-text .social { float: right; width: 284px; margin-left: -284px; height: 444px; right: 16px; } } .twlanding-body .press-kit-page .section-text .social h4 { font-size: 26px; line-height: 1.2; font-family: "LatoRegular"; color: #2c2f32; text-align: center; margin-bottom: 20px; } .twlanding-body .press-kit-page .section-text .social .socials { overflow: hidden; padding: 0 10px; } .twlanding-body .press-kit-page .section-text .social .socials .block { float: left; width: 50%; margin: 0; padding: 0; height: 110px; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .press-kit-page .section-text .social .socials .block { width: 25%; height: 70px; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .press-kit-page .section-text .social .socials .block { width: 25%; height: 70px; } } .twlanding-body .press-kit-page .section-text .social .socials .block img { width: 56px; } @media (min-width: 1024px) { .twlanding-body .press-kit-page .section-text .texter { float: left; padding-right: 354px; } } .twlanding-body .press-kit-page .section-logos { padding-top: 20px; padding-bottom: 28px; background-color: #f2f7fc; } .twlanding-body .press-kit-page .section-logos h2 { margin-top: 0; } @media (min-width: 1240px) { .twlanding-body .press-kit-page .section-logos h2 { margin-bottom: -20px; } } .twlanding-body .press-kit-page .section-logos p { font-size: 17px; text-align: center; } .twlanding-body .press-kit-page .section-logos .btn-row { text-align: center; padding-top: 35px; } .twlanding-body .press-kit-page .section-logos .logos { margin: auto; padding-top: 18px; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; padding-left: 10px; padding-right: 10px; } @media screen and (max-width: 320px) { .twlanding-body .press-kit-page .section-logos .logos { -ms-flex-direction: column; flex-direction: column; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .press-kit-page .section-logos .logos { -ms-flex-direction: column; flex-direction: column; } } @media (min-width: 1024px) and (max-width: 1239px) { .twlanding-body .press-kit-page .section-logos .logos { width: 990px; } } @media (min-width: 1240px) { .twlanding-body .press-kit-page .section-logos .logos { width: 990px; } } .twlanding-body .press-kit-page .section-logos .logos .block { height: 200px; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; background-color: #fff; } @media screen and (max-width: 320px) { .twlanding-body .press-kit-page .section-logos .logos .block { margin-bottom: 20px; width: 100%; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .press-kit-page .section-logos .logos .block { margin-bottom: 20px; width: 100%; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .press-kit-page .section-logos .logos .block { width: 32%; margin-left: 1%; margin-right: 1%; } } @media (min-width: 1024px) and (max-width: 1239px) { .twlanding-body .press-kit-page .section-logos .logos .block { width: 32%; margin-left: 1%; margin-right: 1%; } } @media (min-width: 1240px) { .twlanding-body .press-kit-page .section-logos .logos .block { width: 300px; margin-left: 22px; margin-right: 22px; } } .twlanding-body .press-kit-page .section-logos .logos .block.small img { width: 100px; } .twlanding-body .press-kit-page .section-logos .logos .block.horizontal img { width: 200px; } .twlanding-body .press-kit-page .section-logos .logos .block.square img { width: 150px; } .twlanding-body .press-kit-page .section-screenshots { padding-top: 60px; padding-bottom: 70px; } @media (min-width: 1240px) { .twlanding-body .press-kit-page .section-screenshots h2 { margin-bottom: 3px; } } .twlanding-body .press-kit-page .section-screenshots .btn-row { text-align: center; padding-top: 38px; } .twlanding-body .press-kit-page .section-screenshots .screenshots { margin: auto; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center; padding-left: 10px; padding-right: 10px; } @media screen and (max-width: 320px) { .twlanding-body .press-kit-page .section-screenshots .screenshots { -ms-flex-direction: column; flex-direction: column; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .press-kit-page .section-screenshots .screenshots { -ms-flex-direction: column; flex-direction: column; } } @media (min-width: 1240px) { .twlanding-body .press-kit-page .section-screenshots .screenshots { width: 1116px; } } .twlanding-body .press-kit-page .section-screenshots .screenshots .block { border: 1px solid #c7dbee; } @media screen and (max-width: 320px) { .twlanding-body .press-kit-page .section-screenshots .screenshots .block { width: 100%; height: auto; margin-bottom: 20px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .press-kit-page .section-screenshots .screenshots .block { width: 100%; height: auto; margin-bottom: 20px; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .press-kit-page .section-screenshots .screenshots .block { width: 32%; margin-left: 1%; margin-right: 1%; height: auto; } } @media (min-width: 1024px) and (max-width: 1239px) { .twlanding-body .press-kit-page .section-screenshots .screenshots .block { width: 32%; height: auto; margin-left: 1%; margin-right: 1%; } } @media (min-width: 1240px) { .twlanding-body .press-kit-page .section-screenshots .screenshots .block { width: 346px; height: auto; margin-left: 20px; margin-right: 20px; } } .twlanding-body .press-kit-page .section-screenshots .screenshots .block img { width: 100%; display: block; } .twlanding-profile-content .tw-personal-details .tw-form { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; margin-top: 31px; } @media (max-width: 850px) { .twlanding-profile-content .tw-personal-details .tw-form { -ms-flex-wrap: wrap; flex-wrap: wrap; } } .twlanding-profile-content .tw-personal-details .tw-form .tw-col.tw-avatar { width: 293px; transition: width 0.3s; } @media (max-width: 1000px) { .twlanding-profile-content .tw-personal-details .tw-form .tw-col.tw-avatar { width: 230px; } } .twlanding-profile-content .tw-personal-details .tw-form .tw-fields { margin-top: -12px; } @media (max-width: 850px) { .twlanding-profile-content .tw-personal-details .tw-form .tw-fields { margin-top: 0px; width: 100%; } } .twlanding-profile-content .tw-personal-details .tw-form .tw-col.tw-avatar { line-height: 1; overflow: visible; border-radius: 0; } .tw-my-profile-page--landing .twlanding-profile-content { padding-top: 0px; padding-bottom: 50px; background-color: #fff; } .tw-my-profile-page--landing .twlanding-profile-content .tw-tabs { z-index: 0; } @media (min-width: 736px) { .tw-my-profile-page--landing .twlanding-profile-content .tw-tabs .tw-vertical, .tw-my-profile-page--landing .twlanding-profile-content .tw-tabs .tw-tabs-cont { min-width: 240px; } } .tw-my-profile-page--landing .twlanding-profile-content .tw-tabs .tw-vertical + .tw-tabs-cont-wrapper, .tw-my-profile-page--landing .twlanding-profile-content .tw-tabs .tw-tabs-cont + .tw-tabs-cont-wrapper { padding-top: 0; } .tw-my-profile-page--landing .twlanding-profile-content .tw-tabs .tw-tabs-cont .tw-tab { border-right-width: 0 !important; } @media (min-width: 736px) { .tw-my-profile-page--landing .twlanding-profile-content .tw-tabs .tw-tabs-cont .tw-tab { border: 0; } } .tw-my-profile-page--landing .twlanding-profile-content .tw-tabs .tw-tabs-cont .tw-tab button { border-radius: 1px !important; } @media (min-width: 736px) { .tw-my-profile-page--landing .twlanding-profile-content .tw-tabs .tw-tabs-cont .tw-tab button span { color: #165b8b !important; font-size: 20px !important; padding: 1px 7px !important; } } .tw-my-profile-page--landing .twlanding-profile-content .tw-tabs .tw-tabs-cont .tw-tab button:hover { background-color: #eff4f9 !important; } @media (min-width: 736px) { .tw-my-profile-page--landing .twlanding-profile-content .tw-tabs .tw-tabs-cont .tw-tab.primary button { background-color: #4679a9 !important; } .tw-my-profile-page--landing .twlanding-profile-content .tw-tabs .tw-tabs-cont .tw-tab.primary button span { color: #fff !important; } } @media (min-width: 736px) { .tw-my-profile-page--landing .twlanding-profile-content .tw-tabs .tw-tabs-cont .tw-tab.secondary button { background-color: #fff !important; } } .tw-my-profile-page--landing .twlanding-profile-content .tw-tabs .tw-tabs-cont .tw-tab.secondary button:hover { background-color: #eff4f9 !important; } @media (min-width: 736px) { .tw-my-profile-page--landing .twlanding-profile-content .tw-tabs .tw-vertical .tw-scrollbars:before { border-right: 1px solid #eff4f9; } } @media (min-width: 736px) { .tw-my-profile-page--landing .twlanding-profile-content .tw-tabs .tw-vertical .tw-ink-bar { display: none; } } @media (min-width: 736px) { .tw-my-profile-page--landing .twlanding-profile-content .tw-tabs .tw-vertical .tw-ink-bar-cont .tw-ink:after, .tw-my-profile-page--landing .twlanding-profile-content .tw-tabs .tw-vertical .tw-ink-bar .tw-ink:after { display: none; } } .tw-my-profile-page--landing .twlanding-profile-content .wrap { padding: 30px 25px; } @media (min-width: 1250px) { .tw-my-profile-page--landing .twlanding-profile-content .wrap { padding-left: 0; padding-right: 0; } } .tw-my-profile-page--landing .twlanding-profile-content .wrap .tw-container { padding-left: 25px; margin: 0; } @media (max-width: 767px) { .tw-my-profile-page--landing .twlanding-profile-content .wrap .tw-container { padding-left: 0; } } .tw-my-profile-page--landing .twlanding-profile-content .wrap .tw-top-bar { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; } .tw-my-profile-page--landing .twlanding-profile-content .wrap .tw-top-bar h1 { margin: 0; font-family: "LatoRegular"; font-size: 32px; color: #2c2f32; padding: 0 15px 0 15px; } @media (max-width: 735px) { .tw-my-profile-page--landing .twlanding-profile-content .wrap .tw-top-bar h1 { padding-left: 0; padding-bottom: 10px; font-size: 7.8125vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-my-profile-page--landing .twlanding-profile-content .wrap .tw-top-bar h1 { font-size: 3.125vw; } } @media (min-width: 736px) { .tw-my-profile-page--landing .twlanding-profile-content .wrap .tw-top-bar .button-row { padding-left: 15px; } } @media (min-width: 1024px) { .tw-my-profile-page--landing .twlanding-profile-content .wrap .tw-top-bar .button-row { padding-left: 0; } } .tw-my-profile-page--landing .twlanding-profile-content .wrap .tw-top-bar .button-row .tw-btn { cursor: pointer; } @media (min-width: 736px) { .tw-my-profile-page--landing .twlanding-profile-content .wrap .tw-top-bar .button-row .tw-btn { padding-left: 25px; padding-right: 25px; width: auto; position: relative; } } .tw-my-profile-page--landing .twlanding-profile-content .wrap .tw-top-bar .button-row .tw-btn + .tw-btn { margin-left: 12px; } @media (min-width: 736px) { .tw-my-profile-page--landing .twlanding-profile-content .tw-form { margin-top: 50px; padding-left: 18px; } } @media (min-width: 736px) { .tw-my-profile-page--landing .twlanding-profile-content .tw-form .tw-front-text-field { margin-bottom: 27px; } } .tw-my-profile-page--landing .twlanding-profile-content .tw-form .tw-image-picker .tw-img-piker-group { margin-top: 12px; } .tw-my-profile-page--landing .twlanding-profile-content .tw-form .tw-image-picker .tw-img-piker-group .tw-img-piker-group--inner { width: 174px; height: 174px; } .tw-my-profile-page--landing .twlanding-profile-content .tw-form .tw-image-picker .tw-img-piker-group .tw-img-piker-group--inner .tw-avatar > div img { height: 164px !important; width: 164px !important; } .tw-my-profile-page--landing .twlanding-profile-content .tw-form .tw-image-picker .tw-img-piker-group .tw-img-piker-group--inner .tw-edit-btn { top: 0; right: 2px; } .tw-my-profile-page--landing .twlanding-profile-content .tw-form .tw-image-picker .tw-img-piker-group .tw-img-piker-group--inner .tw-edit-btn button { width: 29px !important; height: 29px !important; } .tw-my-profile-page--landing .twlanding-profile-content .tw-form .tw-image-picker .tw-slider { position: relative; left: 9px; } .tw-my-profile-page--landing .twlanding-profile-content .tw-form .tw-image-picker .tw-slider > div { margin-top: 10px !important; margin-bottom: 7px !important; } .tw-my-profile-page--landing .twlanding-profile-content .tw-form .tw-image-picker .tw-slider > div > div > div:nth-of-type(3)[style*='left: 0%'] { width: 12px !important; height: 12px !important; border: 1px solid #bdbdbd !important; } .tw-my-profile-page--landing .twlanding-profile-content .tw-fields { max-width: 100%; } @media (min-width: 736px) { .tw-my-profile-page--landing .twlanding-profile-content .tw-fields { width: 300px; } } @media (min-width: 736px) { .tw-my-profile-page--landing .twlanding-profile-content .tw-fields .tw-front-text-field input { font-size: 16px; } } .twlanding-body .content .tw-not-found-page { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 1; flex-grow: 1; -ms-flex-negative: 1; flex-shrink: 1; top: 0; left: 0; padding: 123px 0; height: 100%; background-color: #fff; } .twlanding-body .content .tw-not-found-page h1 { margin: 0; font-size: 32px; font-family: "LatoBold", sans-serif; font-weight: 400; text-align: center; color: #c2c5c7; } @media (min-width: 736px) { .twlanding-body .content .tw-not-found-page h1 { font-size: 72px; } } .twlanding-body .content .tw-not-found-page p { margin-top: 22px; font-family: "LatoRegular", sans-serif; font-size: 16px; text-align: center; color: #c2c5c7; } @media (min-width: 736px) { .twlanding-body .content .tw-not-found-page p { font-size: 23px; } } .tw-two-cols-layout { font-family: "LatoRegular", sans-serif; } .tw-two-cols-layout .tw-row { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; font-size: 15px; line-height: 1.45; color: #2c2f32; } .tw-two-cols-layout .tw-topic { -ms-flex-positive: 1; flex-grow: 1; } .tw-two-cols-layout .tw-related-articles h2, .tw-two-cols-layout .tw-topic-content h2 { text-align: left; font-size: 22px; font-family: "LatoRegular"; margin: 33px 0 0px; padding-left: 0; padding-bottom: 0; } @media (min-width: 321px) and (max-width: 735px) { .tw-two-cols-layout .tw-related-articles h2, .tw-two-cols-layout .tw-topic-content h2 { font-size: 6.875vw; } } .tw-two-cols-layout .tw-related-articles h3, .tw-two-cols-layout .tw-topic-content h3 { text-align: left; font-family: "LatoRegular"; font-size: 18px; } @media (min-width: 321px) and (max-width: 735px) { .tw-two-cols-layout .tw-related-articles h3, .tw-two-cols-layout .tw-topic-content h3 { font-size: 5.625vw; } } .tw-two-cols-layout .tw-related-articles p, .tw-two-cols-layout .tw-related-articles ul li, .tw-two-cols-layout .tw-topic-content p, .tw-two-cols-layout .tw-topic-content ul li { font-size: 17px; line-height: 1.4; } .tw-two-cols-layout .tw-related-articles ul li, .tw-two-cols-layout .tw-topic-content ul li { margin-bottom: 10px; } .tw-two-cols-layout .tw-related-articles ul li > ul, .tw-two-cols-layout .tw-topic-content ul li > ul { margin-top: 10px; margin-bottom: 0; } .tw-two-cols-layout .tw-related-articles .p--note, .tw-two-cols-layout .tw-topic-content .p--note { display: block; margin-top: 29px; margin-left: 30px; margin-right: 26px; background-color: #f7f9fb; color: #2c2f32; padding: 11px 10px 11px 50px; position: relative; font-size: 16px; min-height: 50px; border: 1px solid #d9e4ef; } .tw-two-cols-layout .tw-related-articles .p--note::before, .tw-two-cols-layout .tw-topic-content .p--note::before { display: block; content: ''; position: absolute; left: 14px; top: 13px; width: 30px; height: 40px; background-image: url("/img/front/info-circle-theme.svg"); background-repeat: no-repeat; background-size: 23px; } .tw-two-cols-layout .tw-related-articles .p--pre, .tw-two-cols-layout .tw-topic-content .p--pre { display: block; margin-top: 29px; margin-left: 30px; margin-right: 26px; background-color: #fefdf4; color: #2c2f32; padding: 11px 20px 11px 20px; position: relative; font-size: 16px; min-height: 50px; border: 1px solid #f3eec5; overflow-x: auto; } .tw-two-cols-layout .tw-related-articles .p--pre pre, .tw-two-cols-layout .tw-topic-content .p--pre pre { margin: 0; } .tw-two-cols-layout .tw-related-articles img, .tw-two-cols-layout .tw-topic-content img { max-width: 100%; height: auto; } .tw-two-cols-layout .tw-help-landing .tw-row p:first-of-type { margin-top: 0; } .tw-two-cols-layout .tw-help-section .tw-help-section-title { margin: 37px 0 25px; font-size: 28px; color: #2c2f32; } .tw-two-cols-layout .tw-help-section .tw-cols { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; } @media (max-width: 735px) { .tw-two-cols-layout .tw-help-section .tw-cols { -ms-flex-wrap: wrap; flex-wrap: wrap; } } .tw-two-cols-layout .tw-help-section .tw-topics-list { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; margin: 0; padding: 0; list-style-type: none; width: 100%; } .tw-two-cols-layout .tw-help-section .tw-topics-list > li { position: relative; margin-bottom: 7px; padding-left: 20px; } .tw-two-cols-layout .tw-help-section .tw-topics-list > li:after { content: 'keyboard_arrow_up'; transform: rotate(90deg); color: #2c2f32; font-size: 12px; display: block; position: absolute; top: 3px; left: 1px; font-family: Trackabi; /* Support for all WebKit browsers. */ -webkit-font-smoothing: antialiased !important; /* Support for Safari and Chrome. */ text-rendering: optimizeLegibility; /* Support for IE. */ font-feature-settings: 'liga'; } @media (max-width: 320px) { .tw-two-cols-layout .tw-help-section .tw-topics-list > li:after { top: 2px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-two-cols-layout .tw-help-section .tw-topics-list > li:after { top: 0.625vw; font-size: 3.75vw; } } .tw-two-cols-layout .tw-help-section .tw-topics-list > li > a { display: inline-block; text-decoration: none; color: #165b8b; } .tw-two-cols-layout .tw-help-section .tw-topics-list > li > a:hover, .tw-two-cols-layout .tw-help-section .tw-topics-list > li > a:focus, .tw-two-cols-layout .tw-help-section .tw-topics-list > li > a:active { text-decoration: underline; } .tw-two-cols-layout .tw-topic-section-title { margin: 7px 0 0; font-family: "LatoRegular", sans-serif; font-size: 20px; text-align: left; color: #7a8792; } @media (min-width: 321px) and (max-width: 735px) { .tw-two-cols-layout .tw-topic-section-title { font-size: 6.25vw; } } .tw-two-cols-layout .tw-topic-title { margin: 0 0 30px; font-family: "LatoRegular", sans-serif; color: #2c2f32; font-size: 24px; line-height: 1.2; } @media (min-width: 321px) and (max-width: 735px) { .tw-two-cols-layout .tw-topic-title { font-size: 7.5vw; } } .tw-two-cols-layout .tw-content-wrap-light p, .tw-two-cols-layout .tw-content-wrap-light ul li { font-size: 15px; line-height: normal; } @media (min-width: 321px) and (max-width: 735px) { .tw-two-cols-layout .tw-content-wrap-light p, .tw-two-cols-layout .tw-content-wrap-light ul li { font-size: 4.6875vw; padding-left: 6.25vw !important; } } .tw-two-cols-layout .tw-topic-wrap { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; padding-bottom: 75px; overflow: hidden; width: 100%; padding-top: 30px; } @media (max-width: 735px) { .tw-two-cols-layout .tw-topic-wrap { -ms-flex-wrap: wrap; flex-wrap: wrap; } } .tw-two-cols-layout .tw-topic-wrap .tw-help-landing { padding-top: 20px; } @media (max-width: 735px) { .tw-two-cols-layout .tw-topic-wrap .tw-help-landing { padding-top: 0; } } .tw-two-cols-layout .tw-no-top-offset .tw-topic-nav { top: -36px; margin-bottom: 20px; } .tw-two-cols-layout .tw-no-top-offset .tw-topic-nav:after { top: 3px; } .tw-two-cols-layout .tw-topic { width: 100%; } .tw-two-cols-layout .tw-topic-nav { -ms-flex-negative: 0; flex-shrink: 0; margin-bottom: 25px; width: 100%; position: relative; top: -30px; } @media (max-width: 735px) { .tw-two-cols-layout .tw-topic-nav .tw-topic-nav--jobs { width: 90.625vw; height: 100.625vw; } } @media (max-width: 735px) { .tw-two-cols-layout .tw-topic-nav .tw-topic-nav--roadmap { width: 90.625vw; height: 99.0625vw; } } @media (max-width: 735px) { .tw-two-cols-layout .tw-topic-nav .tw-topic-nav--about { width: 90.625vw; height: 69.6875vw; } } .tw-two-cols-layout .tw-topic-nav.tw-right-side { margin-top: 25px; margin-bottom: 0; } .tw-two-cols-layout .tw-topic-nav .tw-btn { display: block; margin-bottom: 6px; } .tw-two-cols-layout .tw-topic-nav .tw-top-nav { margin-bottom: 25px; } .tw-two-cols-layout .tw-topic-nav .tw-help-section { padding: 0 10px 0 0; } .tw-two-cols-layout .tw-topic-nav .tw-help-section .tw-help-section-title { margin: 0 0 23px; font-size: 20px; color: #7a8792; text-decoration: none; } .tw-two-cols-layout .tw-topic-nav .tw-help-section .tw-help-section-title a { margin: 0; font-size: 30px; color: #004373; text-decoration: none; font-family: "LatoRegular"; } .tw-two-cols-layout .tw-topic-nav .tw-help-section .tw-topics-list { display: block; margin: 4px 0 5px; } .tw-two-cols-layout .tw-topic-nav .tw-help-section .tw-topics-list > li { margin-left: 0; margin-bottom: 0; padding-right: 0; width: auto; font-size: 20px; } .tw-two-cols-layout .tw-topic-nav .tw-help-section .tw-topics-list > li ul > li:last-child { margin-bottom: 0; } .tw-two-cols-layout .tw-topic-nav .tw-help-section .tw-topics-list > li > div { line-height: 1.3; cursor: pointer; } .tw-two-cols-layout .tw-topic-nav .tw-help-section .tw-topics-list > li:before { display: none; } .tw-two-cols-layout .tw-topic-nav .tw-help-section .tw-topics-list > li:after { top: 5px; left: 2px; content: 'keyboard_arrow_up'; color: #2c2f32; font-size: 12px; transform: rotate(90deg); transition: transform 0.3s; } .tw-two-cols-layout .tw-topic-nav .tw-help-section .tw-topics-list > li.tw-expanded:after { top: 3px; left: 2px; transform: rotate(180deg); transition: transform 0.3s; } .tw-two-cols-layout .tw-topic-nav .tw-help-section .tw-topics-list > li a { font-size: 20px; color: #2c2f32; } .tw-two-cols-layout .tw-topic-nav .tw-help-section .tw-topics-list > li ul { margin: 0; padding-left: 0; list-style-type: none; padding-top: 5px; } .tw-two-cols-layout .tw-topic-nav .tw-help-section .tw-topics-list > li ul li { margin-top: 4px; margin-bottom: 0; min-height: 28px; } .tw-two-cols-layout .tw-topic-nav .tw-help-section .tw-topics-list > li ul li a { display: block; padding: 4px 6px 3px; font-size: 14px; line-height: 1.2; text-decoration: none; color: #165b8b; } .tw-two-cols-layout .tw-topic-nav .tw-help-section .tw-topics-list > li ul li:hover a, .tw-two-cols-layout .tw-topic-nav .tw-help-section .tw-topics-list > li ul li:focus a { background-color: #eff4f9; } .tw-two-cols-layout .tw-topic-nav .tw-help-section .tw-topics-list > li ul li.active a, .tw-two-cols-layout .tw-topic-nav .tw-help-section .tw-topics-list > li ul li a:active { color: #fff; background-color: #4679a9; } .tw-two-cols-layout .tw-btn.tw-list-icon { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; padding-left: 5px; padding-right: 5px; } .tw-two-cols-layout .tw-btn.tw-list-icon .tw-material-icons { margin-right: 4px; border-radius: 2px; height: 16px; width: 18px; font-size: 12px; line-height: 16px; color: #fff; background-color: #165b8b; } .tw-two-cols-layout .tw-btn.tw-list-icon .tw-material-icons.tw-add-new-btn { width: 16px; } .tw-two-cols-layout .tw-ticket-title { position: relative; padding: 7px 105px 9px 8px; font-family: "LatoBold", sans-serif; font-size: 19px; line-height: 1; color: #165b8b; background-color: #e0ebf5; } .tw-two-cols-layout .tw-ticket-status { border-radius: 5px; margin-right: 10px; padding: 3px 9px 3px; font-size: 14px; color: #fff; background-color: #009661; float: right; margin-top: 7px; } .tw-two-cols-layout .tw-ticket-status.tw-ts-not-replied { background-color: #ff6000; } .tw-two-cols-layout .tw-ticket-status.tw-ts-closed { color: #fff; background-color: #bec5cc; } .tw-two-cols-layout .wrap-middle { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; } .tw-two-cols-layout .tw-top-nav--horizontal { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: end; justify-content: flex-end; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; -ms-flex-item-align: end; -webkit-box-align: end; align-self: flex-end; margin-right: -70px; padding-top: 5px; z-index: 10; } .tw-two-cols-layout .tw-top-nav--horizontal > div { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; } @media (max-width: 1000px) { .tw-two-cols-layout .tw-top-nav--horizontal { padding: 0 30px; } } @media screen and (max-width: 735px) { .tw-two-cols-layout .tw-top-nav--horizontal { padding: 0; display: block; text-align: right; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-align: start; align-items: flex-start; margin: 0; width: 100%; } .tw-two-cols-layout .tw-top-nav--horizontal .tw-btn { -ms-flex-pack: end !important; justify-content: flex-end !important; } } .tw-two-cols-layout .tw-top-nav--horizontal label { font-size: 18px; color: #6a7c89; margin-right: 10px; display: inline-block; } @media screen and (max-width: 735px) { .tw-two-cols-layout .tw-top-nav--horizontal label { margin-left: 19px; margin-bottom: 20px; } } .tw-two-cols-layout .tw-top-nav--horizontal label:before { display: inline-block; content: ''; background-image: url("/img/front/life-ring-theme.svg"); background-repeat: no-repeat; background-position: 0 0; position: relative; width: 18px; height: 18px; background-size: 18px; left: -8px; top: 3px; } .tw-two-cols-layout .tw-top-nav--horizontal .tw-btn { width: auto; padding: 0 16px; background-color: #eff4f9; margin-left: 7px; border-radius: 6px; height: 32px; line-height: 32px; transition: color 0s; } .tw-two-cols-layout .tw-top-nav--horizontal .tw-btn:hover { background-color: #e0ebf5; } .tw-two-cols-layout .tw-top-nav--horizontal .tw-btn:active, .tw-two-cols-layout .tw-top-nav--horizontal .tw-btn.active { color: #fff; background-color: #4679a9; } @media screen and (max-width: 735px) { .tw-two-cols-layout .tw-top-nav--horizontal .tw-btn { padding: 0 10px; margin-bottom: 20px; height: auto; line-height: normal; } } @media (min-width: 736px) { .tw-two-cols-layout .tw-row { -ms-flex-wrap: none; flex-wrap: nowrap; font-size: 17px; } .tw-two-cols-layout .tw-help-landing .tw-help-section .tw-topics-list { width: 50%; } } @media (min-width: 736px) and (min-width: 1024px) { .tw-two-cols-layout .tw-topic { padding-top: 10px; } } @media (min-width: 736px) { .tw-two-cols-layout .tw-content-wrap-light h2 { font-size: 30px; } .tw-two-cols-layout .tw-content-wrap-light h3 { font-size: 23px; } .tw-two-cols-layout .tw-content-wrap-light h4 { margin: 25px 0 10px; text-align: left; } .tw-two-cols-layout .tw-content-wrap-light h5 { margin: 20px 0 10px; text-align: left; } .tw-two-cols-layout .tw-topic-section-title { font-size: 22px; } .tw-two-cols-layout .tw-topic-title { font-size: 34px; margin-bottom: 44px; } .tw-two-cols-layout .tw-content-wrap-light { padding-left: 25px; padding-right: 25px; padding-top: 32px; } } @media (min-width: 736px) and (min-width: 1024px) { .tw-two-cols-layout .tw-content-wrap-light { padding-top: 12px; } } @media (min-width: 736px) { .tw-two-cols-layout .tw-content-wrap-light p, .tw-two-cols-layout .tw-content-wrap-light ul li { font-size: 17px; } } @media (min-width: 736px) and (min-width: 1024px) { .tw-two-cols-layout .tw-topic-wrap { position: relative; top: -30px; width: 100%; } .tw-two-cols-layout .tw-topic-wrap.tw-no-top-offset { top: 0; } } @media (min-width: 736px) { .tw-two-cols-layout .tw-topic { width: calc(100% - 300px); } } @media (min-width: 736px) and (max-width: 1024px) { .tw-two-cols-layout .tw-top-nav--horizontal { -ms-flex-item-align: center; -webkit-box-align: center; -ms-grid-row-align: center; align-self: center; width: 100vw; margin-right: 0; } } @media (min-width: 736px) { .tw-two-cols-layout .tw-topic-nav { margin-right: 58px; width: 240px; padding-right: 24px; } .tw-two-cols-layout .tw-topic-nav:after { content: ''; display: block; position: absolute; top: 0; right: 0; width: 2px; height: 2000px; background-color: #eff4f9; } .tw-two-cols-layout .tw-topic-nav.tw-right-side { margin-right: 0; margin-left: 46px; margin-top: 0; } .tw-two-cols-layout .tw-topic-nav .tw-help-section { padding-right: 0; } } @media (min-width: 736px) { .page-with-sticky-sidebar { overflow: visible; } .page-with-sticky-sidebar .tw-two-cols-layout .tw-topic-wrap { position: relative; overflow: visible; min-height: calc(100vh - 350px); } .page-with-sticky-sidebar .tw-two-cols-layout .tw-topic-wrap .tw-topic-nav { margin-bottom: 0; /* Safari */ position: sticky; top: 70px; bottom: 0; } .page-with-sticky-sidebar .tw-two-cols-layout .tw-topic-wrap .tw-topic-nav:after { height: 100vh; } } @media screen and (max-width: 735px) { .tw-help-page { font-family: "LatoRegular", sans-serif; } .tw-help-page .tw-row { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; font-size: 4.6875vw; line-height: 1.45; color: #2c2f32; } } @media screen and (max-width: 735px) and (min-width: 736px) { .tw-help-page .tw-row { -ms-flex-wrap: none; flex-wrap: nowrap; font-size: 5.3125vw; } } @media screen and (max-width: 735px) and (min-width: 736px) { .tw-help-page .tw-help-landing .tw-help-section .tw-topics-list { width: 50%; } } @media screen and (max-width: 735px) { .tw-help-page .tw-topic-content h3 { text-align: left; font-size: 8.125vw; font-family: "LatoRegular"; } .tw-help-page .tw-topic-content p, .tw-help-page .tw-topic-content ul li { font-size: 5.3125vw; line-height: 1.4; } .tw-help-page .tw-topic-content ul li { margin-bottom: 3.125vw; } .tw-help-page .tw-topic-content ul li > ul { margin-top: 3.125vw; margin-bottom: 0; } .tw-help-page .tw-topic-content .p--note { display: block; margin-top: 9.0625vw; margin-left: 9.375vw; margin-right: 8.125vw; background-color: #f7f9fb; color: #2c2f32; padding: 3.4375vw 3.125vw 3.4375vw 15.625vw; position: relative; font-size: 5vw; min-height: 15.625vw; border: 1px solid #d9e4ef; } .tw-help-page .tw-topic-content .p--note::before { display: block; content: ''; position: absolute; left: 4.375vw; top: 4.0625vw; width: 9.375vw; height: 12.5vw; background-image: url("/img/front/info-circle-theme.svg"); background-repeat: no-repeat; background-size: 7.1875vw; } .tw-help-page .tw-help-landing .tw-row p:first-of-type { margin-top: 0; } .tw-help-page .tw-help-section .tw-help-section-title { margin: 11.5625vw 0 7.8125vw; font-size: 8.75vw; color: #2c2f32; } .tw-help-page .tw-help-section .tw-cols { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; } } @media screen and (max-width: 735px) and (max-width: 735px) { .tw-help-page .tw-help-section .tw-cols { -ms-flex-wrap: wrap; flex-wrap: wrap; } } @media screen and (max-width: 735px) { .tw-help-page .tw-help-section .tw-topics-list { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; margin: 0; padding: 0; list-style-type: none; width: 100%; } } @media screen and (max-width: 735px) and (min-width: 736px) { .tw-help-page .tw-help-section .tw-topics-list { margin-left: -33px; margin-right: -33px; } } @media screen and (max-width: 735px) { .tw-help-page .tw-help-section .tw-topics-list > li { position: relative; margin-bottom: 2.1875vw; padding-left: 6.25vw; } } @media screen and (max-width: 735px) and (min-width: 736px) { .tw-help-page .tw-help-section .tw-topics-list > li { margin-left: 53px; padding-right: 42px; } } @media screen and (max-width: 735px) { .tw-help-page .tw-help-section .tw-topics-list > li:after { content: 'keyboard_arrow_up'; transform: rotate(90deg); color: #2c2f32; font-size: 3.75vw; display: block; position: absolute; top: 0.9375vw; left: 1px; font-family: Trackabi; /* Support for all WebKit browsers. */ -webkit-font-smoothing: antialiased !important; /* Support for Safari and Chrome. */ text-rendering: optimizeLegibility; /* Support for IE. */ font-feature-settings: 'liga'; } .tw-help-page .tw-help-section .tw-topics-list > li > a { display: inline-block; font-size: 5.625vw; line-height: 1; text-decoration: none; color: #165b8b; } .tw-help-page .tw-help-section .tw-topics-list > li > a:hover, .tw-help-page .tw-help-section .tw-topics-list > li > a:focus, .tw-help-page .tw-help-section .tw-topics-list > li > a:active { text-decoration: underline; } .tw-help-page h3.tw-topic-section-title { margin: 2.1875vw 0 0; font-family: "LatoRegular", sans-serif; font-size: 6.875vw; text-align: left; color: #7a8792; } .tw-help-page h2.tw-topic-title { margin: 0 0 9.375vw; font-family: "LatoRegular", sans-serif; font-size: 10.625vw; color: #2c2f32; } .tw-help-page .tw-content-wrap-light p, .tw-help-page .tw-content-wrap-light ul li { font-size: 4.6875vw; } .tw-help-page .tw-topic-wrap { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; padding-bottom: 23.4375vw; overflow: hidden; padding-top: 9.375vw; } } @media screen and (max-width: 735px) and (max-width: 735px) { .tw-help-page .tw-topic-wrap { -ms-flex-wrap: wrap; flex-wrap: wrap; } } @media screen and (max-width: 735px) { .tw-help-page .tw-topic-wrap .tw-help-landing { padding-top: 7.8125vw; } } @media screen and (max-width: 735px) and (max-width: 735px) { .tw-help-page .tw-topic-wrap .tw-help-landing { padding-top: 0; } } @media screen and (max-width: 735px) { .tw-help-page .tw-btn { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: center; justify-content: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; padding-left: 1.5625vw; padding-right: 1.5625vw; } .tw-help-page .tw-btn .tw-material-icons { margin-right: 1.25vw; border-radius: 0.625vw; height: 5vw; width: 5.625vw; font-size: 3.75vw; line-height: 5vw; color: #fff; background-color: #165b8b; } .tw-help-page .tw-ticket-title { position: relative; padding: 2.1875vw 32.8125vw 2.8125vw 2.5vw; font-family: "LatoBold", sans-serif; font-size: 5.9375vw; line-height: 1; color: #165b8b; background-color: #ecf1f4; } .tw-help-page .tw-ticket-status { border-radius: 1.5625vw; margin-right: 3.125vw; padding: 0.3125vw 2.8125vw 0.9375vw; font-size: 4.375vw; color: #fff; background-color: #009661; } .tw-help-page .tw-ticket-status.tw-ts-not-replied { background-color: #ff6000; } .tw-help-page .tw-ticket-status.tw-ts-closed { color: #fff; background-color: #bec5cc; } .tw-help-page .wrap--buttons-line { padding: 0; max-width: 375vw; margin: auto; } .tw-help-page .tw-top-nav--horizontal { text-align: center; display: block; padding-right: 0; margin-bottom: 4.6875vw; z-index: 10; } .tw-help-page .tw-top-nav--horizontal a { -ms-flex-pack: end !important; justify-content: flex-end !important; } .tw-help-page .tw-top-nav--horizontal label { display: block; width: 100%; margin-bottom: 4.6875vw; font-size: 5vw; margin-right: 0; } .tw-help-page .tw-top-nav--horizontal label:before { width: 5vw; height: 5vw; background-size: 5vw; left: -2.5vw; top: 0.9375vw; } .tw-help-page .tw-top-nav--horizontal .tw-btn { display: inline-block; height: 10vw; font-size: 5vw; line-height: 10vw; padding: 0 5vw; margin: 0 1.5625vw; margin-left: 0; margin-right: 5px; } .tw-help-page .tw-top-nav--horizontal .tw-btn + .tw-btn { margin-left: 1.5625vw; margin-right: 0; } } .tw-topic-nav { -ms-flex-negative: 0; flex-shrink: 0; margin-bottom: 7.8125vw; width: 100%; position: relative; top: -9.375vw; } .tw-topic-nav.tw-right-side { margin-top: 7.8125vw; margin-bottom: 0; } .tw-topic-nav .tw-btn { display: block; margin-bottom: 1.875vw; } @media (max-width: 735px) { .tw-topic-nav .tw-btn { width: 100%; } } .tw-topic-nav .tw-top-nav { margin-bottom: 7.8125vw; } .tw-topic-nav .tw-help-section { padding: 0 3.125vw 0 0; } @media (min-width: 736px) { .tw-topic-nav .tw-help-section { padding-right: 0; } } .tw-topic-nav .tw-help-section .tw-help-section-title { margin: 0 0 5.3125vw; font-size: 6.25vw; color: #7a8792; text-decoration: none; } .tw-topic-nav .tw-help-section .tw-help-section-title a { margin: 0; font-size: 9.375vw; color: #004373; text-decoration: none; font-family: "LatoRegular"; } .tw-topic-nav .tw-help-section .tw-topics-list { display: block; margin: 1.25vw 0 1.5625vw; } .tw-topic-nav .tw-help-section .tw-topics-list > li { margin-left: 0; margin-bottom: 0; padding-right: 0; width: auto; font-size: 6.25vw; } .tw-topic-nav .tw-help-section .tw-topics-list > li ul > li:last-child { margin-bottom: 0; } .tw-topic-nav .tw-help-section .tw-topics-list > li > div { cursor: pointer; } .tw-topic-nav .tw-help-section .tw-topics-list > li:before { display: none; } .tw-topic-nav .tw-help-section .tw-topics-list > li:after { top: 1.25vw; left: 0.625vw; content: 'keyboard_arrow_up'; color: #2c2f32; font-size: 3.75vw; transform: rotate(90deg); transition: transform 0.3s; } .tw-topic-nav .tw-help-section .tw-topics-list > li.tw-expanded:after { top: 2.1875vw; left: 0.625vw; transform: rotate(180deg); transition: transform 0.3s; } .tw-topic-nav .tw-help-section .tw-topics-list > li a { font-size: 6.25vw; color: #2c2f32; } .tw-topic-nav .tw-help-section .tw-topics-list > li ul { margin: 0; padding-left: 0; list-style-type: none; padding-top: 1.5625vw; } .tw-topic-nav .tw-help-section .tw-topics-list > li ul li { margin-top: 1.25vw; margin-bottom: 0; min-height: 8.75vw; } .tw-topic-nav .tw-help-section .tw-topics-list > li ul li a { display: block; padding: 0 1.5625vw; padding-top: 1.25vw; padding-bottom: 0.9375vw; font-size: 5.3125vw; line-height: 1.2; text-decoration: none; color: #165b8b; } .tw-topic-nav .tw-help-section .tw-topics-list > li ul li:hover a, .tw-topic-nav .tw-help-section .tw-topics-list > li ul li:focus a { background-color: #eff4f9; } .tw-topic-nav .tw-help-section .tw-topics-list > li ul li.active a, .tw-topic-nav .tw-help-section .tw-topics-list > li ul li a:active { color: #fff; background-color: #4679a9; } .twlanding-body .tw-tickets { font-family: "LatoRegular", sans-serif; width: 100%; padding-top: 10px; } .twlanding-body .tw-tickets h1 { font-family: "LatoRegular", sans-serif; font-size: 34px; color: #2c2f32; padding: 0; margin: 0 0 30px; margin-left: -2px; margin-top: -5px; } @media (min-width: 1024px) { .twlanding-body .tw-tickets h1 { margin-bottom: 40px; } } .twlanding-body .tw-tickets .tw-tickets-list { margin-top: 23px; } .twlanding-body .tw-tickets .tw-tickets-list .tw-ticket { margin-bottom: 28px; padding-right: 10px; } .twlanding-body .tw-tickets .tw-tickets-list .tw-ticket:last-child { margin-bottom: 11px; } .twlanding-body .tw-tickets .tw-tickets-list .tw-ticket:hover .tw-ticket-body-wrap { background-color: #f2f6f9; } .twlanding-body .tw-tickets .tw-tickets-list .tw-ticket .tw-ticket-title { cursor: pointer; font-size: 22px; color: #165b8b; font-family: "LatoRegular", sans-serif; } .twlanding-body .tw-tickets .tw-tickets-list .tw-ticket .tw-ticket-title .tw-ticket-number { position: absolute; right: 10px; top: -15px; padding: 0 10px 5px; font-size: 12px; color: #778590; background-color: #fff; font-family: "LatoBold"; } .twlanding-body .tw-tickets .tw-tickets-list .tw-ticket .tw-ticket-title .tw-ticket-number span { display: block; margin-top: 4px; font-size: 19px; } .twlanding-body .tw-tickets .tw-tickets-list .tw-ticket .tw-ticket-body-wrap { margin-top: 2px; padding: 8px 10px; background-color: #f2f7fc; cursor: pointer; } @media (min-width: 736px) { .twlanding-body .tw-tickets .tw-tickets-list .tw-ticket .tw-ticket-body-wrap { padding-left: 7px; padding-right: 10px; } } .twlanding-body .tw-tickets .tw-tickets-list .tw-ticket .tw-ticket-subtitle { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; border-bottom: 1px solid #d8e1ea; padding: 0 0 8px; } .twlanding-body .tw-tickets .tw-tickets-list .tw-ticket .tw-ticket-subtitle .tw-ticket-submit-date { font-size: 14px; color: #7c838b; } .twlanding-body .tw-tickets .tw-tickets-list .tw-ticket .tw-content { margin: 4px 9px; } .twlanding-body .tw-tickets .tw-tickets-list .tw-ticket .tw-content .tw-empty-result { font-size: 14px; color: #2c2f32; } .twlanding-body .tw-tickets .tw-tickets-list .tw-ticket .tw-content .tw-view-link { display: inline-block; position: relative; margin: 9px 0; padding-left: 20px; font-size: 15px; text-decoration: none; color: #165b8b; } .twlanding-body .tw-tickets .tw-tickets-list .tw-ticket .tw-content .tw-view-link .tw-front-font-icon { position: relative; top: 1px; margin-right: 5px; } .twlanding-body .tw-tickets .tw-tickets-list .tw-ticket .tw-content .tw-view-link:hover, .twlanding-body .tw-tickets .tw-tickets-list .tw-ticket .tw-content .tw-view-link:focus, .twlanding-body .tw-tickets .tw-tickets-list .tw-ticket .tw-content .tw-view-link:active { color: #477cb6; } .twlanding-body .tw-tickets .tw-tickets-list .tw-ticket .tw-content .tw-ticket-last-message .tw-ticket-lm-date { font-size: 14px; color: #7c838b; } .twlanding-body .tw-tickets .tw-tickets-list .tw-ticket .tw-content .tw-ticket-last-message .tw-ticket-lm-body { font-size: 15px; color: #3e4145; } .twlanding-body .tw-tickets .tw-tickets-list .tw-ticket .tw-content .tw-ticket-last-message .tw-ticket-lm-body a { text-decoration: none; color: #145684; } .twlanding-body .tw-tickets .tw-tickets-list .tw-ticket .tw-content .tw-ticket-last-message .tw-ticket-lm-body a:hover, .twlanding-body .tw-tickets .tw-tickets-list .tw-ticket .tw-content .tw-ticket-last-message .tw-ticket-lm-body a:focus, .twlanding-body .tw-tickets .tw-tickets-list .tw-ticket .tw-content .tw-ticket-last-message .tw-ticket-lm-body a:active { text-decoration: underline; color: #477cb6; } .twlanding-body .tw-tickets .tw-pagination-link { display: inline-block; margin-top: 21px; margin-left: 5px; font-size: 18px; color: #165b8b; cursor: pointer; } .twlanding-body .tw-tickets .tw-pagination-link:hover, .twlanding-body .tw-tickets .tw-pagination-link:focus, .twlanding-body .tw-tickets .tw-pagination-link:active { color: #477cb6; } .tw-attachment { margin: 30px 0 29px; } .tw-attachment .tw-ca-preview-wrapper { position: relative; } .tw-attachment .tw-ca-preview-wrapper .tw-error { position: relative; bottom: auto; transform: none; padding-bottom: 5px; } .tw-attachment .tw-ca-preview-wrapper .tw-ca-preview { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: start; align-items: flex-start; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; } .tw-attachment .tw-ca-preview-wrapper .tw-ca-preview .tw-ca-img { position: relative; margin-right: 35px; margin-bottom: 14px; border-bottom: 1px solid var(--STROKE-MAIN-normal, #e3e4e8) !important; padding: 1px; border-radius: 1px; height: 74px; width: 65px; } .tw-attachment .tw-ca-preview-wrapper .tw-ca-preview .tw-ca-img .tw-image { height: 100%; width: 100%; background-position: 50% 50%; background-size: cover; } .tw-attachment .tw-ca-preview-wrapper .tw-ca-preview .tw-ca-img .tw-material-icons { top: 0; right: -24px; position: absolute; color: var(--ERROR, #ff0000) !important; cursor: pointer; /* Support for all WebKit browsers. */ -webkit-font-smoothing: antialiased; /* Support for Safari and Chrome. */ text-rendering: optimizeLegibility; /* Support for IE. */ font-feature-settings: 'liga'; } .tw-attachment .tw-link-button .tw-front-font-icon { position: relative; top: 1px; } .tw-attachment .tw-link-button .label { margin-top: 1px !important; margin-left: 5px; } .tw-attachment .tw-error { position: absolute; bottom: 0; padding-top: 2px; font-size: 14px; transform: translateY(100%); } .tw-ticket-form { width: 100%; max-width: 577px; padding-top: 10px; } .tw-ticket-form h1 { margin: 0 0 30px; font-family: 'LatoRegular', sans-serif; font-size: 34px; color: #2c2f32; margin-top: -5px; margin-left: -2px; } @media (min-width: 1024px) { .tw-ticket-form h1 { margin-bottom: 40px; } } .tw-ticket-form .tw-base-button { background-color: #4679a9; border-radius: 8px; } .tw-ticket-form .tw-base-button span:not(.tw-front-font-icon) { color: white !important; font-family: 'LatoRegular', sans-serif !important; } .tw-ticket-form .tw-fields-group { max-width: 337px; } .tw-ticket-form .tw-fields-group .tw-select-field + .tw-front-text-field { margin-top: 5px; } .tw-ticket-form .tw-front-text-field.tw-multiple { width: 100%; } .tw-ticket-form .tw-submit-btn { margin-bottom: 25px; } .tw-ticket-form .tw-text-field label, .tw-ticket-form .tw-text-field textarea { font-family: 'LatoRegular', sans-serif !important; font-size: 19px !important; } .tw-ticket-form .tw-text-field * { font-family: 'LatoRegular', sans-serif !important; } .twlanding-body .tw-ticket-details { width: 100%; padding-top: 10px; } @media (min-width: 736px) { .twlanding-body .tw-ticket-details { margin-left: -8px; width: calc(100% + 8px); } } .twlanding-body .tw-ticket-details h2 { font-family: "LatoRegular", sans-serif; color: #2c2f32; padding: 0; text-align: left; font-size: 34px; margin: 0 0 30px; margin-left: -2px; margin-top: -4px; } .twlanding-body .tw-ticket-details a { text-decoration: none; color: #145684; } .twlanding-body .tw-ticket-details a:hover, .twlanding-body .tw-ticket-details a:focus, .twlanding-body .tw-ticket-details a:active { text-decoration: underline; color: #477cb6; } .twlanding-body .tw-ticket-details .tw-text-field textarea, .twlanding-body .tw-ticket-details .tw-text-field label { font-family: 'LatoRegular', sans-serif !important; font-size: 19px !important; } .twlanding-body .tw-ticket-details .tw-ticket-number-row { overflow: hidden; } .twlanding-body .tw-ticket-details .tw-ticket-number-row .tw-ticket-number { font-size: 18px; color: #165b8b; margin-right: 33px; } .twlanding-body .tw-ticket-details .tw-ticket-number-row .tw-ticket-submit-date { margin-top: 7px; font-family: "LatoRegular", sans-serif; font-size: 16px; color: #7c838b; } .twlanding-body .tw-ticket-details .tw-ticket-request { margin-top: 17px; padding: 15px 16px; padding-left: 0; font-family: "LatoRegular", sans-serif; font-size: 16px; color: #3e4145; background-color: #f2f7fc; padding-left: 9px; } .twlanding-body .tw-ticket-details .tw-ticket-request .tw-ticket-body { padding-bottom: 7px; padding-left: 7px; } .twlanding-body .tw-ticket-details .tw-ticket-response { position: relative; margin-top: 10px; padding: 17px 10px; background-color: #f2f7fc; } .twlanding-body .tw-ticket-details .tw-ticket-response.tw-staff { background-color: #e0ebf5; } .twlanding-body .tw-ticket-details .tw-ticket-response.tw-staff .tw-response-author { background-color: #729abd; } .twlanding-body .tw-ticket-details .tw-ticket-response .tw-response-author { position: absolute; top: -6px; left: 10px; border-radius: 3px; padding: 3px 8px 3px; font-family: "LatoBold", sans-serif; font-size: 16px; line-height: 1; color: #fff; background-color: #aacae6; } .twlanding-body .tw-ticket-details .tw-ticket-response .tw-response-date { border-bottom: 1px solid #d6d9da; padding-bottom: 2px; font-family: "LatoRegular", sans-serif; font-size: 14px; color: #7c838b; padding-left: 8px; } .twlanding-body .tw-ticket-details .tw-ticket-response .tw-response-body { padding: 7px 0; font-family: "LatoRegular", sans-serif; font-size: 16px; line-height: 1.2; color: #3e4145; padding-left: 8px; } .twlanding-body .tw-ticket-details .tw-attached-file { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; display: -ms-inline-flexbox; display: inline-flex; margin-top: 5px; margin-right: 15px; text-decoration: none; padding-left: 8px; } .twlanding-body .tw-ticket-details .tw-attached-file:last-child { margin-right: 0; } .twlanding-body .tw-ticket-details .tw-attached-file .tw-material-icons { margin-right: 5px; } .twlanding-body .tw-ticket-details form { margin-top: 3px; padding: 5px 15px 15px; background-color: #f2f7fc; } .twlanding-body .tw-ticket-details form .tw-top-row { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; padding: 9px 0 0; } .twlanding-body .tw-ticket-details form .tw-response-author { border-radius: 3px; padding: 3px 8px 3px; font-family: "LatoBold", sans-serif; font-size: 16px; line-height: 1; color: #fff; background-color: #aacae6; } .twlanding-body .tw-ticket-details form .tw-front-text-field { margin-bottom: 17px; width: 73%; } .twlanding-body .tw-ticket-details form .tw-front-text-field .tw-floating-label { font-size: 16px; } .twlanding-body .tw-ticket-details form .tw-front-text-field.tw-focused .tw-floating-label { font-size: 14px; } .twlanding-body .tw-ticket-details form .tw-attachment { margin-top: 17px; margin-bottom: 22px; } .twlanding-body .tw-ticket-details form .tw-attachment .tw-ca-img { margin-bottom: 10px; } .twlanding-body .tw-ticket-details form .tw-link-button .tw-front-font-icon { font-size: 17px; } .twlanding-body .tw-ticket-details form .tw-link-button .label { font-size: 17px; margin-top: 1px; margin-left: 5px; } .twlanding-body .tw-ticket-details form .tw-btn { padding-left: 25px; padding-right: 25px; font-size: 17px; line-height: 39px; } .twlanding-body .tw-help-page .tw-ticket-details .tw-top-row { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; margin-bottom: 7px; } .twlanding-body .tw-help-page .tw-ticket-details h2 { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; margin-bottom: 0; } .twlanding-body .tw-help-page .tw-ticket-details h2 .tw-ticket-status { margin-left: 11px; padding-top: 2px; padding-bottom: 4px; font-size: 15px; } .twlanding-body .tw-help-page .tw-ticket-details h2 .tw-ticket-status.tw-ts-not-replied { background-color: #ff6000; } .twlanding-body .tw-help-page .tw-ticket-details .tw-back-link { color: #718392; font-size: 22px; display: block; font-family: "LatoRegular"; text-align: left; margin-top: 0; margin-bottom: 5px; } .twlanding-body .tw-help-page .tw-ticket-details .tw-ticket-submit-date { margin-top: 5px; } .twlanding-body .tw-help-page .tw-ticket-details .tw-ticket-response { margin-top: 3px; padding: 5px 15px 15px; } .twlanding-body .tw-help-page .tw-ticket-details .tw-ticket-response.tw-staff { background-color: #e8eef5; } .twlanding-body .tw-help-page .tw-ticket-details .tw-ticket-response .tw-top-row { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: center; align-items: center; -ms-flex-wrap: none; flex-wrap: nowrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; margin-bottom: 0; border-bottom: 1px solid #9dbcd8; padding: 9px 0 11px; } .twlanding-body .tw-help-page .tw-ticket-details .tw-ticket-response .tw-top-row .tw-response-date { border: none; } .twlanding-body .tw-help-page .tw-ticket-details .tw-ticket-response .tw-top-row .tw-response-author { position: relative; top: 0; left: 0; margin-right: 8px; } .twlanding-body .tw-help-page .tw-ticket-details .tw-ticket-response .tw-response-body { padding-bottom: 0; } .twlanding-body .tw-help-page .tw-ticket-details .tw-ticket-request + .tw-ticket-response { margin-top: 23px; } #share { margin-top: 33px; } #share ul { display: block; margin-left: 0; padding-left: 0; } #share ul li { margin-bottom: 4px; list-style: none; display: inline-block; margin-right: 4px; } #share ul li .share-a { width: 34px; height: 34px; line-height: 34px; display: block; cursor: pointer; text-decoration: none; color: #bfbfbf; font-size: 24px; opacity: 0.5; transition: all 0.3s; } #share ul li .share-a:hover { opacity: 1; } #share ul li .share-a i { font-size: 24px; } .twlanding-body .tw-blog-landing h2 { margin: 33px 0 0px; padding-left: 0; padding-bottom: 0; font-family: "LatoRegular"; font-size: 30px; text-align: left; } .twlanding-body .tw-blog-landing ul.tw-topics-list { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: start; justify-content: flex-start; -ms-flex-align: stretch; align-items: stretch; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 1; flex-shrink: 1; margin: 10px -16px 0; padding: 0; list-style-type: none; max-width: calc(100% - 2px); } .twlanding-body .tw-blog-landing ul.tw-topics-list li { padding: 10px; } @media (min-width: 1239px) { .twlanding-body .tw-blog-landing ul.tw-topics-list li { width: 50%; } } .twlanding-body .tw-blog-landing ul.tw-topics-list li a { display: block; height: 100%; text-decoration: none; color: #2c2f32; } .twlanding-body .tw-blog-landing ul.tw-topics-list li a .tw-item-wrap { border: 1px solid transparent; border-radius: 1px; padding: 5px; } @media (max-width: 735px) { .twlanding-body .tw-blog-landing ul.tw-topics-list li a .tw-item-wrap .tw-text-center { width: 80vw; height: 32.8125vw; } } .twlanding-body .tw-blog-landing ul.tw-topics-list li a .tw-item-wrap img { display: block; margin-bottom: 8px; width: 100%; } .twlanding-body .tw-blog-landing ul.tw-topics-list li a .tw-item-wrap .tw-title { margin: 8px 0; font-size: 24px; line-height: 1.2; color: #165b8b; } .twlanding-body .tw-blog-landing ul.tw-topics-list li a .tw-item-wrap .tw-description { margin: 5px 0; font-size: 16px; line-height: 1.3; } .twlanding-body .tw-blog-landing ul.tw-topics-list li:hover a .tw-item-wrap, .twlanding-body .tw-blog-landing ul.tw-topics-list li:focus a .tw-item-wrap { border-color: #e5e7e7; } @media (min-width: 736px) { .tw-blog-page #tw-join-us .tw-wrap { padding-bottom: 32px; } } .tw-topic-hero-image { margin-bottom: 50px; } @media (max-width: 735px) { .tw-topic-hero-image { width: 90.625vw; height: 37.1875vw; } } .tw-topic-hero-image img { display: block; max-width: 100%; } .tw-two-cols-layout.tw-no-devider .tw-topic-nav:after { display: none; } .tw-two-cols-layout.tw-no-devider .tw-topic-wrap { top: 0; } .tw-two-cols-layout.tw-no-devider .tw-topic-nav { top: 0; } @media (min-width: 736px) { .tw-two-cols-layout.tw-no-devider .tw-topic-nav { padding-top: 80px; } } @media (min-width: 1024px) { .tw-two-cols-layout.tw-no-devider .tw-topic-nav { padding-top: 105px; } } .tw-two-cols-layout .tw-topic-nav img { max-width: 100%; } .tw-page--desktop-application .section-app-download { position: relative; z-index: 1; background-color: #c8dff2; } @media (max-width: 320px) { .tw-page--desktop-application .section-app-download { padding-bottom: 120px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download { padding-bottom: 25vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--desktop-application .section-app-download { height: 580px; padding-bottom: 20px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download { height: 47.52vw; padding-bottom: 1.6vw; } } @media (min-width: 1240px) { .tw-page--desktop-application .section-app-download { height: 589px; padding-bottom: 20px; } } .tw-page--desktop-application .section-app-download .wrap { overflow: visible; position: relative; } @media (max-width: 320px) { .tw-page--desktop-application .section-app-download .wrap { margin-top: -26px; padding-top: 25px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .wrap { margin-top: -8.125vw; padding-top: 6.875vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .wrap { overflow: visible; padding-top: 10px; padding-left: 26px; padding-right: 26px; padding-left: 3.38561vw; padding-right: 3.38561vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--desktop-application .section-app-download .wrap { overflow: visible; } } @media (min-width: 1240px) { .tw-page--desktop-application .section-app-download .wrap { overflow: visible; } } .tw-page--desktop-application .section-app-download .twda--bg-content--bottom-left { background-image: url("/img/front/landing-bg/bg-app-desktop--bottom.svg"); background-repeat: no-repeat; background-position: 0 0; position: absolute; z-index: 1; background-size: 860px; width: 860px; height: 88px; bottom: 2px; left: -62px; } @media (max-width: 320px) { .tw-page--desktop-application .section-app-download .twda--bg-content--bottom-left { display: none; } } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .twda--bg-content--bottom-left { display: none; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .twda--bg-content--bottom-left { background-size: 55.99281vw; width: 55.99281vw; height: 5.7295vw; left: -3.90647vw; } } .tw-page--desktop-application .section-app-download .twda--bg-content { background-image: url("/img/front/landing-bg/bg-app--top.svg"); background-repeat: no-repeat; background-size: cover; background-position: 50% -52px; background-size: 2072px; } @media (max-width: 320px) { .tw-page--desktop-application .section-app-download .twda--bg-content { background-position: -366px -60px; background-size: 1482px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .twda--bg-content { background-position: -114.375vw -18.75vw; background-size: 463.125vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .twda--bg-content { background-position: -315px -10px; background-size: 1420px; background-size: 184.90647vw; background-position: -315px -1.30216vw; } } @media screen and (min-width: 860px) { .tw-page--desktop-application .section-app-download .twda--bg-content { background-position: -345px -7.16187vw; } } @media screen and (min-width: 920px) { .tw-page--desktop-application .section-app-download .twda--bg-content { background-position: -385px -9.11511vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--desktop-application .section-app-download .twda--bg-content { background-size: 2000px; background-position: -470px -58px; } } @media screen and (min-width: 1026px) { .tw-page--desktop-application .section-app-download .twda--bg-content { background-size: 192.96vw; background-position: -480px -5.6vw; } } @media screen and (min-width: 1060px) { .tw-page--desktop-application .section-app-download .twda--bg-content { background-size: 192.96vw; background-position: -490px -5.6vw; } } @media screen and (min-width: 1120px) { .tw-page--desktop-application .section-app-download .twda--bg-content { background-size: 192.96vw; background-position: -500px -5.6vw; } } @media screen and (min-width: 1180px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download .twda--bg-content { background-size: 192.96vw; background-position: -510px -5.6vw; } } @media (min-width: 1240px) and (max-width: 1399px) { .tw-page--desktop-application .section-app-download .twda--bg-content { background-size: 2072px; background-position: 50% -52px; } } @media (min-width: 1400px) { .tw-page--desktop-application .section-app-download .twda--bg-content { background-size: 2072px; background-position: 50% -52px; } } .tw-page--desktop-application .section-app-download h2 { font-family: "LatoRegular"; margin-top: 20px; } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download h2 { margin-top: 6.25vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download h2 { margin-top: 30px; margin-bottom: 30px; margin-top: 3.90647vw; margin-bottom: 3.90647vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--desktop-application .section-app-download h2 { margin-top: 20px; margin-bottom: 30px; font-size: 32px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download h2 { margin-top: 1.6vw; margin-bottom: 2.4vw; font-size: 2.56vw; } } @media (min-width: 1240px) { .tw-page--desktop-application .section-app-download h2 { margin-top: 20px; margin-bottom: 30px; font-size: 32px; } } .tw-page--desktop-application .section-app-download .sections { overflow: visible; text-align: center; position: relative; z-index: 1; } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .sections { height: 46.8777vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--desktop-application .section-app-download .sections { height: 493px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download .sections { height: 39.44vw; } } @media (min-width: 1240px) { .tw-page--desktop-application .section-app-download .sections { height: 493px; } } .tw-page--desktop-application .section-app-download .twda-overview--images-section { text-align: center; width: 800px; margin: auto; padding-top: 10px; } @media (max-width: 320px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section { height: 280px; position: relative; width: 87.5vw; height: 56.25vw; } } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section { width: 87.5vw; height: 56.25vw; padding-top: 3.125vw; position: relative; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section { float: left; position: relative; width: calc(100% - 370px); padding-top: 10px; padding-top: 1.30216vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section { float: left; width: calc(100% - 400px); position: relative; padding-top: 10px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section { float: left; width: calc(100% - 400px); position: relative; padding-top: 0.8vw; } } @media (min-width: 1240px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section { float: left; width: calc(100% - 400px); position: relative; padding-top: 10px; } } .tw-page--desktop-application .section-app-download .twda-overview--images-section .app { display: block; margin: auto; position: absolute; margin-bottom: 0; } .tw-page--desktop-application .section-app-download .twda-overview--images-section .app img { width: 280px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-drag: none; } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section .app img { width: 87.5vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section .app img { width: 280px; width: 36.46043vw; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section .app img { width: 22.4vw; } } @media (max-width: 320px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-1 { top: 20px; left: -10px; z-index: 1; } .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-1 img { width: 130px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-1 { top: 6.25vw; left: -3.125vw; z-index: 1; } .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-1 img { width: 46.875vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-1 { top: 30px; z-index: 1; left: 0.8vw; } .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-1 img { width: 28.64748vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-1 { top: 30px; left: 0.8vw; z-index: 1; } .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-1 img { width: 32.4vw; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-1 { top: 30px; left: 0.8vw; z-index: 1; } .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-1 img { width: 32.4vw; } } @media (min-width: 1240px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-1 { top: 30px; left: -12px; z-index: 1; } .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-1 img { width: 405px; } } @media (max-width: 320px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-2 { top: 5px; left: 60px; z-index: 2; } .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-2 img { width: 130px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-2 { top: 1.5625vw; left: 18.75vw; z-index: 2; } .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-2 img { width: 46.875vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-2 { z-index: 2; left: 10.4vw; top: -1px; } .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-2 img { width: 28.64748vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-2 { top: -1px; left: 12.8vw; z-index: 2; } .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-2 img { width: 32.4vw; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-2 { top: -1px; left: 12.8vw; z-index: 2; } .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-2 img { width: 32.4vw; } } @media (min-width: 1240px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-2 { top: -1px; left: 160px; z-index: 2; } .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-2 img { width: 405px; } } @media (max-width: 320px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-3 { top: 10px; left: 140px; z-index: 3; } .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-3 img { width: 130px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-3 { top: 3.125vw; left: 43.75vw; z-index: 3; } .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-3 img { width: 46.875vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-3 { z-index: 3; top: 1.2vw; left: 20.16vw; } .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-3 img { width: 28.64748vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-3 { top: 1.2vw; left: 28.16vw; z-index: 3; } .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-3 img { width: 32.4vw; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-3 { top: 1.2vw; left: 28.16vw; z-index: 3; } .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-3 img { width: 32.4vw; } } @media (min-width: 1240px) { .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-3 { top: 15px; left: 352px; z-index: 3; } .tw-page--desktop-application .section-app-download .twda-overview--images-section .app-3 img { width: 405px; } } .tw-page--desktop-application .section-app-download .twda-overview--text-section { width: 400px; margin: auto; } @media (max-width: 320px) { .tw-page--desktop-application .section-app-download .twda-overview--text-section { width: 100%; } } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .twda-overview--text-section { width: 87.5vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .twda-overview--text-section { float: right; width: 370px; width: 42.97122vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--desktop-application .section-app-download .twda-overview--text-section { float: right; width: 320px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download .twda-overview--text-section { float: right; width: 32vw; } } @media (min-width: 1240px) { .tw-page--desktop-application .section-app-download .twda-overview--text-section { float: right; width: 400px; } } .tw-page--desktop-application .section-app-download .app-platforms { position: relative; margin: auto; } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .app-platforms { position: relative; font-size: 18px; width: 100%; font-size: 2.34388vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--desktop-application .section-app-download .app-platforms { font-size: 17px; width: 320px; position: relative; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download .app-platforms { font-size: 1.92vw; width: 28.4vw; left: 1.76vw; position: relative; } } @media (min-width: 1240px) { .tw-page--desktop-application .section-app-download .app-platforms { font-size: 24px; width: 355px; position: relative; left: 22px; } } .tw-page--desktop-application .section-app-download .app-platforms .app-platform { display: inline-block; background: #fff; position: absolute; text-align: left; border-radius: 8px 0 0 8px; width: 100%; height: 46px; line-height: 49px; width: 150px; top: 0; left: 0; z-index: 2; } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform { height: 12.5vw; line-height: 12.5vw; width: 46.875vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform { height: 46px; line-height: 49px; width: 150px; height: 5.98993vw; line-height: 6.38058vw; width: 19.53237vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform { left: 20px; height: 46px; line-height: 54px; width: 150px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform { height: 3.68vw; line-height: 3.92vw; width: 12vw; } } @media (min-width: 1240px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform { height: 46px; line-height: 49px; width: 150px; } } .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current { width: 100%; height: 100%; display: block; cursor: pointer; position: relative; line-height: 2.7; } .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current .tw-accordion { font-size: 16px; right: 7px; position: absolute; } @media (max-width: 320px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current .tw-accordion { top: -2.1875vw; } } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current .tw-accordion { font-size: 3.125vw; top: -2.1875vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current .tw-accordion { top: -0.625vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current .tw-accordion { top: -0.9375vw; } } @media screen and (min-width: 1240px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current .tw-accordion { top: -0.15625vw; } } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current { background-size: 4.375vw; background-position: 95% 0.9375vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current { width: 100%; height: 100%; line-height: 2.3; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current { width: 100%; height: 100%; background-size: 14px; background-position: 129px 3px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current { width: 100%; height: 100%; background-size: 1.12vw; background-position: 10.32vw 0.24vw; line-height: 1.9; } } @media (min-width: 1240px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current { width: 100%; height: 100%; background-size: 14px; background-position: 129px 3px; line-height: 1.9; } } .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current img { float: left; position: relative; } .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current img.macos { height: 20px; padding-left: 16px; top: 12px; } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current img.macos { height: 6.25vw; padding-left: 5vw; top: 3.125vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current img.macos { height: 20px; padding-left: 16px; top: 12px; height: 2.60432vw; padding-left: 2.08345vw; top: 1.56259vw; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current img.macos { height: 1.6vw; padding-left: 1.28vw; top: 0.96vw; } } .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current img.windows { height: 31px; padding-left: 14px; top: 7px; } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current img.windows { height: 9.6875vw; padding-left: 4.375vw; top: 2.1875vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current img.windows { height: 31px; padding-left: 14px; top: 7px; height: 4.03669vw; padding-left: 1.82302vw; top: 0.91151vw; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current img.windows { height: 2.48vw; padding-left: 1.12vw; top: 0.56vw; } } .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current img.linux { height: 32px; padding-left: 16px; top: 6px; } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current img.linux { height: 10vw; padding-left: 5vw; top: 1.875vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current img.linux { height: 32px; padding-left: 16px; top: 6px; height: 4.16691vw; padding-left: 2.08345vw; top: 0.78129vw; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current img.linux { height: 2.56vw; padding-left: 1.28vw; top: 0.48vw; } } .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current span { padding-left: 10px; font-size: 18px; top: -2px; position: relative; } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current span { padding-left: 3.125vw; font-size: 5.625vw; top: -0.625vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current span { padding-left: 10px; font-size: 18px; top: -2px; padding-left: 1.30216vw; font-size: 2.34388vw; top: -0.26043vw; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--current span { padding-left: 0.8vw; font-size: 1.44vw; top: -0.16vw; } } .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner { position: relative; width: 100%; height: 100%; } .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown { position: absolute; display: block; left: 0px; padding: 0; margin: 0; list-style: none; background-color: #fff; box-shadow: 3px 4px 6px 1px rgba(0, 0, 0, 0.17); border-radius: 6px; top: 50px; width: 280px; overflow: hidden; } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown { top: 15.625vw; width: 87.5vw; box-shadow: 0.9375vw 1.25vw 1.875vw 0.3125vw rgba(0, 0, 0, 0.17); } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown { left: 0px; padding: 0; margin: 0; top: 50px; border-radius: 6px; width: 150px; top: 6.51079vw; border-radius: 0.78129vw; width: 19.53237vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown { left: 0px; padding: 0; margin: 0; border-radius: 6px; top: 50px; width: 150px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown { left: 0px; padding: 0; margin: 0; border-radius: 0.48vw; top: 4vw; width: 12vw; } } @media (min-width: 1240px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown { left: 0px; padding: 0; margin: 0; top: 50px; border-radius: 6px; width: 150px; } } .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li { height: 44px; line-height: 2.7; border-bottom: 1px solid #ddebf9; list-style: none; cursor: pointer; } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li { height: 13.75vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li { height: 44px; height: 5.7295vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li { height: 44px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li { height: 3.52vw; line-height: 1.9; } } @media (min-width: 1240px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li { height: 44px; line-height: 1.9; } } .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li:last-of-type { border: 0; } .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li.current { display: none; } .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li:hover { background: #f3f6fb; } .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li img { float: left; position: relative; } .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li img.macos { height: 20px; padding-left: 16px; top: 12px; } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li img.macos { height: 6.25vw; padding-left: 5vw; top: 3.75vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li img.macos { height: 20px; padding-left: 16px; top: 12px; height: 2.60432vw; padding-left: 2.08345vw; top: 1.56259vw; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li img.macos { height: 1.6vw; padding-left: 1.28vw; top: 0.96vw; } } .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li img.windows { height: 31px; padding-left: 14px; top: 7px; } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li img.windows { height: 9.6875vw; padding-left: 4.375vw; top: 2.1875vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li img.windows { height: 31px; padding-left: 14px; top: 7px; height: 4.03669vw; padding-left: 1.82302vw; top: 0.91151vw; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li img.windows { height: 2.48vw; padding-left: 1.12vw; top: 0.56vw; } } .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li img.linux { height: 32px; padding-left: 16px; top: 6px; } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li img.linux { height: 10vw; padding-left: 5vw; top: 1.875vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li img.linux { height: 32px; padding-left: 16px; top: 6px; height: 4.16691vw; padding-left: 2.08345vw; top: 0.78129vw; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li img.linux { height: 2.56vw; padding-left: 1.28vw; top: 0.48vw; } } .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li span { position: relative; padding-left: 10px; font-size: 18px; top: -3px; } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li span { padding-left: 3.125vw; font-size: 5.625vw; top: -0.9375vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li span { padding-left: 10px; font-size: 18px; top: -9px; padding-left: 1.30216vw; font-size: 2.34388vw; top: -1.17194vw; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown li span { padding-left: 0.8vw; font-size: 1.44vw; top: -0.24vw; } } .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown.shown { display: block; } .tw-page--desktop-application .section-app-download .app-platforms .app-platform .app-platform--inner .app-platform--dropdown.hidden { display: none; } .tw-page--desktop-application .section-app-download .app-platforms .app-download--info { text-align: left; color: #4b5155; position: relative; font-size: 16px; padding-top: 56px; padding-left: 43px; } @media (max-width: 320px) { .tw-page--desktop-application .section-app-download .app-platforms .app-download--info { font-size: 13px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .app-platforms .app-download--info { font-size: 4.0625vw; padding-top: 17.5vw; padding-left: 19.6875vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .app-platforms .app-download--info { font-size: 13px; font-size: 1.69281vw; padding-top: 7.29209vw; padding-left: 6.90144vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--desktop-application .section-app-download .app-platforms .app-download--info { font-size: 13px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download .app-platforms .app-download--info { font-size: 1.28vw; padding-top: 4.48vw; padding-left: 3.44vw; } } @media (min-width: 1240px) { .tw-page--desktop-application .section-app-download .app-platforms .app-download--info { font-size: 16px; } } .tw-page--desktop-application .section-app-download .app-platforms .app-download--info span { position: absolute !important; color: #0f4372 !important; left: 16px; top: 58px; font-size: 22px !important; } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .app-platforms .app-download--info span { left: 5vw; top: 18.125vw; font-size: 6.875vw !important; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .app-platforms .app-download--info span { left: 2.08345vw; top: 7.55252vw; font-size: 2.86475vw !important; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download .app-platforms .app-download--info span { left: 1.28vw; top: 4.64vw; font-size: 1.76vw !important; } } .tw-page--desktop-application .section-app-download .app-platforms .app-download { border-radius: 8px; text-align: center; background-color: #ff5c5e; color: #fff; clear: both; position: static; text-align: right; position: absolute; height: 46px; line-height: 46px; width: 95%; top: 0; right: 0; margin-bottom: 0; z-index: 1; } .tw-page--desktop-application .section-app-download .app-platforms .app-download:active, .tw-page--desktop-application .section-app-download .app-platforms .app-download:focus, .tw-page--desktop-application .section-app-download .app-platforms .app-download:hover { background-color: #f74b4d; } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .app-platforms .app-download { margin-bottom: 0px; height: 12.5vw; line-height: 12.5vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .app-platforms .app-download { height: 46px; line-height: 46px; height: 5.98993vw; line-height: 5.98993vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--desktop-application .section-app-download .app-platforms .app-download { left: 40px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download .app-platforms .app-download { height: 3.68vw; line-height: 3.68vw; } } @media screen and (min-width: 1026px) { .tw-page--desktop-application .section-app-download .app-platforms .app-download { right: -20px; } } .tw-page--desktop-application .section-app-download .app-platforms .app-download a { color: inherit; text-decoration: none; } @media (max-width: 320px) { .tw-page--desktop-application .section-app-download .app-platforms .app-download a { font-size: 4.375vw; line-height: 37px; top: -1px; position: relative; } } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .app-platforms .app-download a { font-size: 4.375vw; line-height: 11.5625vw; top: 0; position: relative; } } @media (max-width: 320px) { .tw-page--desktop-application .section-app-download .app-platforms .app-download a i { font-size: 4.0625vw; margin-right: 12px; margin-left: 0; position: relative; } } @media (min-width: 321px) and (max-width: 735px) { .tw-page--desktop-application .section-app-download .app-platforms .app-download a i { font-size: 4.0625vw; margin-right: 3.75vw; margin-left: 0px; position: relative; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--desktop-application .section-app-download .app-platforms .app-download a i { font-size: 17px; margin-right: 18px; margin-left: 0px; font-size: 2.21367vw; margin-right: 2.34388vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--desktop-application .section-app-download .app-platforms .app-download a i { font-size: 18px; margin-right: 18px; margin-left: 0px; position: relative; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--desktop-application .section-app-download .app-platforms .app-download a i { font-size: 1.6vw; margin-right: 1.44vw; margin-left: 0px; } } @media (min-width: 1240px) { .tw-page--desktop-application .section-app-download .app-platforms .app-download a i { font-size: 20px; margin-right: 18px; margin-left: 0px; } } .twlanding-body .tw-desktop-app--section-features .wrap { background-color: #c8dff2; } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .tw-desktop-app--section-features .wrap { padding-left: 26px; padding-right: 26px; padding-left: 3.38561vw; padding-right: 3.38561vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .tw-desktop-app--section-features .wrap { padding-top: 23px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-features .wrap { padding-top: 1.84vw; } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-features .wrap { padding-top: 23px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-features h2 { margin-bottom: 0; padding-bottom: 0; } } @media screen and (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-features h2 { padding-bottom: 0; } } @media (max-width: 320px) { .twlanding-body .tw-desktop-app--section-features .columns--features { padding-top: 15px; padding-bottom: 0; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-desktop-app--section-features .columns--features { padding-top: 4.6875vw; padding-bottom: 0; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-features .columns--features { padding-left: 1.6vw; padding-right: 1.6vw; } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-features .columns--features { overflow: auto; padding-left: 20px; padding-right: 20px; } } .twlanding-body .tw-desktop-app--section-features .columns--features ul { padding: 0; margin: 0; list-style: none; } .twlanding-body .tw-desktop-app--section-features .columns--features ul li { padding: 0; margin: 0; margin-bottom: 26px; list-style: none; position: relative; } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-desktop-app--section-features .columns--features ul li { margin-bottom: 8.125vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .tw-desktop-app--section-features .columns--features ul li { margin-bottom: 12px; margin-bottom: 1.56259vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .tw-desktop-app--section-features .columns--features ul li { margin-bottom: 20px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-features .columns--features ul li { margin-bottom: 2.08vw; } } .twlanding-body .tw-desktop-app--section-features .columns--features ul li .f-title { margin: 0; margin-bottom: 8px; color: #4b5155; text-align: left; } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-desktop-app--section-features .columns--features ul li .f-title { margin-bottom: 2.5vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .tw-desktop-app--section-features .columns--features ul li .f-title { margin: 0; font-size: 14px; margin-bottom: 6px; font-size: 1.82302vw; margin-bottom: 0.78129vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .tw-desktop-app--section-features .columns--features ul li .f-title { margin: 0; font-size: 18px; margin-bottom: 8px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-features .columns--features ul li .f-title { margin: 0; font-size: 1.76vw; margin-bottom: 0.64vw; } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-features .columns--features ul li .f-title { margin: 0; font-size: 22px; margin-bottom: 8px; } } .twlanding-body .tw-desktop-app--section-features .columns--features ul li .f-content { color: #4b5155; } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .tw-desktop-app--section-features .columns--features ul li .f-content { font-size: 11px; max-width: 268px; font-size: 1.43237vw; max-width: 34.89784vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .tw-desktop-app--section-features .columns--features ul li .f-content { font-size: 14px; max-width: 268px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-features .columns--features ul li .f-content { font-size: 1.28vw; max-width: 21.44vw; } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-features .columns--features ul li .f-content { font-size: 16px; max-width: 268px; } } @media (max-width: 320px) { .twlanding-body .tw-desktop-app--section-features .columns--features ul.features-text--mobile { padding-top: 20px; } .twlanding-body .tw-desktop-app--section-features .columns--features ul.features-text--mobile li .f-title { font-size: 16px; } .twlanding-body .tw-desktop-app--section-features .columns--features ul.features-text--mobile li .f-content { font-size: 14px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-desktop-app--section-features .columns--features ul.features-text--mobile { padding-top: 6.25vw; } .twlanding-body .tw-desktop-app--section-features .columns--features ul.features-text--mobile li .f-title { font-size: 5vw; } .twlanding-body .tw-desktop-app--section-features .columns--features ul.features-text--mobile li .f-content { font-size: 4.375vw; } } .twlanding-body .tw-desktop-app--section-features .columns--features .col-right, .twlanding-body .tw-desktop-app--section-features .columns--features .col-left { margin: auto; width: 25%; } @media (max-width: 320px) { .twlanding-body .tw-desktop-app--section-features .columns--features .col-right, .twlanding-body .tw-desktop-app--section-features .columns--features .col-left { width: 100%; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-desktop-app--section-features .columns--features .col-right, .twlanding-body .tw-desktop-app--section-features .columns--features .col-left { width: 100%; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .tw-desktop-app--section-features .columns--features .col-right, .twlanding-body .tw-desktop-app--section-features .columns--features .col-left { padding-top: 20px; padding-top: 2.60432vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .tw-desktop-app--section-features .columns--features .col-right, .twlanding-body .tw-desktop-app--section-features .columns--features .col-left { padding-top: 50px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-features .columns--features .col-right, .twlanding-body .tw-desktop-app--section-features .columns--features .col-left { padding-top: 4vw; } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-features .columns--features .col-right, .twlanding-body .tw-desktop-app--section-features .columns--features .col-left { padding-top: 50px; } } @media (min-width: 736px) { .twlanding-body .tw-desktop-app--section-features .columns--features .col-left { float: left; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .tw-desktop-app--section-features .columns--features .col-left { padding-right: 0; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-features .columns--features .col-left { padding-right: 1.6vw; } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-features .columns--features .col-left { padding-right: 20px; } } @media (min-width: 736px) { .twlanding-body .tw-desktop-app--section-features .columns--features .col-right { float: right; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .tw-desktop-app--section-features .columns--features .col-right { padding-left: 0; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-features .columns--features .col-right { padding-left: 3.2vw; } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-features .columns--features .col-right { padding-left: 40px; } } .twlanding-body .tw-desktop-app--section-features .columns--features #tw-desktop-app { max-width: 534px; margin: auto; width: 50%; float: left; } @media (max-width: 320px) { .twlanding-body .tw-desktop-app--section-features .columns--features #tw-desktop-app { width: 100%; float: none; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-desktop-app--section-features .columns--features #tw-desktop-app { width: 100%; float: none; } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-features .columns--features #tw-desktop-app .browser-image .tw-timer { top: 180px; } } @media (min-width: 601px) and (max-width: 735px) { .twlanding-body .tw-desktop-app--section-features .columns--features #tw-desktop-app .browser-image .tw-timer { top: 185px; font-size: 26px; } } @media (max-width: 600px) { .twlanding-body .tw-desktop-app--section-features .columns--features #tw-desktop-app .browser-image .tw-timer { top: 30.9vw; font-size: 4.1vw; padding-left: 7.5vw; } } @media (max-width: 470px) { .twlanding-body .tw-desktop-app--section-features .columns--features #tw-desktop-app .browser-image .tw-timer { top: 30.6vw; font-size: 3.9vw; } } @media (max-width: 400px) { .twlanding-body .tw-desktop-app--section-features .columns--features #tw-desktop-app .browser-image .tw-timer { top: 30vw; font-size: 3.8vw; } } @media (max-width: 340px) { .twlanding-body .tw-desktop-app--section-features .columns--features #tw-desktop-app .browser-image .tw-timer { top: 28vw; font-size: 3.7vw; } } .twlanding-body .tw-desktop-app--section-features .columns--features .feature-pointer { position: relative; } .twlanding-body .tw-desktop-app--section-features .columns--features .feature-pointer:before { display: block; content: ''; z-index: 1; background-color: #2f414e; position: absolute; display: block; height: 1px; } @media (max-width: 735px) { .twlanding-body .tw-desktop-app--section-features .columns--features .feature-pointer:before { display: none; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-features .columns--features .pointer-left-0:before { top: 4.24vw; right: -8vw; width: 12.24vw; transform: rotate(29deg); } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-features .columns--features .pointer-left-0:before { top: 53px; right: -120px; width: 153px; transform: rotate(29deg); } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-features .columns--features .pointer-left-1:before { top: 0.4vw; right: -4.8vw; width: 7.44vw; transform: rotate(-11deg); } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-features .columns--features .pointer-left-1:before { top: 5px; right: -70px; width: 93px; transform: rotate(-11deg); } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-features .columns--features .pointer-left-2:before { top: -0.32vw; right: -4.08vw; width: 13.36vw; transform: rotate(-11deg); } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-features .columns--features .pointer-left-2:before { top: -4px; right: -71px; width: 167px; transform: rotate(-11deg); } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-features .columns--features .pointer-right-0:before { top: 3.84vw; left: -9.84vw; width: 9.92vw; transform: rotate(-31deg); } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-features .columns--features .pointer-right-0:before { top: 48px; left: -123px; width: 124px; transform: rotate(-31deg); } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-features .columns--features .pointer-right-1:before { top: -1.12vw; left: -28.08vw; width: 27.2vw; transform: rotate(8deg); } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-features .columns--features .pointer-right-1:before { top: -14px; left: -351px; width: 340px; transform: rotate(8deg); } } .twlanding-body .tw-desktop-app--section-features .columns--features .pointer-right-1:after { display: block; content: ''; position: absolute; height: 1px; background-color: #2f414e; position: absolute; z-index: 1; } @media (max-width: 735px) { .twlanding-body .tw-desktop-app--section-features .columns--features .pointer-right-1:after { display: none; } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-features .columns--features .pointer-right-1:after { top: 3.04vw; left: -9.92vw; width: 9.44vw; transform: rotate(-27deg); } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-features .columns--features .pointer-right-1:after { top: 38px; left: -124px; width: 118px; transform: rotate(-27deg); } } @media (min-width: 736px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-features .columns--features .pointer-right-2:before { top: 1.76vw; left: -8vw; width: 7.2vw; transform: rotate(-11deg); } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-features .columns--features .pointer-right-2:before { top: 22px; left: -100px; width: 90px; transform: rotate(-11deg); } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-images { min-height: 39.6vw; } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-images { min-height: 495px; padding-left: 27px; padding-right: 27px; } } .twlanding-body .tw-desktop-app--section-images .wrap { background-color: #c8dff2; } @media (max-width: 320px) { .twlanding-body .tw-desktop-app--section-images .wrap { padding-top: 22px; padding-bottom: 0px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-desktop-app--section-images .wrap { padding-top: 6.875vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .tw-desktop-app--section-images .wrap { padding-top: 31px; padding-bottom: 38px; padding-top: 4.03669vw; padding-bottom: 4.9482vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .tw-desktop-app--section-images .wrap { padding-top: 31px; padding-bottom: 38px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-images .wrap { padding-top: 2.48vw; padding-bottom: 3.04vw; } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-images .wrap { padding-top: 31px; padding-bottom: 38px; } } .twlanding-body .tw-desktop-app--section-images .app-col { margin-bottom: 50px; text-align: center; } @media (max-width: 320px) { .twlanding-body .tw-desktop-app--section-images .app-col { margin-bottom: 30px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-desktop-app--section-images .app-col { margin-bottom: 9.375vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .tw-desktop-app--section-images .app-col { float: left; width: 33.3%; margin: 0; padding: 0 20px; padding: 0 2.60432vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .tw-desktop-app--section-images .app-col { float: left; width: 33.3%; margin: 0; padding: 0 20px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-images .app-col { float: left; width: 33.3%; margin: 0; padding: 0 1.6vw; } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-images .app-col { float: left; width: 33.3%; margin: 0; padding: 0 20px; } } .twlanding-body .tw-desktop-app--section-images .app-col h3 { width: 270px; margin: auto; color: #004f88; text-align: left; padding: 0; line-height: 1; margin-bottom: 20px; } @media (max-width: 320px) { .twlanding-body .tw-desktop-app--section-images .app-col h3 { width: 100%; padding: 0 5px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-desktop-app--section-images .app-col h3 { width: 100%; padding: 0 1.5625vw; text-align: center; margin-bottom: 35px; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .tw-desktop-app--section-images .app-col h3 { margin: 0; padding: 0; line-height: 1; width: 100%; height: 56px; font-size: 16px; height: 7.29209vw; font-size: 2.08345vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .tw-desktop-app--section-images .app-col h3 { width: 100%; margin: 0; padding: 0; height: 66px; font-size: 20px; line-height: 1; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-images .app-col h3 { width: 100%; line-height: 1; margin: 0; padding: 0; height: 7.68vw; font-size: 2.08vw; } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-images .app-col h3 { width: 100%; line-height: 1; margin: 0; padding: 0; height: 96px; font-size: 26px; } } .twlanding-body .tw-desktop-app--section-images .app-col .browser-image { margin: auto; } .twlanding-body .tw-desktop-app--section-images .app-col img { width: 270px; } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-desktop-app--section-images .app-col img { width: 84.375vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .tw-desktop-app--section-images .app-col img { width: 100%; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .tw-desktop-app--section-images .app-col img { width: 100%; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-images .app-col img { width: 100%; } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-images .app-col img { width: 100%; } } @media (max-width: 320px) { .twlanding-body .tw-desktop-app--section-bottom { padding-top: 10px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-desktop-app--section-bottom { padding-top: 3.125vw; } } .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-image-section { margin: auto; } .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-image-section img { width: 180px; } @media (max-width: 320px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-image-section { display: none; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-image-section { display: none; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-image-section { display: none; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-image-section { width: 242px; float: left; padding-top: 35px; padding-left: 20px; } .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-image-section img { width: 180px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-image-section { width: 19.36vw; float: left; padding-top: 2.8vw; padding-left: 1.6vw; } .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-image-section img { width: 14.4vw; } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-image-section { width: 242px; float: left; padding-top: 35px; padding-left: 20px; } .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-image-section img { width: 180px; } } .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section { margin: auto; width: 280px; } @media (max-width: 320px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section { padding-top: 22px; padding-bottom: 40px; width: 280px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section { padding-top: 6.875vw; padding-bottom: 12.5vw; width: 87.5vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section { float: left; padding-top: 62px; padding-bottom: 50px; width: 375px; padding-top: 8.07338vw; padding-bottom: 6.51079vw; width: 48.83094vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section { padding-top: 62px; padding-bottom: 50px; width: 375px; float: left; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section { padding-top: 4.96vw; padding-bottom: 4vw; width: 30vw; float: left; } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section { padding-top: 62px; padding-bottom: 50px; width: 375px; float: left; } } .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section .title { color: #4b5155; text-align: left; margin: 0; padding: 0; } @media (max-width: 320px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section .title { font-size: 16px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section .title { font-size: 5vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section .title { font-size: 16px; margin-bottom: 14px; font-size: 2.08345vw; margin-bottom: 1.82302vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section .title { font-size: 22px; margin-bottom: 14px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section .title { font-size: 1.76vw; margin-bottom: 1.12vw; } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section .title { font-size: 22px; margin-bottom: 14px; } } .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section div { color: #4b5155; } @media (max-width: 320px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section div { font-size: 14px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section div { font-size: 4.375vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section div { font-size: 14px; font-size: 1.82302vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section div { font-size: 16px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section div { font-size: 1.28vw; } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section div { font-size: 16px; } } .twlanding-body .tw-desktop-app--section-drag { position: relative; z-index: 1; margin-top: 2px; margin-bottom: 2px; } .twlanding-body .tw-desktop-app--section-drag .wrap { overflow: visible; height: 130px; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; background-color: #f2f7fc; } @media (max-width: 320px) { .twlanding-body .tw-desktop-app--section-drag .wrap { height: auto; -ms-flex-direction: column; flex-direction: column; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-desktop-app--section-drag .wrap { height: auto; -ms-flex-direction: column; flex-direction: column; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .tw-desktop-app--section-drag .wrap { overflow: visible; padding-left: 26px; padding-right: 26px; padding-left: 3.38561vw; padding-right: 3.38561vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .tw-desktop-app--section-drag .wrap { overflow: visible; } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-drag .wrap { overflow: visible; } } .twlanding-body .tw-desktop-app--section-drag .twda--sd-left { display: -ms-flexbox; display: flex; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 0; flex-shrink: 0; width: 320px; height: 74px; color: #0f4372; border-left: 20px solid #ff5c5e; padding-left: 16px; font-size: 20px; font-weight: 400; } @media (max-width: 320px) { .twlanding-body .tw-desktop-app--section-drag .twda--sd-left { width: 290px; height: 54px; font-size: 14px; border-width: 12px; margin-top: 26px; margin-bottom: 26px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-desktop-app--section-drag .twda--sd-left { width: 90.625vw; height: 16.875vw; font-size: 4.375vw; border-width: 3.75vw; margin-top: 8.125vw; margin-bottom: 8.125vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .tw-desktop-app--section-drag .twda--sd-left { width: 160px; height: 46px; padding-left: 16px; font-size: 12px; border-width: 10px; width: 20.83453vw; height: 5.98993vw; padding-left: 2.08345vw; font-size: 1.56259vw; border-width: 1.30216vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .tw-desktop-app--section-drag .twda--sd-left { width: 240px; font-size: 16px; border-width: 10px; height: 60px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-drag .twda--sd-left { width: 25.6vw; height: 5.92vw; padding-left: 1.28vw; font-size: 1.6vw; border-width: 1.6vw; } } .twlanding-body .tw-desktop-app--section-drag .twda--sd-middle { display: -ms-flexbox; display: flex; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 0; flex-shrink: 0; width: 320px; -ms-flex-pack: center; justify-content: center; } .twlanding-body .tw-desktop-app--section-drag .twda--sd-middle .twda--sd-middle--img-block { width: 290px; height: 86px; position: relative; box-shadow: 0 0 20px 1px rgba(0, 0, 0, 0.15); } .twlanding-body .tw-desktop-app--section-drag .twda--sd-middle .twda--sd-middle--img-block .timeline-bg-full { width: 290px; height: 86px; position: absolute; z-index: 1; } .twlanding-body .tw-desktop-app--section-drag .twda--sd-middle .twda--sd-middle--img-block .timeline-drag { position: absolute; z-index: 2; left: 49px; top: 7px; } .twlanding-body .tw-desktop-app--section-drag .twda--sd-middle .twda--sd-middle--img-block .timeline-drag > div div:nth-child(2) { background: transparent !important; } .twlanding-body .tw-desktop-app--section-drag .twda--sd-middle .twda--sd-middle--img-block .timeline-drag > div div:nth-child(3) { position: absolute; top: 0; bottom: 0; margin-left: -1px; width: 2px; background: transparent; } .twlanding-body .tw-desktop-app--section-drag .twda--sd-middle .twda--sd-middle--img-block .timeline-drag:hover * { cursor: auto !important; } .twlanding-body .tw-desktop-app--section-drag .twda--sd-middle .twda--sd-middle--img-block .timeline-drag:before { content: ''; display: block; width: 1px; height: 100%; background: rgba(0, 66, 116, 0.2); position: absolute; top: 0; left: 1px; } .twlanding-body .tw-desktop-app--section-drag .twda--sd-middle .twda--sd-middle--img-block .timeline-drag > div div:nth-child(3) { background: rgba(0, 66, 116, 0.2); width: 1px; } .twlanding-body .tw-desktop-app--section-drag .twda--sd-middle .twda--sd-middle--img-block .timeline-drag > div div:nth-child(3):before { content: ''; display: block; width: 22px; height: 22px; position: absolute; top: 4px; left: -10px; background-image: url("/img/front/timer-desktop-app/drag-cursor.svg"); background-repeat: no-repeat; background-position: 0 0; background-size: 22px; } .twlanding-body .tw-desktop-app--section-drag .twda--sd-middle .twda--sd-middle--img-block .timeline-drag.fixed > div > div:nth-child(1) { width: 75% !important; } .twlanding-body .tw-desktop-app--section-drag .twda--sd-middle .twda--sd-middle--img-block .timeline-drag.fixed > div > div:nth-child(3) { left: 75% !important; } .twlanding-body .tw-desktop-app--section-drag .twda--sd-right { display: -ms-flexbox; display: flex; -ms-flex-positive: 1; flex-grow: 1; } @media (max-width: 320px) { .twlanding-body .tw-desktop-app--section-drag .twda--sd-right { margin-top: 26px; margin-bottom: 16px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-desktop-app--section-drag .twda--sd-right { margin-top: 8.125vw; margin-bottom: 5vw; } } .twlanding-body .tw-desktop-app--section-drag .twda--sd-right ul { margin: 0; padding: 0; list-style: none; } .twlanding-body .tw-desktop-app--section-drag .twda--sd-right li { color: #4a5155; font-size: 20px; padding-left: 56px; padding-right: 20px; background-image: url("/img/front/desktop-app/angle-right-solid.svg"); background-repeat: no-repeat; background-size: 10px; background-position: 36px 2px; margin-bottom: 4px; } @media (max-width: 320px) { .twlanding-body .tw-desktop-app--section-drag .twda--sd-right li { font-size: 14px; padding-left: 23px; padding-right: 0px; background-size: 10px; background-position: 6px 3px; margin-bottom: 4px; background-size: 6px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-desktop-app--section-drag .twda--sd-right li { font-size: 4.375vw; padding-left: 7.1875vw; padding-right: 0; background-size: 3.125vw; background-position: 1.875vw 0.9375vw; margin-bottom: 1.25vw; background-size: 1.875vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .tw-desktop-app--section-drag .twda--sd-right li { font-size: 12px; padding-left: 22px; padding-right: 0px; background-size: 10px; background-position: 16px 2px; margin-bottom: 4px; background-size: 6px; background-position: 6px 3px; font-size: 1.56259vw; padding-left: 2.86475vw; background-size: 1.30216vw; background-position: 2.08345vw 0.26043vw; margin-bottom: 0.52086vw; background-size: 0.78129vw; background-position: 0.78129vw 0.39065vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .tw-desktop-app--section-drag .twda--sd-right li { font-size: 16px; padding-left: 56px; padding-right: 0px; background-size: 10px; background-position: 36px 2px; margin-bottom: 4px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-drag .twda--sd-right li { font-size: 1.44vw; padding-left: 4.48vw; padding-right: 0vw; background-size: 0.8vw; background-position: 2.88vw 0.16vw; margin-bottom: 0.32vw; } } .tw-page--mobile-gps .section-app-gps { overflow: hidden; position: relative; z-index: 1; background-color: #c8dff2; } @media (max-width: 320px) { .tw-page--mobile-gps .section-app-gps { padding-bottom: 30px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-page--mobile-gps .section-app-gps { padding-bottom: 9.375vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--mobile-gps .section-app-gps { height: 500px; padding-bottom: 20px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--mobile-gps .section-app-gps { height: 44vw; padding-bottom: 1.6vw; } } @media (min-width: 1240px) { .tw-page--mobile-gps .section-app-gps { height: 520px; padding-bottom: 20px; } } .tw-page--mobile-gps .section-app-gps .wrap { overflow: visible; position: relative; } @media (max-width: 320px) { .tw-page--mobile-gps .section-app-gps .wrap { padding-top: 10px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-page--mobile-gps .section-app-gps .wrap { padding-top: 3.125vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--mobile-gps .section-app-gps .wrap { overflow: visible; padding-top: 10px; padding-left: 26px; padding-right: 26px; padding-top: 1.30216vw; padding-left: 3.38561vw; padding-right: 3.38561vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--mobile-gps .section-app-gps .wrap { overflow: visible; padding-top: 10px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--mobile-gps .section-app-gps .wrap { padding-top: 0.8vw; } } @media (min-width: 1240px) { .tw-page--mobile-gps .section-app-gps .wrap { overflow: visible; padding-top: 10px; } } .tw-page--mobile-gps .section-app-gps .twda--bg-content--bottom-left { background-image: url("/img/front/landing-bg/bg-app-mobile--bottom.svg"); background-repeat: no-repeat; background-position: 0 0; position: absolute; z-index: 1; background-size: 450px; width: 450px; height: 46px; bottom: 0px; left: 58px; } @media (max-width: 320px) { .tw-page--mobile-gps .section-app-gps .twda--bg-content--bottom-left { display: none; } } @media (min-width: 321px) and (max-width: 735px) { .tw-page--mobile-gps .section-app-gps .twda--bg-content--bottom-left { display: none; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--mobile-gps .section-app-gps .twda--bg-content--bottom-left { background-size: 35.80935vw; width: 35.80935vw; height: 2.99496vw; left: 3.90647vw; } } .tw-page--mobile-gps .section-app-gps .twda--bg-content { background-image: url("/img/front/landing-bg/bg-app--top.svg"); background-repeat: no-repeat; background-size: cover; background-position: 50% -52px; background-size: 2072px; } @media (max-width: 320px) { .tw-page--mobile-gps .section-app-gps .twda--bg-content { background-position: -366px -60px; background-size: 1482px; } } @media (min-width: 321px) and (max-width: 735px) { .tw-page--mobile-gps .section-app-gps .twda--bg-content { background-position: -114.375vw -18.75vw; background-size: 463.125vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--mobile-gps .section-app-gps .twda--bg-content { background-position: 50% -10px; background-size: 1420px; background-size: 184.90647vw; background-position: 50% -7.81295vw; } } @media screen and (min-width: 860px) { .tw-page--mobile-gps .section-app-gps .twda--bg-content { background-position: 50% -7.16187vw; } } @media screen and (min-width: 920px) { .tw-page--mobile-gps .section-app-gps .twda--bg-content { background-position: 50% -7.81295vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--mobile-gps .section-app-gps .twda--bg-content { background-size: 2000px; } } @media screen and (min-width: 1026px) { .tw-page--mobile-gps .section-app-gps .twda--bg-content { background-size: 165.76vw; background-position: 50% -5.6vw; } } @media screen and (min-width: 1060px) { .tw-page--mobile-gps .section-app-gps .twda--bg-content { background-size: 165.76vw; background-position: 50% -5.6vw; } } @media screen and (min-width: 1120px) { .tw-page--mobile-gps .section-app-gps .twda--bg-content { background-size: 165.76vw; background-position: 50% -5.6vw; } } @media screen and (min-width: 1180px) and (max-width: 1239px) { .tw-page--mobile-gps .section-app-gps .twda--bg-content { background-size: 165.76vw; background-position: 50% -5.6vw; } } @media (min-width: 1240px) and (max-width: 1399px) { .tw-page--mobile-gps .section-app-gps .twda--bg-content { background-size: 2072px; background-position: 50% -52px; } } @media (min-width: 1400px) { .tw-page--mobile-gps .section-app-gps .twda--bg-content { background-size: 2072px; background-position: 50% -52px; } } .tw-page--mobile-gps .section-app-gps h2 { font-family: "LatoRegular"; margin-top: 20px; } @media (min-width: 321px) and (max-width: 735px) { .tw-page--mobile-gps .section-app-gps h2 { margin-top: 6.25vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--mobile-gps .section-app-gps h2 { margin-top: 30px; margin-bottom: 30px; margin-top: 3.90647vw; margin-bottom: 3.90647vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--mobile-gps .section-app-gps h2 { margin-top: 20px; margin-bottom: 30px; font-size: 32px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--mobile-gps .section-app-gps h2 { margin-top: 1.6vw; margin-bottom: 2.4vw; font-size: 2.56vw; } } @media (min-width: 1240px) { .tw-page--mobile-gps .section-app-gps h2 { margin-top: 20px; margin-bottom: 30px; font-size: 32px; } } .tw-page--mobile-gps .section-app-gps .sections { overflow: visible; text-align: center; max-width: 1060px; margin: auto; position: relative; z-index: 1; } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--mobile-gps .section-app-gps .sections { height: 33.85612vw; padding-left: 2.60432vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--mobile-gps .section-app-gps .sections { height: 412px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--mobile-gps .section-app-gps .sections { height: 36vw; padding-left: 1.6vw; } } @media (min-width: 1240px) { .tw-page--mobile-gps .section-app-gps .sections { height: 412px; padding-left: 20px; } } .tw-page--mobile-gps .section-app-gps .twda-overview--images-section { text-align: center; width: 474px; margin: auto; } @media (max-width: 320px) { .tw-page--mobile-gps .section-app-gps .twda-overview--images-section { width: 280px; height: 280px; position: relative; width: 87.5vw; height: 81.25vw; } } @media (min-width: 321px) and (max-width: 735px) { .tw-page--mobile-gps .section-app-gps .twda-overview--images-section { width: 87.5vw; height: 81.25vw; padding-top: 3.125vw; position: relative; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--mobile-gps .section-app-gps .twda-overview--images-section { float: left; position: relative; padding-top: 1.30216vw; width: 36.46043vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--mobile-gps .section-app-gps .twda-overview--images-section { float: left; position: relative; width: 400px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--mobile-gps .section-app-gps .twda-overview--images-section { float: left; position: relative; width: 38.4vw; } } @media (min-width: 1240px) { .tw-page--mobile-gps .section-app-gps .twda-overview--images-section { float: left; position: relative; top: -10px; } } .tw-page--mobile-gps .section-app-gps .twda-overview--images-section .mobile-image { display: block; margin: auto; margin-bottom: 0; } .tw-page--mobile-gps .section-app-gps .twda-overview--images-section .mobile-image .tw-img-wrap { position: relative; } .tw-page--mobile-gps .section-app-gps .twda-overview--images-section .mobile-image img { width: 100%; display: block; border-radius: 20px; } .tw-page--mobile-gps .section-app-gps .twda-overview--text-section { margin: auto; width: 563px; } @media (max-width: 320px) { .tw-page--mobile-gps .section-app-gps .twda-overview--text-section { width: 100%; } } @media (min-width: 321px) and (max-width: 735px) { .tw-page--mobile-gps .section-app-gps .twda-overview--text-section { width: 87.5vw; } } @media (min-width: 736px) and (max-width: 1023px) { .tw-page--mobile-gps .section-app-gps .twda-overview--text-section { float: right; width: 370px; width: 48.17986vw; padding-top: 0px; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .tw-page--mobile-gps .section-app-gps .twda-overview--text-section { float: left; width: 420px; margin-left: 50px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .tw-page--mobile-gps .section-app-gps .twda-overview--text-section { float: left; float: right; width: 44.8vw; } } @media (min-width: 1240px) { .tw-page--mobile-gps .section-app-gps .twda-overview--text-section { float: left; } } .tw-page--mobile-gps .section-app-gps .tw-check-list--page { position: relative; top: -5px; } .tw-page--mobile-gps .section-app-gps .tw-check-list--page li { width: 100%; max-width: 600px; } .section-app-qrs { position: relative; z-index: 1; } @media (max-width: 320px) { .section-app-qrs { padding-bottom: 30px; } } @media (min-width: 321px) and (max-width: 735px) { .section-app-qrs { padding-bottom: 9.375vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .section-app-qrs { padding-bottom: 20px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .section-app-qrs { padding-bottom: 1.6vw; } } @media (min-width: 1240px) { .section-app-qrs { padding-bottom: 20px; } } .section-app-qrs .wrap { overflow: visible; } @media (max-width: 320px) { .section-app-qrs .wrap { padding-top: 10px; } } @media (min-width: 321px) and (max-width: 735px) { .section-app-qrs .wrap { padding-top: 3.125vw; } } @media (min-width: 736px) and (max-width: 1023px) { .section-app-qrs .wrap { overflow: visible; padding-top: 10px; padding-left: 26px; padding-right: 26px; padding-top: 1.30216vw; padding-left: 3.38561vw; padding-right: 3.38561vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .section-app-qrs .wrap { overflow: visible; padding-top: 10px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .section-app-qrs .wrap { padding-top: 0.8vw; } } @media (min-width: 1240px) { .section-app-qrs .wrap { overflow: visible; padding-top: 10px; } } .section-app-qrs h2 { font-family: "LatoBold"; color: #3f3f3f; margin-top: 0px; font-size: 26px; padding-bottom: 0; margin-bottom: 18px; line-height: 1; text-align: left; } @media (max-width: 320px) { .section-app-qrs h2 { font-size: 18px; } } @media (min-width: 321px) and (max-width: 735px) { .section-app-qrs h2 { margin-bottom: 5.625vw; font-size: 5.625vw; } } @media (min-width: 736px) and (max-width: 1023px) { .section-app-qrs h2 { margin-bottom: 15px; margin-bottom: 2.34388vw; font-size: 2.34388vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .section-app-qrs h2 { margin-bottom: 18px; font-size: 26px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .section-app-qrs h2 { margin-bottom: 1.44vw; font-size: 2.08vw; } } @media (min-width: 1240px) { .section-app-qrs h2 { margin-bottom: 18px; font-size: 26px; } } .section-app-qrs .sections { overflow: visible; text-align: center; display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-align: start; align-items: flex-start; -ms-flex-pack: center; justify-content: center; gap: 80px; } @media (max-width: 320px) { .section-app-qrs .sections { -ms-flex-direction: column; flex-direction: column; gap: 20px; } } @media (min-width: 321px) and (max-width: 735px) { .section-app-qrs .sections { -ms-flex-direction: column; flex-direction: column; gap: 6.25vw; } } @media (min-width: 1240px) { .section-app-qrs .sections { height: 455px; } } .section-app-qrs .twda-qrs--text-section { width: 472px; padding-top: 54px; } @media (max-width: 320px) { .section-app-qrs .twda-qrs--text-section { width: 100%; } } @media (min-width: 321px) and (max-width: 735px) { .section-app-qrs .twda-qrs--text-section { padding-top: 13.75vw; width: 100%; } } @media (min-width: 736px) and (max-width: 1023px) { .section-app-qrs .twda-qrs--text-section { float: right; width: 370px; width: 48.17986vw; padding-top: 0px; padding-top: 5.7295vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .section-app-qrs .twda-qrs--text-section { float: left; width: 320px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .section-app-qrs .twda-qrs--text-section { float: left; float: right; width: 37.76vw; } } @media (min-width: 1240px) { .section-app-qrs .twda-qrs--text-section { float: left; width: 472px; } } .section-app-qrs .app-platforms { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; -ms-flex-align: start; align-items: flex-start; -ms-flex-pack: justify; justify-content: space-between; text-align: left; padding-top: 50px; width: 450px; } @media (max-width: 320px) { .section-app-qrs .app-platforms { width: 100%; -ms-flex-pack: distribute; justify-content: space-around; } } @media (min-width: 321px) and (max-width: 735px) { .section-app-qrs .app-platforms { width: 100%; -ms-flex-pack: distribute; justify-content: space-around; } } @media (min-width: 736px) and (max-width: 1023px) { .section-app-qrs .app-platforms { position: relative; top: 0px; width: 58.59712vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .section-app-qrs .app-platforms { position: relative; top: 0px; width: 450px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .section-app-qrs .app-platforms { width: 36vw; } } .section-app-qrs .app-platforms .app-platform { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; -ms-flex-align: start; align-items: flex-start; -ms-flex-pack: start; justify-content: flex-start; } .section-app-qrs .app-platforms a { text-decoration: none; display: inline-block; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; padding-left: 10px; padding-bottom: 20px; } .section-app-qrs .app-platforms a img { height: 50px; display: block; float: left; } @media (max-width: 320px) { .section-app-qrs .app-platforms a img { width: 100%; } } @media (min-width: 321px) and (max-width: 735px) { .section-app-qrs .app-platforms a img { width: 100%; } } @media (min-width: 736px) and (max-width: 1023px) { .section-app-qrs .app-platforms a img { height: 32px; height: 4.16691vw; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .section-app-qrs .app-platforms a img { height: 4vw; } } .section-app-qrs .app-platforms .app-qr { width: 200px; height: 200px; } @media (max-width: 320px) { .section-app-qrs .app-platforms .app-qr { width: 140px; height: 140px; display: none; } } @media (min-width: 321px) and (max-width: 735px) { .section-app-qrs .app-platforms .app-qr { width: 43.75vw; height: 43.75vw; display: none; } } @media (min-width: 736px) and (max-width: 1023px) { .section-app-qrs .app-platforms .app-qr { width: 19.53237vw; height: 19.53237vw; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .section-app-qrs .app-platforms .app-qr { width: 16vw; height: 16vw; } } .section-app-qrs .app-platforms .app-qr img { width: 100%; } .section-app-qrs .twda-qrs--note { font-size: 15px; text-align: left; } @media (max-width: 320px) { .twlanding-body .tw-desktop-app--section-bottom { padding-top: 10px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-desktop-app--section-bottom { padding-top: 3.125vw; } } .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-image-section { margin: auto; } .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-image-section img { width: 180px; } @media (max-width: 320px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-image-section { display: none; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-image-section { display: none; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-image-section { display: none; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-image-section { width: 242px; float: left; padding-top: 35px; padding-left: 20px; } .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-image-section img { width: 180px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-image-section { width: 19.36vw; float: left; padding-top: 2.8vw; padding-left: 1.6vw; } .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-image-section img { width: 14.4vw; } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-image-section { width: 242px; float: left; padding-top: 35px; padding-left: 20px; } .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-image-section img { width: 180px; } } .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section { margin: auto; width: 280px; } @media (max-width: 320px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section { padding-top: 22px; padding-bottom: 40px; width: 280px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section { padding-top: 6.875vw; padding-bottom: 12.5vw; width: 87.5vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section { float: left; padding-top: 62px; padding-bottom: 50px; width: 375px; padding-top: 8.07338vw; padding-bottom: 6.51079vw; width: 48.83094vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section { padding-top: 62px; padding-bottom: 50px; width: 375px; float: left; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section { padding-top: 4.96vw; padding-bottom: 4vw; width: 30vw; float: left; } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section { padding-top: 62px; padding-bottom: 50px; width: 375px; float: left; } } .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section .title { color: #4b5155; text-align: left; margin: 0; padding: 0; } @media (max-width: 320px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section .title { font-size: 16px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section .title { font-size: 5vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section .title { font-size: 16px; margin-bottom: 14px; font-size: 2.08345vw; margin-bottom: 1.82302vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section .title { font-size: 22px; margin-bottom: 14px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section .title { font-size: 1.76vw; margin-bottom: 1.12vw; } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section .title { font-size: 22px; margin-bottom: 14px; } } .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section div { color: #4b5155; } @media (max-width: 320px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section div { font-size: 14px; } } @media (min-width: 321px) and (max-width: 735px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section div { font-size: 4.375vw; } } @media (min-width: 736px) and (max-width: 1023px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section div { font-size: 14px; font-size: 1.82302vw; } } @media screen and (min-width: 1024px) and (max-width: 1025px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section div { font-size: 16px; } } @media screen and (min-width: 1026px) and (max-width: 1239px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section div { font-size: 1.28vw; } } @media (min-width: 1240px) { .twlanding-body .tw-desktop-app--section-bottom .wrap .twda-bottom-text-section div { font-size: 16px; } }