BODY { padding-top: 0px !important; } #helix_container { font-size: 16px; color: #DEDEDE; font-weight: 200; background-color: #000; } #helix_container h1, #helix_container h2, #helix_container h3, #helix_container h4, #helix_container h5, #helix_container h6, #helix_container .h1, #helix_container .h2, #helix_container .h3, #helix_container .h4, #helix_container .h5, #helix_container .h6 { font-weight: 200; } #helix_container h1 { margin: 0; font-size: 4em; } #helix_container h2 { margin: 30px 0 30px; font-size: 2.5em; text-shadow: 0 0 20px #000, 0 0 30px rgba(200, 200, 200, 0.3); } #helix_container h3 { font-size: 2em; color: #0095D7; text-shadow: 0 0 10px #000; } #helix_container .btn { background-color: transparent; font-size: 1.3em; font-weight: inherit; border-radius: 0; padding: 5px 30px; animation-duration: .2s; animation-timing-function: ease-in-out; color: inherit; } #helix_container .btn.primary { border: 1px solid #0396CC; animation-name: btn-out; } #helix_container .btn.primary:hover { animation-name: btn-hover; background-color: #0396CC; color: initial; } #helix_container .btn.alt { border: 1px solid #FF9934; animation-name: btn-alt-out; } #helix_container .btn.alt:hover { animation-name: btn-alt-hover; background-color: #FF9934; color: black; } #helix_container section { position: relative; padding-top: 30px; padding-bottom: 30px; } #helix_container section .section-fg { position: relative; z-index: 100; } #helix_container #helix_nav { position: absolute; z-index: 108; width: 90%; margin: 0 5%; height: 80px; border-bottom: 1px solid #bcbcbc; } #helix_container #helix_nav.active { background-color: rgba(0, 0, 0, 0.5); } #helix_container #helix_nav a { color: #DEDEDE; } #helix_container #helix_nav a:focus, #helix_container #helix_nav a:hover { background-color: initial; } #helix_container #helix_nav a:hover { color: #FF9934; } #helix_container #helix_nav a.buy-cta { -webkit-border-radius: 3px; border-radius: 3px; background-color: #50b0ff; width: auto; height: 30px; display: inline-block; text-transform: uppercase; color: #ffffff; padding: 0 10px; line-height: 30px; margin-top: 6px; margin-left: 30px; transition-duration: .2s; font-weight: 400; font-size: .8em; } #helix_container #helix_nav a.buy-cta:hover { background-color: #038dff; } #helix_container #helix_nav .menu-button { width: 50px; cursor: pointer; z-index: 1000; margin: 0; border: 0; color: transparent; position: absolute; right: 10px; top: 15px; padding: 0; font-size: 20px; transform: translate3d(-0.9em, 0.9em, 0); outline: none; } #helix_container #helix_nav .menu-button .hamburger-box { width: 50px; } #helix_container #helix_nav .menu-button .hamburger-inner, #helix_container #helix_nav .menu-button .hamburger-inner::before, #helix_container #helix_nav .menu-button .hamburger-inner::after { background: #FFFFFF; height: 2px; width: 50px; } #helix_container #helix_nav #nav-home a:hover { color: #DEDEDE; } #helix_container #helix_nav h1 { margin: 0; float: left; font-size: 40px; padding: 18px 0; font-weight: 200; position: relative; z-index: 100; } #helix_container #helix_nav ul { float: right; position: relative; top: 25px; font-size: 15px; } #helix_container #helix_nav .nav > li > a { padding: 10px 8px !important; } #helix_container #helix_nav .nav > li > a.buy-cta { padding: 0px 10px !important; } #helix_container #helix_content { padding-top: 80px; } #helix_container #helix-footer #stay-informed { padding-bottom: 100px; padding-top: 0px; min-height: 300px; } #helix_container #helix-footer #stay-informed #stay-informed-container { position: relative; } #helix_container #helix-footer #stay-informed form { margin: 0 15%; } #helix_container #helix-footer #stay-informed form input[type=text], #helix_container #helix-footer #stay-informed form select { width: 100%; margin: 10px auto; padding: 10px 8px; background-color: #000; border: 1px solid #FFF; color: #DEDEDE; } #helix_container #helix-footer #stay-informed form input { display: block; width: 100%; margin: 10px auto; padding: 10px 15px; font-size: 1em; } #helix_container #helix-footer #stay-informed #stay-informed-loading { display: none; transition-duration: .2s; opacity: 0; position: absolute; width: 100%; height: 100%; padding-top: 60px; background: rgba(0, 0, 0, 0.9); } #helix_container #helix-footer h2 { color: #DEDEDE; } #helix_container #helix-footer h3 { color: #929292; } #helix_container #helix-footer #helix_capture { padding-top: 15vh; padding-bottom: 20vh; } #helix_container .disclaimer { font-size: .7em; color: #0095D7; } #helix_container .disclaimer a { color: #FF9934; } #helix_container .title h2 { font-size: 2em; color: #0095D7; } #helix_container .title #logo { position: relative; font-size: 4em; line-height: 1em; display: inline-block; } #helix_container .title #logo span { text-align: center; display: inline-block; top: 0; height: 1em; } #helix_container .title #logo .parent { color: #f9f9f9; position: absolute; z-index: 1; white-space: nowrap; opacity: 0.35; -webkit-animation-name: flash-letter; -webkit-animation-iteration-count: infinite; -webkit-animation-duration: 2400ms; -webkit-animation-duration: 3.2s; -webkit-animation-timing-function: ease; -webkit-animation-fill-mode: none; } #helix_container .title #logo .lower { top: 0; color: #95b0d5; white-space: nowrap; } #helix_container .title #logo [class^="icon-"]:before, #helix_container .title #logo [class*=" icon-"]:before { font-family: 'helix'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* better font rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } #helix_container #helix_splash { min-height: 950px; padding-top: 0; background-image: url(/helix/images/overview/helix-overview-header-graphic.jpg); background-repeat: no-repeat; background-position: top center; background-size: cover; } #helix_container #helix_splash .section-fg { padding-top: 0px; } #helix_container #helix_splash .section-fg .title { margin: 300px 0 0px; } #helix_container #helix_splash .splash-copy p { padding: 10px 60px; } #helix_container #helix_splash .splash-copy p:first-of-type { border-right: 1px solid #fefefe; } #helix_container.helix-model { position: relative; padding-bottom: 80px; } #helix_container.helix-model .media img { width: 100%; } #helix_container.helix-model .model-container { margin-top: 100px; display: flex; align-items: stretch; } #helix_container.helix-model .model-container img { margin-top: -75px; margin-bottom: 0px; opacity: 0; } #helix_container.helix-model .detail { margin-top: 150px; border-left: 2px solid #fefefe; width: 50%; } #helix_container.helix-model .detail .buy-container { border-bottom: 1px solid #fefefe; padding: 20px 40px; position: relative; } #helix_container.helix-model .detail .buy-container .btn { position: absolute; right: 20px; bottom: 10px; } #helix_container.helix-model .detail .description { padding: 20px 40px; } #helix_container.helix-model .title { width: 50%; position: relative; padding: 40px; margin-bottom: 0; } #helix_container.helix-model .title .btn { position: absolute; right: 40px; bottom: 40px; } #helix_container #features li { color: #0095D7; cursor: pointer; list-style: none; text-align: center; text-transform: uppercase; min-height: 200px; font-weight: 300; } #helix_container #features li img { display: block; margin: auto; padding-bottom: 20px; } #helix_container #helix_features_modal { background: #171717; padding-top: 0vh; position: fixed; bottom: -100vh; height: 100vh; width: 100%; z-index: 200; max-width: 1400px; } #helix_container #helix_features_modal .modal-content { background-color: transparent; display: none; border: none; box-shadow: none; } #helix_container #helix_features_modal .modal-content section { height: 100vh; } #helix_container #helix_features_modal .modal-content section p { text-shadow: 0px 0px 10px #000; } #helix_container #helix_features_modal .modal-content section img { margin-top: 30vh; margin-bottom: 10vh; } #helix_container #helix_features_modal .modal-content section img.nopadding { padding: 0; } #helix_container #helix_features_modal .modal-content div.content { margin-top: 30vh; margin-bottom: 10vh; background-color: rgba(0, 0, 0, 0.6); } #helix_container #helix_features_modal .modal-content#modal-behavioral-modeling img { margin-top: 30px; margin-bottom: 10px; } #helix_container #helix_features_modal .modal-content#modal-behavioral-modeling div { margin-top: 0px; } #helix_container #helix_features_modal .modal-content#modal-variax-control img { margin-top: 0; } #helix_container #helix_features_modal .modal-content#modal-io-routing { background-image: url(/helix/images/features/lt/LT-io-routing.jpg); background-size: cover; } #helix_container #helix_features_modal .modal-content#modal-effects-loop { background-image: url(/helix/images/features/floor/helix-effects-loops.jpg); background-size: cover; } #helix_container #helix_features_modal .modal-content#modal-lt-hands-free { background-image: url(/helix/images/features/lt/LT-hands-free.jpg); background-size: cover; } #helix_container #helix_features_modal .modal-content#modal-hands-free { background-image: url(/helix/images/features/floor/helix-hands-free.jpg); background-size: cover; } #helix_container #helix_features_modal .modal-content#modal-lt-easy-interaction { background-image: url(/helix/images/features/lt/LT-intelligent-interface.jpg); background-size: cover; } #helix_container #helix_features_modal .modal-content#modal-smart-interaction { background-image: url(/helix/images/features/floor/helix-intelligent-interface.jpg); background-size: cover; } #helix_container #helix_features_modal .modal-content#modal-scribble-strips { background-image: url(/helix/images/features/floor/helix-scribble-strips.jpg); background-size: cover; } #helix_container #helix_features_modal .modal-content#modal-lt-touch-footswitches { background-image: url(/helix/images/features/lt/LT-capacitive-footswitches.jpg); background-size: cover; } #helix_container #helix_features_modal .modal-content#modal-touch-footswitches { background-image: url(/helix/images/features/floor/helix-touch-footswitches.jpg); background-size: cover; } #helix_container #helix_features_modal h4 { margin: 30px 0; color: #999; } #helix_container #helix_features_modal .dialog_close { z-index: 100; background: none; border: none; font-weight: normal; font-size: 3em; top: -16px; color: #DEDEDE; } #helix_container #helix_features_modal .content { padding: 20px 60px; } #helix_container #helix_features_modal .content h3 { color: orange; font-size: 2.5em; padding-top: 15px; } #helix_container #features > div { margin-top: 80px; } #helix_container #compare > div { margin: 0 50px; } #helix_container #explore-features { padding: 60px 0; margin: auto; } #helix_container #explore-features .interactive-headline { margin: 0 50px 25px; display: flex; align-items: flex-end; justify-content: space-between; } #helix_container #explore-features .interactive-headline ul { padding: 0; position: relative; } #helix_container #explore-features .interactive-headline ul li { float: left; list-style: none; padding: 0 10px; z-index: 10; transition-duration: .5s; } #helix_container #explore-features .interactive-headline ul li.selector { width: 50%; height: 100%; border: 1px solid #00A94F; position: absolute; left: 50%; right: 0; z-index: 1; } #helix_container #explore-features .interactive-headline h2 { margin: 0; } #helix_container #explore-features .interactive-headline h3 { margin-top: 10px; color: #0095D7; font-size: 1em; } #helix_container #explore-features .interactive-container { overflow: hidden; width: 200%; } #helix_container #explore-features .interactive-container ul { padding: 0; } #helix_container #explore-features .interactive-container .interactive-back { display: inline-block; width: 50%; height: 300px; margin-left: -50%; float: left; transition-duration: .5s; } #helix_container #explore-features .interactive-container .interactive-back .interactive-back-container { width: 100%; height: 100%; } #helix_container #explore-features .interactive-container .interactive-front, #helix_container #explore-features .interactive-container .interactive-back { position: relative; display: inline-block; width: 50%; height: 100%; float: left; } #helix_container #explore-features .interactive-container .interactive-front .interactive-back-container, #helix_container #explore-features .interactive-container .interactive-back .interactive-back-container { position: relative; } #helix_container #explore-features .interactive-container .interactive-front .interactive-bg, #helix_container #explore-features .interactive-container .interactive-back .interactive-bg { position: absolute; top: 0; left: 0; width: 100%; background: none; } #helix_container #explore-features .interactive-container .interactive-front .interactive-elements, #helix_container #explore-features .interactive-container .interactive-back .interactive-elements { height: 640px; margin-bottom: 50px; position: relative; z-index: 20; } #helix_container #explore-features .interactive-container .interactive-front .interactive-elements li, #helix_container #explore-features .interactive-container .interactive-back .interactive-elements li { cursor: pointer; background-color: red; position: absolute; list-style: none; border-radius: 10px; height: 10px; width: 10px; padding: 6px; margin: 5px; opacity: 0; transition-duration: .4s; } #helix_container #explore-features .interactive-container .interactive-front .interactive-lineout, #helix_container #explore-features .interactive-container .interactive-back .interactive-lineout { position: absolute; height: 100%; } #helix_container #explore-features .interactive-container .interactive-front .interactive-lineout .line, #helix_container #explore-features .interactive-container .interactive-back .interactive-lineout .line { border: 1px solid white; border-right: none; height: 1px; width: 100px; transition-duration: .5s; position: absolute; bottom: -100px; left: 30px; display: inline-block; z-index: -10; } #helix_container #explore-features .interactive-container .interactive-front .interactive-detail, #helix_container #explore-features .interactive-container .interactive-back .interactive-detail { z-index: 20; padding: 0; border-left: 1px solid white; background-color: black; position: relative; margin-left: 50px; padding: 25px; min-height: 200px; } #helix_container #explore-features .interactive-container .interactive-front .interactive-detail .interactive-message, #helix_container #explore-features .interactive-container .interactive-back .interactive-detail .interactive-message { display: inline-block; width: 60%; min-height: 100px; opacity: 0; transition-duration: .4s; } #helix_container #explore-features .interactive-container .interactive-front .interactive-detail .interactive-message ul li, #helix_container #explore-features .interactive-container .interactive-back .interactive-detail .interactive-message ul li { list-style: none; display: none; } #helix_container #explore-features .interactive-container .interactive-front .interactive-detail .interactive-message ul li:first-of-type, #helix_container #explore-features .interactive-container .interactive-back .interactive-detail .interactive-message ul li:first-of-type { display: initial; } #helix_container #explore-features .interactive-container .interactive-front .interactive-detail .interactive-message ul li h4, #helix_container #explore-features .interactive-container .interactive-back .interactive-detail .interactive-message ul li h4 { display: inline-block; color: #F68E21; font-size: 1.5em; } #helix_container #explore-features .interactive-container .interactive-front .interactive-detail .interactive-message ul li#detail-17, #helix_container #explore-features .interactive-container .interactive-back .interactive-detail .interactive-message ul li#detail-17 { display: initial; } #helix_container #explore-features .interactive-container .interactive-front .interactive-detail .interactive-menu, #helix_container #explore-features .interactive-container .interactive-back .interactive-detail .interactive-menu { display: inline-block; vertical-align: top; width: 35%; color: #F68E21; padding-left: 20px !important; border-left: 1px solid white; } #helix_container #explore-features .interactive-container .interactive-front .interactive-detail .interactive-menu .jspVerticalBar .jspTrack, #helix_container #explore-features .interactive-container .interactive-back .interactive-detail .interactive-menu .jspVerticalBar .jspTrack { background: #222; } #helix_container #explore-features .interactive-container .interactive-front .interactive-detail .interactive-menu ul, #helix_container #explore-features .interactive-container .interactive-back .interactive-detail .interactive-menu ul { display: inline-block; position: relative; padding-left: 0; font-size: .8em; padding-right: 30px; vertical-align: top; } #helix_container #explore-features .interactive-container .interactive-front .interactive-detail .interactive-menu ul li, #helix_container #explore-features .interactive-container .interactive-back .interactive-detail .interactive-menu ul li { list-style: none; margin-left: 15px; cursor: pointer; } #helix_container #explore-features .interactive-container .interactive-front .interactive-detail .interactive-menu ul li.active::before, #helix_container #explore-features .interactive-container .interactive-back .interactive-detail .interactive-menu ul li.active::before { color: red; content: "\25CF"; position: absolute; left: 0px; } #helix-audio-player .audio-player-container { position: relative; color: red; margin: 0 50px; padding: 50px; } #helix-audio-player .audio-player-container .audio-controls { background-color: black; min-height: 100px; margin-bottom: 2px; } #helix-audio-player .audio-player-container .audio-controls .audio-player-playbutton { display: inline-block; } #helix-audio-player .audio-player-container .audio-controls .audio-player-playbutton img { margin: 25px; } #helix-audio-player .audio-player-container .audio-controls .transport { display: none; } #helix-audio-player .audio-player-container .audio-controls .transport img { margin: 25px; width: 760px; } #helix-audio-player .audio-player-container .audio-screen { background-color: black; min-height: 300px; } #helix-audio-player .audio-player-container .audio-screen img { width: 100%; } #helix-audio-player .audio-player-container .audio-player-prev { position: absolute; left: -50px; top: 200px; } #helix-audio-player .audio-player-container .audio-player-next { position: absolute; right: -50px; top: 200px; } .main-content { position: relative; overflow: hidden; letter-spacing: 1px; } .main-content .helix-model .media img { top: 0; left: 0; width: 100%; height: 100%; min-height: 50%; opacity: 0.5; animation: kenburns-top 30s ease-out 2s 1 normal both; } .main-content .helix-model .media img .animate { animation: kenburns-top 30s ease-out 10s 1 normal both; } .helix-lt #helix_container #helix_splash { background-image: url(/helix/images/helix-lt-header-graphic.jpg); } .helix-helix #helix_container #helix_splash { background-image: url(/helix/images/helix-floor-rack-header-graphic.jpg); } .helix-overview #helix_container #helix_splash .title { margin-top: 50px; } .helix-overview #helix_container .helix-model { position: relative; padding-bottom: 80px; padding-top: 0; margin: 0 50px; } .helix-overview #helix_container .helix-model .media { -webkit-box-shadow: 0px 0px 100px 0px rgba(255, 255, 255, 0.2); -moz-box-shadow: 0px 0px 100px 0px rgba(255, 255, 255, 0.2); box-shadow: 0px 0px 100px 0px rgba(255, 255, 255, 0.2); opacity: 0; } .helix-overview #helix_container .helix-model .media video, .helix-overview #helix_container .helix-model .media img { width: 100%; } .helix-overview #helix_container .helix-model .model-container { display: flex; align-items: stretch; } .helix-overview #helix_container .helix-model .model-container img { margin-top: -175px; } .helix-overview #helix_container .helix-model .detail { border-left: 2px solid #fefefe; width: 50%; } .helix-overview #helix_container .helix-model .detail .buy-container { border-bottom: 1px solid #fefefe; padding: 20px 40px; position: relative; font-size: .8em; color: #999; } .helix-overview #helix_container .helix-model .detail .buy-container .price { color: #43FF40; font-size: 1.5em; font-weight: 400; } .helix-overview #helix_container .helix-model .detail .buy-container .btn { position: absolute; right: 20px; bottom: 10px; color: #fff; font-weight: 200; } .helix-overview #helix_container .helix-model .detail .description { padding: 30px 40px; } .helix-overview #helix_container .helix-model .detail .description ul { padding: 0; } .helix-overview #helix_container .helix-model .detail .description li { padding-bottom: 15px; } .helix-overview #helix_container .helix-model .title { width: 50%; position: relative; padding: 0px; } .helix-overview #helix_container .helix-model .title h2 { padding: 0; } .helix-overview #helix_container .helix-model .title div { position: absolute; bottom: 0; width: 100%; } .helix-overview #helix_container .helix-model#helix-floor h1 { margin-top: 60px; } .helix-overview #helix_container .helix-model#helix-rack .title img { padding: 0 40px 0px; } .helix-overview #helix_container #helix-numbers ul { padding: 0; color: #0095D7; font-size: 5em; } .helix-overview #helix_container #helix-numbers ul li { list-style: none; padding-bottom: 80px; cursor: pointer; } .helix-overview #helix_container #helix-numbers ul li img { display: block; margin: auto; } .helix-overview #helix_container #helix-content .section-fg { padding-top: 0px; } .helix-overview #helix_container #helix-content .splash-copy p { padding: 10px 60px; } .helix-overview #helix_container #helix-content .splash-copy p:first-of-type { border-right: 1px solid #fefefe; } .helix-overview #helix_container .title { margin-top: 0; } .helix-overview #helix_container .title #logo { font-size: 25em; height: 1em; } #compare .model { padding: 0 40px; } #compare .model:first-of-type { border-right: 1px solid white; } #compare .model-title { position: relative; } #compare .model-title .btn { font-size: .3em; min-width: inherit; padding: 5px 40px; margin: 0 0 0 30px; } #helix-models-modal { background-color: #000; padding: 0; color: #FFF; font-size: 1.5em; font-weight: 100; display: flex; align-items: flex-start; border: 10px solid #111; } #helix-models-modal .arrow { margin-left: 14px; } #helix-models-modal #model-modal-modulation { color: #009aca; } #helix-models-modal #model-modal-delay { color: #43ff40; } #helix-models-modal #model-modal-reverb { color: orangered; } #helix-models-modal #model-modal-filter, #helix-models-modal #model-modal-wah, #helix-models-modal #model-modal-pitch_synth { color: purple; } #helix-models-modal #model-modal-distortion { color: #ff9934; } #helix-models-modal #model-modal-dynamics, #helix-models-modal #model-modal-eq { color: yellow; } #helix-models-modal #model-modal-volume_pan { color: lightseagreen; } #helix-models-modal #model-modal-amp, #helix-models-modal #model-modal-cab { color: #FF0000; } #helix-models-modal #model-modal-mic { color: white; } #helix-models-modal div.section-container { display: inline-block; padding: 0; } #helix-models-modal div.section-container .scroll-container { height: 320px; outline: none; } #helix-models-modal div.section-container ul { margin: 0px; padding: 0px; } #helix-models-modal div.section-container ul li { padding: 1px 10px; list-style: none; cursor: pointer; font-family: Helvetica, Arial, "Lucida Grande", sans-serif; } #helix-models-modal div.section-container ul li img { width: 40px; padding-right: 5px; } #helix-models-modal div.section-container ul li.active { font-weight: 400; } #helix-models-modal div.section-container ul li.active:after { content: url(/helix/images/overview/numbers/right-arrow.png); position: absolute; right: 10px; } #helix-models-modal div.section-container ul li.subcategory { display: none; } #helix-models-modal div.section-container ul li.model { display: none; margin-left: 40px; } #helix-models-modal div.section-container#section-1-container, #helix-models-modal div.section-container#section-2-container, #helix-models-modal div.section-container#section-3-container { height: 100%; } #helix-models-modal div.section-container#section-1-container .jspVerticalBar, #helix-models-modal div.section-container#section-2-container .jspVerticalBar, #helix-models-modal div.section-container#section-3-container .jspVerticalBar { display: none; } #helix-models-modal div.section-container#section-1-container { width: 40%; border-right: 1px solid #fff; } #helix-models-modal div.section-container#section-2-container { width: 25%; border-right: 1px solid #fff; } #helix-models-modal div.section-container#section-3-container { width: 35%; } .helix-resources #ytplayer-dialog #ytplayer { min-height: 400px; height: 100%; } .helix-resources h2 { margin-top: 75px; font-size: 2em; } .helix-resources h3 { font-size: 1.8em; margin: 50px 0; } .helix-resources th { border-top: 0px; font-weight: normal; color: #FF9934; } .helix-resources td { width: 15%; vertical-align: middle; } .helix-resources td:first-of-type { width: 30%; } .helix-resources td a { font-size: 1.6em; } .helix-resources td a span { vertical-align: middle; padding-bottom: 6px; } .helix-resources #videos { padding-left: 40px; padding-right: 40px; } .helix-resources #videos ul { list-style: none; padding: 0; } .helix-resources #videos ul li { padding: 60px 10px 0; cursor: pointer; font-size: 1em; } .helix-resources #videos ul li a { color: #666; } .helix-resources #videos ul li h4 { color: #DEDEDE; font-size: 1.4em; } .helix-resources #videos ul li p { color: #DEDEDE; } .helix-resources #videos ul li .tile-foreground { position: absolute; } .helix-native section { position: relative; overflow: hidden; padding-top: 30px; padding-bottom: 30px; } .helix-native section .section-fg { position: relative; z-index: 100; } .helix-native section .section-bg { top: 0px; left: 0; min-height: 100vh; position: absolute; z-index: 10; overflow: hidden; width: 100%; } .helix-native section#helixnative_splash { min-height: 950px; padding-top: 0; background-image: url(/helix/images/native/polybg.jpg); background-repeat: no-repeat; background-position: top center; background-size: cover; } .helix-native section#helixnative_splash .section-fg { padding-top: 200px; } .helix-native section#helix-detail1 { min-height: 800px; background-image: url(/helix/images/native/helix_image1.jpg); background-repeat: no-repeat; background-position: top center; background-size: cover; } .helix-native section#helix-detail1 .section-fg { background-color: rgba(0, 0, 0, 0.6); position: absolute; opacity: 0; bottom: -100px; left: 0; padding: 25px 25px 50px; display: inline-block; } .helix-native section#helix-detail1 .section-fg.visible-xs { top: 0px; bottom: 0px; padding: 100px 50px 0px; opacity: 1; } .helix-native section#helix-detail2 { min-height: 800px; background-image: url(/helix/images/native/helix_image2.jpg); background-repeat: no-repeat; background-position: top center; background-size: cover; } .helix-native section#helix-detail2 .section-fg { background-color: rgba(0, 0, 0, 0.6); position: absolute; opacity: 0; bottom: -100px; left: 0; padding: 25px 25px 50px; display: inline-block; } .helix-native section#helix-detail2 .section-fg.visible-xs { top: 0px; bottom: 0px; padding: 100px 50px 0px; opacity: 1; } .helix-native section#helix-intro p { padding: 10px 20px; } .helix-native .parallaxParent { min-height: 300px; max-height: 675px; height: 40vw; overflow: hidden; background-position-x: 40%; } .helix-native .parallaxParent > div { background-size: cover; } .helix-native .parallaxParent > * { height: 150%; position: relative; top: -100%; } .helix-native #helix_image2 > div { background-image: url("/helix/images/native/helix_image2.jpg"); } .icon-h:before { content: "\e600"; } .icon-e:before { content: "\e601"; } .icon-l:before { content: "\e602"; letter-spacing: -28px; } .icon-i:before { content: "\e603"; letter-spacing: -20px; } .icon-x:before { content: "\e604"; } .icon-t:before { content: "\e602"; } .icon-ltl:before { content: "\e616"; letter-spacing: -54px; } .icon-ltt:before { content: "\e617"; letter-spacing: -10px; } @keyframes btn-hover { 0% { background-color: initial; color: #DEDEDE; } 100% { background-color: #0396CC; color: #0095D7; } } @keyframes btn-out { 0% { background-color: #0396CC; color: #0095D7; } 100% { background-color: initial; color: #DEDEDE; } } @keyframes btn-alt-hover { 0% { background-color: initial; color: #DEDEDE; } 100% { background-color: #FF9934; color: #0095D7; } } @keyframes btn-alt-out { 0% { background-color: #FF9934; color: #0095D7; } 100% { background-color: initial; color: #DEDEDE; } } @font-face { font-family: 'helix'; src: url("/css/fonts/helix/helix.woff?-vjkb01") format("woff"), url("/css/fonts/helix/helix.ttf?-vjkb01") format("truetype"), url("/css/fonts/helix/helix.svg?-vjkb01#helix") format("svg"); font-weight: normal; font-style: normal; } /* mobile media 0px->767px */ @media (max-width: 767px) { /* xs */ #helix_container { font-size: .8em; } #helix_container .btn { min-width: 140px; } #helix_container #helix_splash .section-fg .title { margin-top: 80px; } #helix_container #helix_splash .section-fg .title #logo { font-size: 4em; margin-top: 80px; height: initial; } #helix_container #helix_splash .section-fg .title #logo a { margin-bottom: 0; } #helix_container #helix_splash .section-fg .title #logo .icon-I { margin-left: -12px; } #helix_container #helix_splash .section-fg .title #logo .icon-X { margin-left: -8px; } #helix_container #helix_splash .section-fg .title #logo .icon-ltl:before { letter-spacing: -43px; } #helix_container #compare .model { border-right: none; padding-bottom: 80px; } #helix_container #helix_nav { width: 100%; margin: 0; } #helix_container #helix_nav h1 { padding: 18px; } #helix_container #helix_nav ul { top: -500px; padding-top: 80px; float: none; background: rgba(20, 20, 20, 0.9); position: absolute; width: 100%; transition-duration: .7s; } #helix_container #helix_nav ul.active { top: 0; } #helix_container #helix_nav ul li { display: block; float: none; border-top: 1px solid #333; } #helix_container #helix_nav ul li a { padding: 15px; } #helix_container #helix_nav ul li .buy-cta { margin: 5px; color: #0396CC; background: transparent !important; padding: 0px 3px !important; text-transform: none !important; font-size: 15px; } #helix_container #helix_nav ul li .buy-cta:hover { background: transparent !important; } #helix_container #explore-features .interactive-container .interactive-detail { height: 150px; min-height: initial; } #helix_container #explore-features .interactive-container .interactive-detail .interactive-message { width: 70%; } #helix_container #explore-features .interactive-container .interactive-detail .interactive-menu { width: 20%; height: 150px; } #helix_container #explore-features .interactive-container .interactive-detail .interactive-menu ul { width: 100%; padding-right: 0; } #helix_container #explore-features .interactive-headline ul { max-width: 50%; } #helix_container #explore-features .interactive-headline ul li { max-width: 50%; } #helix_container #explore-features .interactive-headline ul li img { width: 100px; } .main-content #helix_container #helix_nav .nav > li > a.buy-cta { padding: 0px 3px !important; } .helix-overview #helix_container #helix_splash .section-fg .title #logo { font-size: 20em; } .helix-overview #helix_container .helix-model .media { display: none; } .helix-overview #helix_container .helix-model .model-container { display: inline-block; } .helix-overview #helix_container .helix-model .model-container img { margin-top: 0; } .helix-overview #helix_container .helix-model .model-container .title { width: 100%; } .helix-overview #helix_container .helix-model .model-container .title h2 { display: inline-block; margin: 5px 0; float: left; } .helix-overview #helix_container .helix-model .model-container .title img { padding-top: 0; flex: 0 0 100%; } .helix-overview #helix_container .helix-model .model-container .title .btn { position: relative; right: initial; margin-top: 10px; float: right; } .helix-overview #helix_container .helix-model .model-container .detail { width: 100%; border: none; } .helix-overview #helix_container .helix-model .model-container .detail .buy-container { display: flex; padding: 10px 0px; justify-content: space-between; align-items: center; } .helix-overview #helix_container .helix-model .model-container .detail .buy-container .btn { position: relative; right: initial; bottom: initial; padding: 5px 25px; } .helix-overview #helix_container .helix-model .model-container .detail .description { font-size: 1.1em; } .helix-overview #helix_container .helix-model .model-container .detail .description ul { padding-left: 0; } #helix-audio-player .audio-player-container { margin: 0 15px; } #helix-audio-player .audio-player-container .audio-screen { min-height: initial; } #helix-audio-player .audio-player-container .audio-controls { min-height: initial; } #helix-audio-player .audio-player-container .audio-controls .audio-player-playbutton img { margin: 12px; } #helix-audio-player .audio-player-container .audio-player-next, #helix-audio-player .audio-player-container .audio-player-prev { top: 35%; } #helix-audio-player .audio-player-container .audio-player-next img, #helix-audio-player .audio-player-container .audio-player-prev img { height: 40px; } #helix-audio-player .audio-player-container .audio-player-next { right: -30px; } #helix-audio-player .audio-player-container .audio-player-prev { left: -30px; } #helix-models-modal { border-width: 4px; font-size: .6em; } #helix-models-modal div.section-container .scroll-container { height: 250px; } #helix-models-modal div.section-container .arrow img { display: none; height: 0; } #helix-models-modal div.section-container ul li.model { margin-left: 10px; } #helix-models-modal div.section-container ul li.active:after { display: none; } #helix-models-modal div.section-container ul li img { width: 25px; } #helix-models-modal .subcategory { border: none; } } /* mobile media 0px->767px */ @media (min-width: 768px) { /* sm */ #helix_container #helix_nav { font-size: .7em; } } /*# sourceMappingURL=hx.css.map */