meta.foundation-version { font-family: "/5.3.0/" } meta.foundation-mq-small { font-family: "/only screen/"; width: 0 } meta.foundation-mq-medium { font-family: "/only screen and (min-width:40.063em)/"; width: 40.063em } meta.foundation-mq-large { font-family: "/only screen and (min-width:64.063em)/"; width: 64.063em } meta.foundation-mq-xlarge { font-family: "/only screen and (min-width:90.063em)/"; width: 90.063em } meta.foundation-mq-xxlarge { font-family: "/only screen and (min-width:120.063em)/"; width: 120.063em } meta.foundation-data-attribute-namespace { font-family: false } html, body { height: 100% } *, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } html, body { font-size: 100% } body { background: #fff; color: #222; padding: 0; margin: 0; font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; font-weight: normal; font-style: normal; line-height: 1; position: relative; cursor: default } a:hover { cursor: pointer } img { max-width: 100%; height: auto } img { -ms-interpolation-mode: bicubic } #map_canvas img, #map_canvas embed, #map_canvas object, .map_canvas img, .map_canvas embed, .map_canvas object { max-width: none !important } .left { float: left !important } .right { float: right !important } .clearfix:before, .clearfix:after { content: " "; display: table } .clearfix:after { clear: both } .hide { display: none } .antialiased { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale } img { display: inline-block; vertical-align: middle } textarea { height: auto; min-height: 50px } select { width: 100% } .row { width: 100%; margin-left: auto; margin-right: auto; margin-top: 0; margin-bottom: 0; max-width: 1180px } .row:before, .row:after { content: " "; display: table } .row:after { clear: both } .row.collapse>.column, .row.collapse>.columns { padding-left: 0; padding-right: 0 } .row.collapse .row { margin-left: 0; margin-right: 0 } .row .row { width: auto; margin-left: -10px; margin-right: -10px; margin-top: 0; margin-bottom: 0; max-width: none } .row .row:before, .row .row:after { content: " "; display: table } .row .row:after { clear: both } .row .row.collapse { width: auto; margin: 0; max-width: none } .row .row.collapse:before, .row .row.collapse:after { content: " "; display: table } .row .row.collapse:after { clear: both } .column, .columns { padding-left: 10px; padding-right: 10px; width: 100%; float: left } [class*="column"]+[class*="column"]:last-child { float: right } [class*="column"]+[class*="column"].end { float: left } @media only screen { .small-push-0 { position: relative; left: 0; right: auto } .small-pull-0 { position: relative; right: 0; left: auto } .small-push-1 { position: relative; left: 8.33333%; right: auto } .small-pull-1 { position: relative; right: 8.33333%; left: auto } .small-push-2 { position: relative; left: 16.66667%; right: auto } .small-pull-2 { position: relative; right: 16.66667%; left: auto } .small-push-3 { position: relative; left: 25%; right: auto } .small-pull-3 { position: relative; right: 25%; left: auto } .small-push-4 { position: relative; left: 33.33333%; right: auto } .small-pull-4 { position: relative; right: 33.33333%; left: auto } .small-push-5 { position: relative; left: 41.66667%; right: auto } .small-pull-5 { position: relative; right: 41.66667%; left: auto } .small-push-6 { position: relative; left: 50%; right: auto } .small-pull-6 { position: relative; right: 50%; left: auto } .small-push-7 { position: relative; left: 58.33333%; right: auto } .small-pull-7 { position: relative; right: 58.33333%; left: auto } .small-push-8 { position: relative; left: 66.66667%; right: auto } .small-pull-8 { position: relative; right: 66.66667%; left: auto } .small-push-9 { position: relative; left: 75%; right: auto } .small-pull-9 { position: relative; right: 75%; left: auto } .small-push-10 { position: relative; left: 83.33333%; right: auto } .small-pull-10 { position: relative; right: 83.33333%; left: auto } .small-push-11 { position: relative; left: 91.66667%; right: auto } .small-pull-11 { position: relative; right: 91.66667%; left: auto } .column, .columns { position: relative; padding-left: 10px; padding-right: 10px; float: left } .small-1 { width: 8.33333% } .small-2 { width: 16.66667% } .small-3 { width: 25% } .small-4 { width: 33.33333% } .small-5 { width: 41.66667% } .small-6 { width: 50% } .small-7 { width: 58.33333% } .small-8 { width: 66.66667% } .small-9 { width: 75% } .small-10 { width: 83.33333% } .small-11 { width: 91.66667% } .small-12 { width: 100% } .small-offset-0 { margin-left: 0 !important } .small-offset-1 { margin-left: 8.33333% !important } .small-offset-2 { margin-left: 16.66667% !important } .small-offset-3 { margin-left: 25% !important } .small-offset-4 { margin-left: 33.33333% !important } .small-offset-5 { margin-left: 41.66667% !important } .small-offset-6 { margin-left: 50% !important } .small-offset-7 { margin-left: 58.33333% !important } .small-offset-8 { margin-left: 66.66667% !important } .small-offset-9 { margin-left: 75% !important } .small-offset-10 { margin-left: 83.33333% !important } .small-offset-11 { margin-left: 91.66667% !important } .small-reset-order { margin-left: 0; margin-right: 0; left: auto; right: auto; float: left } .column.small-centered, .columns.small-centered { margin-left: auto; margin-right: auto; float: none } .column.small-uncentered, .columns.small-uncentered { margin-left: 0; margin-right: 0; float: left } .column.small-centered:last-child, .columns.small-centered:last-child { float: none } .column.small-uncentered:last-child, .columns.small-uncentered:last-child { float: left } .column.small-uncentered.opposite, .columns.small-uncentered.opposite { float: right } } @media only screen and (min-width:40.063em) { .medium-push-0 { position: relative; left: 0; right: auto } .medium-pull-0 { position: relative; right: 0; left: auto } .medium-push-1 { position: relative; left: 8.33333%; right: auto } .medium-pull-1 { position: relative; right: 8.33333%; left: auto } .medium-push-2 { position: relative; left: 16.66667%; right: auto } .medium-pull-2 { position: relative; right: 16.66667%; left: auto } .medium-push-3 { position: relative; left: 25%; right: auto } .medium-pull-3 { position: relative; right: 25%; left: auto } .medium-push-4 { position: relative; left: 33.33333%; right: auto } .medium-pull-4 { position: relative; right: 33.33333%; left: auto } .medium-push-5 { position: relative; left: 41.66667%; right: auto } .medium-pull-5 { position: relative; right: 41.66667%; left: auto } .medium-push-6 { position: relative; left: 50%; right: auto } .medium-pull-6 { position: relative; right: 50%; left: auto } .medium-push-7 { position: relative; left: 58.33333%; right: auto } .medium-pull-7 { position: relative; right: 58.33333%; left: auto } .medium-push-8 { position: relative; left: 66.66667%; right: auto } .medium-pull-8 { position: relative; right: 66.66667%; left: auto } .medium-push-9 { position: relative; left: 75%; right: auto } .medium-pull-9 { position: relative; right: 75%; left: auto } .medium-push-10 { position: relative; left: 83.33333%; right: auto } .medium-pull-10 { position: relative; right: 83.33333%; left: auto } .medium-push-11 { position: relative; left: 91.66667%; right: auto } .medium-pull-11 { position: relative; right: 91.66667%; left: auto } .column, .columns { position: relative; padding-left: 10px; padding-right: 10px; float: left } .medium-1 { width: 8.33333% } .medium-2 { width: 16.66667% } .medium-3 { width: 25% } .medium-4 { width: 33.33333% } .medium-5 { width: 41.66667% } .medium-6 { width: 50% } .medium-7 { width: 58.33333% } .medium-8 { width: 66.66667% } .medium-9 { width: 75% } .medium-10 { width: 83.33333% } .medium-11 { width: 91.66667% } .medium-12 { width: 100% } .medium-offset-0 { margin-left: 0 !important } .medium-offset-1 { margin-left: 8.33333% !important } .medium-offset-2 { margin-left: 16.66667% !important } .medium-offset-3 { margin-left: 25% !important } .medium-offset-4 { margin-left: 33.33333% !important } .medium-offset-5 { margin-left: 41.66667% !important } .medium-offset-6 { margin-left: 50% !important } .medium-offset-7 { margin-left: 58.33333% !important } .medium-offset-8 { margin-left: 66.66667% !important } .medium-offset-9 { margin-left: 75% !important } .medium-offset-10 { margin-left: 83.33333% !important } .medium-offset-11 { margin-left: 91.66667% !important } .medium-reset-order { margin-left: 0; margin-right: 0; left: auto; right: auto; float: left } .column.medium-centered, .columns.medium-centered { margin-left: auto; margin-right: auto; float: none } .column.medium-uncentered, .columns.medium-uncentered { margin-left: 0; margin-right: 0; float: left } .column.medium-centered:last-child, .columns.medium-centered:last-child { float: none } .column.medium-uncentered:last-child, .columns.medium-uncentered:last-child { float: left } .column.medium-uncentered.opposite, .columns.medium-uncentered.opposite { float: right } .push-0 { position: relative; left: 0; right: auto } .pull-0 { position: relative; right: 0; left: auto } .push-1 { position: relative; left: 8.33333%; right: auto } .pull-1 { position: relative; right: 8.33333%; left: auto } .push-2 { position: relative; left: 16.66667%; right: auto } .pull-2 { position: relative; right: 16.66667%; left: auto } .push-3 { position: relative; left: 25%; right: auto } .pull-3 { position: relative; right: 25%; left: auto } .push-4 { position: relative; left: 33.33333%; right: auto } .pull-4 { position: relative; right: 33.33333%; left: auto } .push-5 { position: relative; left: 41.66667%; right: auto } .pull-5 { position: relative; right: 41.66667%; left: auto } .push-6 { position: relative; left: 50%; right: auto } .pull-6 { position: relative; right: 50%; left: auto } .push-7 { position: relative; left: 58.33333%; right: auto } .pull-7 { position: relative; right: 58.33333%; left: auto } .push-8 { position: relative; left: 66.66667%; right: auto } .pull-8 { position: relative; right: 66.66667%; left: auto } .push-9 { position: relative; left: 75%; right: auto } .pull-9 { position: relative; right: 75%; left: auto } .push-10 { position: relative; left: 83.33333%; right: auto } .pull-10 { position: relative; right: 83.33333%; left: auto } .push-11 { position: relative; left: 91.66667%; right: auto } .pull-11 { position: relative; right: 91.66667%; left: auto } } @media only screen and (min-width:64.063em) { .large-push-0 { position: relative; left: 0; right: auto } .large-pull-0 { position: relative; right: 0; left: auto } .large-push-1 { position: relative; left: 8.33333%; right: auto } .large-pull-1 { position: relative; right: 8.33333%; left: auto } .large-push-2 { position: relative; left: 16.66667%; right: auto } .large-pull-2 { position: relative; right: 16.66667%; left: auto } .large-push-3 { position: relative; left: 25%; right: auto } .large-pull-3 { position: relative; right: 25%; left: auto } .large-push-4 { position: relative; left: 33.33333%; right: auto } .large-pull-4 { position: relative; right: 33.33333%; left: auto } .large-push-5 { position: relative; left: 41.66667%; right: auto } .large-pull-5 { position: relative; right: 41.66667%; left: auto } .large-push-6 { position: relative; left: 50%; right: auto } .large-pull-6 { position: relative; right: 50%; left: auto } .large-push-7 { position: relative; left: 58.33333%; right: auto } .large-pull-7 { position: relative; right: 58.33333%; left: auto } .large-push-8 { position: relative; left: 66.66667%; right: auto } .large-pull-8 { position: relative; right: 66.66667%; left: auto } .large-push-9 { position: relative; left: 75%; right: auto } .large-pull-9 { position: relative; right: 75%; left: auto } .large-push-10 { position: relative; left: 83.33333%; right: auto } .large-pull-10 { position: relative; right: 83.33333%; left: auto } .large-push-11 { position: relative; left: 91.66667%; right: auto } .large-pull-11 { position: relative; right: 91.66667%; left: auto } .column, .columns { position: relative; padding-left: 10px; padding-right: 10px; float: left } .large-1 { width: 8.33333% } .large-2 { width: 16.66667% } .large-3 { width: 25% } .large-4 { width: 33.33333% } .large-5 { width: 41.66667% } .large-6 { width: 50% } .large-7 { width: 58.33333% } .large-8 { width: 66.66667% } .large-9 { width: 75% } .large-10 { width: 83.33333% } .large-11 { width: 91.66667% } .large-12 { width: 100% } .large-offset-0 { margin-left: 0 !important } .large-offset-1 { margin-left: 8.33333% !important } .large-offset-2 { margin-left: 16.66667% !important } .large-offset-3 { margin-left: 25% !important } .large-offset-4 { margin-left: 33.33333% !important } .large-offset-5 { margin-left: 41.66667% !important } .large-offset-6 { margin-left: 50% !important } .large-offset-7 { margin-left: 58.33333% !important } .large-offset-8 { margin-left: 66.66667% !important } .large-offset-9 { margin-left: 75% !important } .large-offset-10 { margin-left: 83.33333% !important } .large-offset-11 { margin-left: 91.66667% !important } .large-reset-order { margin-left: 0; margin-right: 0; left: auto; right: auto; float: left } .column.large-centered, .columns.large-centered { margin-left: auto; margin-right: auto; float: none } .column.large-uncentered, .columns.large-uncentered { margin-left: 0; margin-right: 0; float: left } .column.large-centered:last-child, .columns.large-centered:last-child { float: none } .column.large-uncentered:last-child, .columns.large-uncentered:last-child { float: left } .column.large-uncentered.opposite, .columns.large-uncentered.opposite { float: right } .push-0 { position: relative; left: 0; right: auto } .pull-0 { position: relative; right: 0; left: auto } .push-1 { position: relative; left: 8.33333%; right: auto } .pull-1 { position: relative; right: 8.33333%; left: auto } .push-2 { position: relative; left: 16.66667%; right: auto } .pull-2 { position: relative; right: 16.66667%; left: auto } .push-3 { position: relative; left: 25%; right: auto } .pull-3 { position: relative; right: 25%; left: auto } .push-4 { position: relative; left: 33.33333%; right: auto } .pull-4 { position: relative; right: 33.33333%; left: auto } .push-5 { position: relative; left: 41.66667%; right: auto } .pull-5 { position: relative; right: 41.66667%; left: auto } .push-6 { position: relative; left: 50%; right: auto } .pull-6 { position: relative; right: 50%; left: auto } .push-7 { position: relative; left: 58.33333%; right: auto } .pull-7 { position: relative; right: 58.33333%; left: auto } .push-8 { position: relative; left: 66.66667%; right: auto } .pull-8 { position: relative; right: 66.66667%; left: auto } .push-9 { position: relative; left: 75%; right: auto } .pull-9 { position: relative; right: 75%; left: auto } .push-10 { position: relative; left: 83.33333%; right: auto } .pull-10 { position: relative; right: 83.33333%; left: auto } .push-11 { position: relative; left: 91.66667%; right: auto } .pull-11 { position: relative; right: 91.66667%; left: auto } } button, .button { border-style: solid; border-width: 0; cursor: pointer; font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; font-weight: normal; line-height: normal; margin: 0 0 1.25rem; position: relative; text-decoration: none; text-align: center; -webkit-appearance: none; -webkit-border-radius: 0; display: inline-block; padding-top: 1rem; padding-right: 2rem; padding-bottom: 1.0625rem; padding-left: 2rem; font-size: 1rem; background-color: #2ba6cb; border-color: #2285a2; color: #fff; transition: background-color 300ms ease-out } button:hover, button:focus, .button:hover, .button:focus { background-color: #2285a2 } button:hover, button:focus, .button:hover, .button:focus { color: #fff } button.secondary, .button.secondary { background-color: #e9e9e9; border-color: #bababa; color: #333 } button.secondary:hover, button.secondary:focus, .button.secondary:hover, .button.secondary:focus { background-color: #bababa } button.secondary:hover, button.secondary:focus, .button.secondary:hover, .button.secondary:focus { color: #333 } button.success, .button.success { background-color: #5da423; border-color: #4a831c; color: #fff } button.success:hover, button.success:focus, .button.success:hover, .button.success:focus { background-color: #4a831c } button.success:hover, button.success:focus, .button.success:hover, .button.success:focus { color: #fff } button.alert, .button.alert { background-color: #c60f13; border-color: #9e0c0f; color: #fff } button.alert:hover, button.alert:focus, .button.alert:hover, .button.alert:focus { background-color: #9e0c0f } button.alert:hover, button.alert:focus, .button.alert:hover, .button.alert:focus { color: #fff } button.large, .button.large { padding-top: 1.125rem; padding-right: 2.25rem; padding-bottom: 1.1875rem; padding-left: 2.25rem; font-size: 1.25rem } button.small, .button.small { padding-top: .875rem; padding-right: 1.75rem; padding-bottom: .9375rem; padding-left: 1.75rem; font-size: .8125rem } button.tiny, .button.tiny { padding-top: .625rem; padding-right: 1.25rem; padding-bottom: .6875rem; padding-left: 1.25rem; font-size: .6875rem } button.expand, .button.expand { padding-right: 0; padding-left: 0; width: 100% } button.left-align, .button.left-align { text-align: left; text-indent: .75rem } button.right-align, .button.right-align { text-align: right; padding-right: .75rem } button.radius, .button.radius { border-radius: 3px } button.round, .button.round { border-radius: 1000px } button.disabled, button[disabled], .button.disabled, .button[disabled] { background-color: #2ba6cb; border-color: #2285a2; color: #fff; cursor: default; opacity: .7; box-shadow: none } button.disabled:hover, button.disabled:focus, button[disabled]:hover, button[disabled]:focus, .button.disabled:hover, .button.disabled:focus, .button[disabled]:hover, .button[disabled]:focus { background-color: #2285a2 } button.disabled:hover, button.disabled:focus, button[disabled]:hover, button[disabled]:focus, .button.disabled:hover, .button.disabled:focus, .button[disabled]:hover, .button[disabled]:focus { color: #fff } button.disabled:hover, button.disabled:focus, button[disabled]:hover, button[disabled]:focus, .button.disabled:hover, .button.disabled:focus, .button[disabled]:hover, .button[disabled]:focus { background-color: #2ba6cb } button.disabled.secondary, button[disabled].secondary, .button.disabled.secondary, .button[disabled].secondary { background-color: #e9e9e9; border-color: #bababa; color: #333; cursor: default; opacity: .7; box-shadow: none } button.disabled.secondary:hover, button.disabled.secondary:focus, button[disabled].secondary:hover, button[disabled].secondary:focus, .button.disabled.secondary:hover, .button.disabled.secondary:focus, .button[disabled].secondary:hover, .button[disabled].secondary:focus { background-color: #bababa } button.disabled.secondary:hover, button.disabled.secondary:focus, button[disabled].secondary:hover, button[disabled].secondary:focus, .button.disabled.secondary:hover, .button.disabled.secondary:focus, .button[disabled].secondary:hover, .button[disabled].secondary:focus { color: #333 } button.disabled.secondary:hover, button.disabled.secondary:focus, button[disabled].secondary:hover, button[disabled].secondary:focus, .button.disabled.secondary:hover, .button.disabled.secondary:focus, .button[disabled].secondary:hover, .button[disabled].secondary:focus { background-color: #e9e9e9 } button.disabled.success, button[disabled].success, .button.disabled.success, .button[disabled].success { background-color: #5da423; border-color: #4a831c; color: #fff; cursor: default; opacity: .7; box-shadow: none } button.disabled.success:hover, button.disabled.success:focus, button[disabled].success:hover, button[disabled].success:focus, .button.disabled.success:hover, .button.disabled.success:focus, .button[disabled].success:hover, .button[disabled].success:focus { background-color: #4a831c } button.disabled.success:hover, button.disabled.success:focus, button[disabled].success:hover, button[disabled].success:focus, .button.disabled.success:hover, .button.disabled.success:focus, .button[disabled].success:hover, .button[disabled].success:focus { color: #fff } button.disabled.success:hover, button.disabled.success:focus, button[disabled].success:hover, button[disabled].success:focus, .button.disabled.success:hover, .button.disabled.success:focus, .button[disabled].success:hover, .button[disabled].success:focus { background-color: #5da423 } button.disabled.alert, button[disabled].alert, .button.disabled.alert, .button[disabled].alert { background-color: #c60f13; border-color: #9e0c0f; color: #fff; cursor: default; opacity: .7; box-shadow: none } button.disabled.alert:hover, button.disabled.alert:focus, button[disabled].alert:hover, button[disabled].alert:focus, .button.disabled.alert:hover, .button.disabled.alert:focus, .button[disabled].alert:hover, .button[disabled].alert:focus { background-color: #9e0c0f } button.disabled.alert:hover, button.disabled.alert:focus, button[disabled].alert:hover, button[disabled].alert:focus, .button.disabled.alert:hover, .button.disabled.alert:focus, .button[disabled].alert:hover, .button[disabled].alert:focus { color: #fff } button.disabled.alert:hover, button.disabled.alert:focus, button[disabled].alert:hover, button[disabled].alert:focus, .button.disabled.alert:hover, .button.disabled.alert:focus, .button[disabled].alert:hover, .button[disabled].alert:focus { background-color: #c60f13 } @media only screen and (min-width:40.063em) { button, .button { display: inline-block } } meta.foundation-mq-topbar { font-family: "/only screen and (min-width:40.063em)/"; width: 58.75em } .contain-to-grid { width: 100%; background: #333 } .contain-to-grid .top-bar { margin-bottom: 0 } .fixed { width: 100%; left: 0; position: fixed; top: 0; z-index: 99 } .fixed.expanded:not(.top-bar) { overflow-y: auto; height: auto; width: 100%; max-height: 100% } .fixed.expanded:not(.top-bar) .title-area { position: fixed; width: 100%; z-index: 99 } .fixed.expanded:not(.top-bar) .top-bar-section { z-index: 98; margin-top: 45px } .top-bar { overflow: hidden; height: 45px; line-height: 45px; position: relative; background: #333; margin-bottom: 0 } .top-bar ul { margin-bottom: 0; list-style: none } .top-bar .row { max-width: none } .top-bar form, .top-bar input { margin-bottom: 0 } .top-bar input { height: auto; padding-top: .35rem; padding-bottom: .35rem; font-size: .75rem } .top-bar .button, .top-bar button { padding-top: .45rem; padding-bottom: .35rem; margin-bottom: 0; font-size: .75rem } .top-bar .title-area { position: relative; margin: 0 } .top-bar .name { height: 45px; margin: 0; font-size: 16px } .top-bar .name h1 { line-height: 45px; font-size: 1.0625rem; margin: 0 } .top-bar .name h1 a { font-weight: normal; color: #fff; width: 75%; display: block; padding: 0 15px } .top-bar .toggle-topbar { position: absolute; right: 0; top: 0 } .top-bar .toggle-topbar a { color: #fff; text-transform: uppercase; font-size: .8125rem; font-weight: bold; position: relative; display: block; padding: 0 15px; height: 45px; line-height: 45px } .top-bar .toggle-topbar.menu-icon { top: 50%; margin-top: -16px } .top-bar .toggle-topbar.menu-icon a { height: 34px; line-height: 33px; padding: 0 40px 0 15px; color: #fff; position: relative } .top-bar .toggle-topbar.menu-icon a span::after { content: ""; position: absolute; display: block; height: 0; top: 50%; margin-top: -8px; right: 15px; box-shadow: 0 0 0 1px #fff, 0 7px 0 1px #fff, 0 14px 0 1px #fff; width: 16px } .top-bar .toggle-topbar.menu-icon a span:hover:after { box-shadow: 0 0 0 1px #fff, 0 7px 0 1px #fff, 0 14px 0 1px #fff } .top-bar.expanded { height: auto; background: transparent } .top-bar.expanded .title-area { background: #333 } .top-bar.expanded .toggle-topbar a { color: #888 } .top-bar.expanded .toggle-topbar a::after { box-shadow: 0 10px 0 1px #888, 0 16px 0 1px #888, 0 22px 0 1px #888 } .top-bar-section { left: 0; position: relative; width: auto; transition: left 300ms ease-out } .top-bar-section ul { padding: 0; width: 100%; height: auto; display: block; font-size: 16px; margin: 0 } .top-bar-section .divider, .top-bar-section [role="separator"] { border-top: solid 1px #1a1a1a; clear: both; height: 1px; width: 100% } .top-bar-section ul li { background: #333 } .top-bar-section ul li>a { display: block; width: 100%; color: #fff; padding: 12px 0 12px 0; padding-left: 15px; font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; font-size: .8125rem; font-weight: normal; text-transform: none } .top-bar-section ul li>a.button { font-size: .8125rem; padding-right: 15px; padding-left: 15px; background-color: #2ba6cb; border-color: #2285a2; color: #fff } .top-bar-section ul li>a.button:hover, .top-bar-section ul li>a.button:focus { background-color: #2285a2 } .top-bar-section ul li>a.button:hover, .top-bar-section ul li>a.button:focus { color: #fff } .top-bar-section ul li>a.button.secondary { background-color: #e9e9e9; border-color: #bababa; color: #333 } .top-bar-section ul li>a.button.secondary:hover, .top-bar-section ul li>a.button.secondary:focus { background-color: #bababa } .top-bar-section ul li>a.button.secondary:hover, .top-bar-section ul li>a.button.secondary:focus { color: #333 } .top-bar-section ul li>a.button.success { background-color: #5da423; border-color: #4a831c; color: #fff } .top-bar-section ul li>a.button.success:hover, .top-bar-section ul li>a.button.success:focus { background-color: #4a831c } .top-bar-section ul li>a.button.success:hover, .top-bar-section ul li>a.button.success:focus { color: #fff } .top-bar-section ul li>a.button.alert { background-color: #c60f13; border-color: #9e0c0f; color: #fff } .top-bar-section ul li>a.button.alert:hover, .top-bar-section ul li>a.button.alert:focus { background-color: #9e0c0f } .top-bar-section ul li>a.button.alert:hover, .top-bar-section ul li>a.button.alert:focus { color: #fff } .top-bar-section ul li>button { font-size: .8125rem; padding-right: 15px; padding-left: 15px; background-color: #2ba6cb; border-color: #2285a2; color: #fff } .top-bar-section ul li>button:hover, .top-bar-section ul li>button:focus { background-color: #2285a2 } .top-bar-section ul li>button:hover, .top-bar-section ul li>button:focus { color: #fff } .top-bar-section ul li>button.secondary { background-color: #e9e9e9; border-color: #bababa; color: #333 } .top-bar-section ul li>button.secondary:hover, .top-bar-section ul li>button.secondary:focus { background-color: #bababa } .top-bar-section ul li>button.secondary:hover, .top-bar-section ul li>button.secondary:focus { color: #333 } .top-bar-section ul li>button.success { background-color: #5da423; border-color: #4a831c; color: #fff } .top-bar-section ul li>button.success:hover, .top-bar-section ul li>button.success:focus { background-color: #4a831c } .top-bar-section ul li>button.success:hover, .top-bar-section ul li>button.success:focus { color: #fff } .top-bar-section ul li>button.alert { background-color: #c60f13; border-color: #9e0c0f; color: #fff } .top-bar-section ul li>button.alert:hover, .top-bar-section ul li>button.alert:focus { background-color: #9e0c0f } .top-bar-section ul li>button.alert:hover, .top-bar-section ul li>button.alert:focus { color: #fff } .top-bar-section ul li:hover:not(.has-form)>a { background-color: #555; background: #272727; color: #fff } .top-bar-section ul li.active>a { background: #2ba6cb; color: #fff } .top-bar-section ul li.active>a:hover { background: #258faf; color: #fff } .top-bar-section .has-form { padding: 15px } .top-bar-section .has-dropdown { position: relative } .top-bar-section .has-dropdown>a:after { content: ""; display: block; width: 0; height: 0; border: inset 5px; border-color: transparent transparent transparent rgba(255, 255, 255, 0.4); border-left-style: solid; margin-right: 15px; margin-top: -4.5px; position: absolute; top: 50%; right: 0 } .top-bar-section .has-dropdown.moved { position: static } .top-bar-section .has-dropdown.moved>.dropdown { display: block; position: static !important; height: auto; width: auto; overflow: visible; clip: auto; position: absolute !important; width: 100% } .top-bar-section .has-dropdown.moved>a:after { display: none } .top-bar-section .dropdown { padding: 0; position: absolute; left: 100%; top: 0; z-index: 99; display: block; position: absolute !important; height: 1px; width: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px) } .top-bar-section .dropdown li { width: 100%; height: auto } .top-bar-section .dropdown li a { font-weight: normal; padding: 8px 15px } .top-bar-section .dropdown li a.parent-link { font-weight: normal } .top-bar-section .dropdown li.title h5 { margin-bottom: 0; margin-top: 0 } .top-bar-section .dropdown li.title h5 a { color: #fff; line-height: 22.5px; display: block } .top-bar-section .dropdown li.has-form { padding: 8px 15px } .top-bar-section .dropdown li .button, .top-bar-section .dropdown li button { top: auto } .top-bar-section .dropdown label { padding: 8px 15px 2px; margin-bottom: 0; text-transform: uppercase; color: #777; font-weight: bold; font-size: .625rem } .js-generated { display: block } @media only screen and (min-width:40.063em) { .top-bar { background: #333; overflow: visible } .top-bar:before, .top-bar:after { content: " "; display: table } .top-bar:after { clear: both } .top-bar .toggle-topbar { display: none } .top-bar .title-area { float: left } .top-bar .name h1 a { width: auto } .top-bar input, .top-bar .button, .top-bar button { font-size: .875rem; position: relative; top: 7px } .top-bar.expanded { background: #333 } .contain-to-grid .top-bar { max-width: 1180px; margin: 0 auto; margin-bottom: 0 } .top-bar-section { transition: none 0 0; left: 0 !important } .top-bar-section ul { width: auto; height: auto !important; display: inline } .top-bar-section ul li { float: left } .top-bar-section ul li .js-generated { display: none } .top-bar-section li.hover>a:not(.button) { background-color: #555; background: #272727; color: #fff } .top-bar-section li:not(.has-form) a:not(.button) { padding: 0 15px; line-height: 45px; background: #333 } .top-bar-section li:not(.has-form) a:not(.button):hover { background-color: #555; background: #272727 } .top-bar-section li.active:not(.has-form) a:not(.button) { padding: 0 15px; line-height: 45px; color: #fff; background: #2ba6cb } .top-bar-section li.active:not(.has-form) a:not(.button):hover { background: #258faf } .top-bar-section .has-dropdown>a { padding-right: 35px !important } .top-bar-section .has-dropdown>a:after { content: ""; display: block; width: 0; height: 0; border: inset 5px; border-color: rgba(255, 255, 255, 0.4) transparent transparent transparent; border-top-style: solid; margin-top: -2.5px; top: 22.5px } .top-bar-section .has-dropdown.moved { position: relative } .top-bar-section .has-dropdown.moved>.dropdown { display: block; position: absolute !important; height: 1px; width: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px) } .top-bar-section .has-dropdown.hover>.dropdown, .top-bar-section .has-dropdown.not-click:hover>.dropdown { display: block; position: static !important; height: auto; width: auto; overflow: visible; clip: auto; position: absolute !important } .top-bar-section .has-dropdown .dropdown li.has-dropdown>a:after { border: 0; content: "\00bb"; top: 1rem; margin-top: -1px; right: 5px; line-height: 1.2 } .top-bar-section .dropdown { left: 0; top: auto; background: transparent; min-width: 100% } .top-bar-section .dropdown li a { color: #fff; line-height: 45px; white-space: nowrap; padding: 12px 15px; background: #333 } .top-bar-section .dropdown li:not(.has-form) a:not(.button) { color: #fff; background: #333 } .top-bar-section .dropdown li:not(.has-form):hover>a:not(.button) { color: #fff; background-color: #555; background: #272727 } .top-bar-section .dropdown li label { white-space: nowrap; background: #333 } .top-bar-section .dropdown li .dropdown { left: 100%; top: 0 } .top-bar-section>ul>.divider, .top-bar-section>ul>[role="separator"] { border-bottom: 0; border-top: 0; border-right: solid 1px #4e4e4e; clear: none; height: 45px; width: 0 } .top-bar-section .has-form { background: #333; padding: 0 15px; height: 45px } .top-bar-section .right li .dropdown { left: auto; right: 0 } .top-bar-section .right li .dropdown li .dropdown { right: 100% } .top-bar-section .left li .dropdown { right: auto; left: 0 } .top-bar-section .left li .dropdown li .dropdown { left: 100% } .no-js .top-bar-section ul li:hover>a { background-color: #555; background: #272727; color: #fff } .no-js .top-bar-section ul li:active>a { background: #2ba6cb; color: #fff } .no-js .top-bar-section .has-dropdown:hover>.dropdown { display: block; position: static !important; height: auto; width: auto; overflow: visible; clip: auto; position: absolute !important } } .breadcrumbs { display: block; padding: .5625rem .875rem .5625rem; overflow: hidden; margin-left: 0; list-style: none; border-style: solid; border-width: 1px; background-color: #f5f5f5; border-color: #ddd; border-radius: 3px } .breadcrumbs>* { margin: 0; float: left; font-size: .6875rem; line-height: .6875rem; text-transform: uppercase; color: #2ba6cb } .breadcrumbs>*:hover a, .breadcrumbs>*:focus a { text-decoration: underline } .breadcrumbs>* a { color: #2ba6cb } .breadcrumbs>*.current { cursor: default; color: #333 } .breadcrumbs>*.current a { cursor: default; color: #333 } .breadcrumbs>*.current:hover, .breadcrumbs>*.current:hover a, .breadcrumbs>*.current:focus, .breadcrumbs>*.current:focus a { text-decoration: none } .breadcrumbs>*.unavailable { color: #999 } .breadcrumbs>*.unavailable a { color: #999 } .breadcrumbs>*.unavailable:hover, .breadcrumbs>*.unavailable:hover a, .breadcrumbs>*.unavailable:focus, .breadcrumbs>*.unavailable a:focus { text-decoration: none; color: #999; cursor: default } .breadcrumbs>*:before { content: "/"; color: #aaa; margin: 0 .75rem; position: relative; top: 1px } .breadcrumbs>*:first-child:before { content: " "; margin: 0 } .alert-box { border-style: solid; border-width: 1px; display: block; font-weight: normal; margin-bottom: 1.25rem; position: relative; padding: .875rem 1.5rem .875rem .875rem; font-size: .8125rem; transition: opacity 300ms ease-out; background-color: #2ba6cb; border-color: #258faf; color: #fff } .alert-box .close { font-size: 1.375rem; padding: 9px 6px 4px; line-height: 0; position: absolute; top: 50%; margin-top: -0.6875rem; right: .25rem; color: #333; opacity: .3 } .alert-box .close:hover, .alert-box .close:focus { opacity: .5 } .alert-box.radius { border-radius: 3px } .alert-box.round { border-radius: 1000px } .alert-box.success { background-color: #5da423; border-color: #508d1e; color: #fff } .alert-box.alert { background-color: #c60f13; border-color: #aa0d10; color: #fff } .alert-box.secondary { background-color: #e9e9e9; border-color: #c8c8c8; color: #4f4f4f } .alert-box.warning { background-color: #f08a24; border-color: #de770f; color: #fff } .alert-box.info { background-color: #a0d3e8; border-color: #74bfdd; color: #4f4f4f } .alert-box.alert-close { opacity: 0 } .inline-list { margin: 0 auto 1.0625rem auto; margin-left: -1.375rem; margin-right: 0; padding: 0; list-style: none; overflow: hidden } .inline-list>li { list-style: none; float: left; margin-left: 1.375rem; display: block } .inline-list>li>* { display: block } .button-group { list-style: none; margin: 0; left: 0 } .button-group:before, .button-group:after { content: " "; display: table } .button-group:after { clear: both } .button-group>li { margin: 0; float: left } .button-group>li>button, .button-group>li .button { border-left: 1px solid; border-color: rgba(255, 255, 255, 0.5) } .button-group>li:first-child button, .button-group>li:first-child .button { border-left: 0 } .button-group>li:first-child { margin-left: 0 } .button-group.radius>*>button, .button-group.radius>* .button { border-left: 1px solid; border-color: rgba(255, 255, 255, 0.5) } .button-group.radius>*:first-child button, .button-group.radius>*:first-child .button { border-left: 0 } .button-group.radius>*, .button-group.radius>*>a, .button-group.radius>*>button, .button-group.radius>*>.button { border-radius: 0 } .button-group.radius>*:first-child, .button-group.radius>*:first-child>a, .button-group.radius>*:first-child>button, .button-group.radius>*:first-child>.button { border-bottom-left-radius: 3px; border-top-left-radius: 3px } .button-group.radius>*:last-child, .button-group.radius>*:last-child>a, .button-group.radius>*:last-child>button, .button-group.radius>*:last-child>.button { border-bottom-right-radius: 3px; border-top-right-radius: 3px } .button-group.round>*>button, .button-group.round>* .button { border-left: 1px solid; border-color: rgba(255, 255, 255, 0.5) } .button-group.round>*:first-child button, .button-group.round>*:first-child .button { border-left: 0 } .button-group.round>*, .button-group.round>*>a, .button-group.round>*>button, .button-group.round>*>.button { border-radius: 0 } .button-group.round>*:first-child, .button-group.round>*:first-child>a, .button-group.round>*:first-child>button, .button-group.round>*:first-child>.button { border-bottom-left-radius: 1000px; border-top-left-radius: 1000px } .button-group.round>*:last-child, .button-group.round>*:last-child>a, .button-group.round>*:last-child>button, .button-group.round>*:last-child>.button { border-bottom-right-radius: 1000px; border-top-right-radius: 1000px } .button-group.even-2 li { width: 50% } .button-group.even-2 li>button, .button-group.even-2 li .button { border-left: 1px solid; border-color: rgba(255, 255, 255, 0.5) } .button-group.even-2 li:first-child button, .button-group.even-2 li:first-child .button { border-left: 0 } .button-group.even-2 li button, .button-group.even-2 li .button { width: 100% } .button-group.even-3 li { width: 33.33333% } .button-group.even-3 li>button, .button-group.even-3 li .button { border-left: 1px solid; border-color: rgba(255, 255, 255, 0.5) } .button-group.even-3 li:first-child button, .button-group.even-3 li:first-child .button { border-left: 0 } .button-group.even-3 li button, .button-group.even-3 li .button { width: 100% } .button-group.even-4 li { width: 25% } .button-group.even-4 li>button, .button-group.even-4 li .button { border-left: 1px solid; border-color: rgba(255, 255, 255, 0.5) } .button-group.even-4 li:first-child button, .button-group.even-4 li:first-child .button { border-left: 0 } .button-group.even-4 li button, .button-group.even-4 li .button { width: 100% } .button-group.even-5 li { width: 20% } .button-group.even-5 li>button, .button-group.even-5 li .button { border-left: 1px solid; border-color: rgba(255, 255, 255, 0.5) } .button-group.even-5 li:first-child button, .button-group.even-5 li:first-child .button { border-left: 0 } .button-group.even-5 li button, .button-group.even-5 li .button { width: 100% } .button-group.even-6 li { width: 16.66667% } .button-group.even-6 li>button, .button-group.even-6 li .button { border-left: 1px solid; border-color: rgba(255, 255, 255, 0.5) } .button-group.even-6 li:first-child button, .button-group.even-6 li:first-child .button { border-left: 0 } .button-group.even-6 li button, .button-group.even-6 li .button { width: 100% } .button-group.even-7 li { width: 14.28571% } .button-group.even-7 li>button, .button-group.even-7 li .button { border-left: 1px solid; border-color: rgba(255, 255, 255, 0.5) } .button-group.even-7 li:first-child button, .button-group.even-7 li:first-child .button { border-left: 0 } .button-group.even-7 li button, .button-group.even-7 li .button { width: 100% } .button-group.even-8 li { width: 12.5% } .button-group.even-8 li>button, .button-group.even-8 li .button { border-left: 1px solid; border-color: rgba(255, 255, 255, 0.5) } .button-group.even-8 li:first-child button, .button-group.even-8 li:first-child .button { border-left: 0 } .button-group.even-8 li button, .button-group.even-8 li .button { width: 100% } .button-bar:before, .button-bar:after { content: " "; display: table } .button-bar:after { clear: both } .button-bar .button-group { float: left; margin-right: .625rem } .button-bar .button-group div { overflow: hidden } .panel { border-style: solid; border-width: 1px; border-color: #d8d8d8; margin-bottom: 1.25rem; padding: 1.25rem; background: #f2f2f2 } .panel>:first-child { margin-top: 0 } .panel>:last-child { margin-bottom: 0 } .panel h1, .panel h2, .panel h3, .panel h4, .panel h5, .panel h6, .panel p, .panel li, .panel dl { color: #333 } .panel h1, .panel h2, .panel h3, .panel h4, .panel h5, .panel h6 { line-height: 1; margin-bottom: .625rem } .panel h1.subheader, .panel h2.subheader, .panel h3.subheader, .panel h4.subheader, .panel h5.subheader, .panel h6.subheader { line-height: 1.4 } .panel.callout { border-style: solid; border-width: 1px; border-color: #c5e8f3; margin-bottom: 1.25rem; padding: 1.25rem; background: #f2fafc } .panel.callout>:first-child { margin-top: 0 } .panel.callout>:last-child { margin-bottom: 0 } .panel.callout h1, .panel.callout h2, .panel.callout h3, .panel.callout h4, .panel.callout h5, .panel.callout h6, .panel.callout p, .panel.callout li, .panel.callout dl { color: #333 } .panel.callout h1, .panel.callout h2, .panel.callout h3, .panel.callout h4, .panel.callout h5, .panel.callout h6 { line-height: 1; margin-bottom: .625rem } .panel.callout h1.subheader, .panel.callout h2.subheader, .panel.callout h3.subheader, .panel.callout h4.subheader, .panel.callout h5.subheader, .panel.callout h6.subheader { line-height: 1.4 } .panel.callout a:not(.button) { color: #2ba6cb } .panel.radius { border-radius: 3px } .dropdown.button, button.dropdown { position: relative; padding-right: 3.5625rem } .dropdown.button:after, button.dropdown:after { position: absolute; content: ""; width: 0; height: 0; display: block; border-style: solid; border-color: #fff transparent transparent transparent; top: 50% } .dropdown.button:after, button.dropdown:after { border-width: .375rem; right: 1.40625rem; margin-top: -0.15625rem } .dropdown.button:after, button.dropdown:after { border-color: #fff transparent transparent transparent } .dropdown.button.tiny, button.dropdown.tiny { padding-right: 2.625rem } .dropdown.button.tiny:before, button.dropdown.tiny:before { border-width: .375rem; right: 1.125rem; margin-top: -0.125rem } .dropdown.button.tiny:after, button.dropdown.tiny:after { border-color: #fff transparent transparent transparent } .dropdown.button.small, button.dropdown.small { padding-right: 3.0625rem } .dropdown.button.small:after, button.dropdown.small:after { border-width: .4375rem; right: 1.3125rem; margin-top: -0.15625rem } .dropdown.button.small:after, button.dropdown.small:after { border-color: #fff transparent transparent transparent } .dropdown.button.large, button.dropdown.large { padding-right: 3.625rem } .dropdown.button.large:after, button.dropdown.large:after { border-width: .3125rem; right: 1.71875rem; margin-top: -0.15625rem } .dropdown.button.large:after, button.dropdown.large:after { border-color: #fff transparent transparent transparent } .dropdown.button.secondary:after, button.dropdown.secondary:after { border-color: #333 transparent transparent transparent } .th { line-height: 0; display: inline-block; border: solid 4px #fff; max-width: 100%; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2); transition: all 200ms ease-out } .th:hover, .th:focus { box-shadow: 0 0 6px 1px rgba(43, 166, 203, 0.5) } .th.radius { border-radius: 3px } .pricing-table { border: solid 1px #ddd; margin-left: 0; margin-bottom: 1.25rem } .pricing-table * { list-style: none; line-height: 1 } .pricing-table .title { background-color: #333; padding: .9375rem 1.25rem; text-align: center; color: #eee; font-weight: normal; font-size: 1rem; font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif } .pricing-table .price { background-color: #f6f6f6; padding: .9375rem 1.25rem; text-align: center; color: #333; font-weight: normal; font-size: 2rem; font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif } .pricing-table .description { background-color: #fff; padding: .9375rem; text-align: center; color: #777; font-size: .75rem; font-weight: normal; line-height: 1.4; border-bottom: dotted 1px #ddd } .pricing-table .bullet-item { background-color: #fff; padding: .9375rem; text-align: center; color: #333; font-size: .875rem; font-weight: normal; border-bottom: dotted 1px #ddd } .pricing-table .cta-button { background-color: #fff; text-align: center; padding: 1.25rem 1.25rem 0 } [data-magellan-expedition], [data-magellan-expedition-clone] { background: #fff; z-index: 50; min-width: 100%; padding: 10px } [data-magellan-expedition] .sub-nav, [data-magellan-expedition-clone] .sub-nav { margin-bottom: 0 } [data-magellan-expedition] .sub-nav dd, [data-magellan-expedition-clone] .sub-nav dd { margin-bottom: 0 } [data-magellan-expedition] .sub-nav a, [data-magellan-expedition-clone] .sub-nav a { line-height: 1.8em } div.icon-bar { width: 100%; font-size: 0; display: inline-block; background: #333 } div.icon-bar>* { text-align: center; font-size: 1rem; width: 25%; margin: 0 auto; display: block; padding: 1.25rem; float: left } div.icon-bar>* i, div.icon-bar>* img { display: block; margin: 0 auto } div.icon-bar>* i+label, div.icon-bar>* img+label { margin-top: .0625rem } div.icon-bar>* i { font-size: 1.875rem; vertical-align: middle } div.icon-bar>* img { width: 1.875rem; height: 1.875rem } div.icon-bar.label-right>* i, div.icon-bar.label-right>* img { margin: 0 .0625rem 0 0; display: inline-block } div.icon-bar.label-right>* i+label, div.icon-bar.label-right>* img+label { margin-top: 0 } div.icon-bar.label-right>* label { display: inline-block } div.icon-bar.vertical.label-right>* { text-align: left } div.icon-bar.vertical { height: 100%; width: auto } div.icon-bar.vertical .item { width: auto; margin: auto; float: none } div.icon-bar>* { font-size: 1rem; padding: 1.25rem } div.icon-bar>* i+label, div.icon-bar>* img+label { margin-top: .0625rem } div.icon-bar>* i { font-size: 1.875rem } div.icon-bar>* img { width: 1.875rem; height: 1.875rem } div.icon-bar>*:hover { background: #2ba6cb } div.icon-bar>* label { color: #fff } div.icon-bar>* i { color: #fff } .icon-bar.two-up .item { width: 50% } .icon-bar.two-up.vertical .item { width: auto } .icon-bar.three-up .item { width: 33.3333% } .icon-bar.three-up.vertical .item { width: auto } .icon-bar.four-up .item { width: 25% } .icon-bar.four-up.vertical .item { width: auto } .icon-bar.five-up .item { width: 20% } .icon-bar.five-up.vertical .item { width: auto } .icon-bar.six-up .item { width: 16.66667% } .icon-bar.six-up.vertical .item { width: auto } .text-left { text-align: left !important } .text-right { text-align: right !important } .text-center { text-align: center !important } .text-justify { text-align: justify !important } @media only screen and (max-width:40em) { .small-only-text-left { text-align: left !important } .small-only-text-right { text-align: right !important } .small-only-text-center { text-align: center !important } .small-only-text-justify { text-align: justify !important } } @media only screen { .small-text-left { text-align: left !important } .small-text-right { text-align: right !important } .small-text-center { text-align: center !important } .small-text-justify { text-align: justify !important } } @media only screen and (min-width:40.063em) and (max-width:64em) { .medium-only-text-left { text-align: left !important } .medium-only-text-right { text-align: right !important } .medium-only-text-center { text-align: center !important } .medium-only-text-justify { text-align: justify !important } } @media only screen and (min-width:40.063em) { .medium-text-left { text-align: left !important } .medium-text-right { text-align: right !important } .medium-text-center { text-align: center !important } .medium-text-justify { text-align: justify !important } } @media only screen and (min-width:64.063em) and (max-width:90em) { .large-only-text-left { text-align: left !important } .large-only-text-right { text-align: right !important } .large-only-text-center { text-align: center !important } .large-only-text-justify { text-align: justify !important } } @media only screen and (min-width:64.063em) { .large-text-left { text-align: left !important } .large-text-right { text-align: right !important } .large-text-center { text-align: center !important } .large-text-justify { text-align: justify !important } } @media only screen and (min-width:90.063em) and (max-width:120em) { .xlarge-only-text-left { text-align: left !important } .xlarge-only-text-right { text-align: right !important } .xlarge-only-text-center { text-align: center !important } .xlarge-only-text-justify { text-align: justify !important } } @media only screen and (min-width:90.063em) { .xlarge-text-left { text-align: left !important } .xlarge-text-right { text-align: right !important } .xlarge-text-center { text-align: center !important } .xlarge-text-justify { text-align: justify !important } } @media only screen and (min-width:120.063em) and (max-width:99999999em) { .xxlarge-only-text-left { text-align: left !important } .xxlarge-only-text-right { text-align: right !important } .xxlarge-only-text-center { text-align: center !important } .xxlarge-only-text-justify { text-align: justify !important } } @media only screen and (min-width:120.063em) { .xxlarge-text-left { text-align: left !important } .xxlarge-text-right { text-align: right !important } .xxlarge-text-center { text-align: center !important } .xxlarge-text-justify { text-align: justify !important } } div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, th, td { margin: 0; padding: 0 } a { color: #2ba6cb; text-decoration: none; line-height: inherit } a:hover, a:focus { color: #258faf } a img { border: 0 } p { font-family: inherit; font-weight: normal; font-size: 1rem; line-height: 1.6; margin-bottom: 1.25rem; text-rendering: optimizeLegibility } p.lead { font-size: 1.21875rem; line-height: 1.6 } p aside { font-size: .875rem; line-height: 1.35; font-style: italic } h1, h2, h3, h4, h5, h6 { font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; font-weight: normal; font-style: normal; color: #222; text-rendering: optimizeLegibility; margin-top: .2rem; margin-bottom: .5rem; line-height: 1.4 } h1 small, h2 small, h3 small, h4 small, h5 small, h6 small { font-size: 60%; color: #6f6f6f; line-height: 0 } h1 { font-size: 2.125rem } h2 { font-size: 1.6875rem } h3 { font-size: 1.375rem } h4 { font-size: 1.125rem } h5 { font-size: 1.125rem } h6 { font-size: 1rem } .subheader { line-height: 1.4; color: #6f6f6f; font-weight: normal; margin-top: .2rem; margin-bottom: .5rem } hr { border: solid #ddd; border-width: 1px 0 0; clear: both; margin: 1.25rem 0 1.1875rem; height: 0 } em, i { font-style: italic; line-height: inherit } strong, b { font-weight: bold; line-height: inherit } small { font-size: 60%; line-height: inherit } code { font-family: Consolas, "Liberation Mono", Courier, monospace; font-weight: bold; color: #910b0e } ul, ol, dl { font-size: 1rem; line-height: 1.6; margin-bottom: 1.25rem; list-style-position: outside; font-family: inherit } ul { margin-left: 1.1rem } ul.no-bullet { margin-left: 0 } ul.no-bullet li ul, ul.no-bullet li ol { margin-left: 1.25rem; margin-bottom: 0; list-style: none } ul li ul, ul li ol { margin-left: 1.25rem; margin-bottom: 0 } ul.square li ul, ul.circle li ul, ul.disc li ul { list-style: inherit } ul.square { list-style-type: square; margin-left: 1.1rem } ul.circle { list-style-type: circle; margin-left: 1.1rem } ul.disc { list-style-type: disc; margin-left: 1.1rem } ul.no-bullet { list-style: none } ol { margin-left: 1.4rem } ol li ul, ol li ol { margin-left: 1.25rem; margin-bottom: 0 } dl dt { margin-bottom: .3rem; font-weight: bold } dl dd { margin-bottom: .75rem } abbr, acronym { text-transform: uppercase; font-size: 90%; color: #222; border-bottom: 1px dotted #ddd; cursor: help } abbr { text-transform: none } blockquote { margin: 0 0 1.25rem; padding: .5625rem 1.25rem 0 1.1875rem; border-left: 1px solid #ddd } blockquote cite { display: block; font-size: .8125rem; color: #555 } blockquote cite:before { content: "\2014 \0020" } blockquote cite a, blockquote cite a:visited { color: #555 } blockquote, blockquote p { line-height: 1.6; color: #6f6f6f } .vcard { display: inline-block; margin: 0 0 1.25rem 0; border: 1px solid #ddd; padding: .625rem .75rem } .vcard li { margin: 0; display: block } .vcard .fn { font-weight: bold; font-size: .9375rem } .vevent .summary { font-weight: bold } .vevent abbr { cursor: default; text-decoration: none; font-weight: bold; border: 0; padding: 0 .0625rem } @media only screen and (min-width:40.063em) { h1, h2, h3, h4, h5, h6 { line-height: 1.4 } h1 { font-size: 2.75rem } h2 { font-size: 2.3125rem } h3 { font-size: 1.6875rem } h4 { font-size: 1.4375rem } h5 { font-size: 1.125rem } h6 { font-size: 1rem } } .print-only { display: none !important } @media print { * { background: transparent !important; color: #000 !important; box-shadow: none !important; text-shadow: none !important } a, a:visited { text-decoration: underline } a[href]:after { content: " (" attr(href) ")" } abbr[title]:after { content: " (" attr(title) ")" } .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: "" } pre, blockquote { border: 1px solid #999; page-break-inside: avoid } thead { display: table-header-group } tr, img { page-break-inside: avoid } img { max-width: 100% !important } @page { margin: .5cm } p, h2, h3 { orphans: 3; widows: 3 } h2, h3 { page-break-after: avoid } .hide-on-print { display: none !important } .print-only { display: block !important } .hide-for-print { display: none !important } .show-for-print { display: inherit !important } } .tabs { margin-bottom: 0 !important; margin-left: 0 } .tabs:before, .tabs:after { content: " "; display: table } .tabs:after { clear: both } .tabs dd, .tabs .tab-title { position: relative; margin-bottom: 0 !important; list-style: none; float: left } .tabs dd>a, .tabs .tab-title>a { display: block; background: #efefef; color: #222; padding: 1rem 2rem; font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; font-size: 1rem } .tabs dd>a:hover, .tabs .tab-title>a:hover { background: #e1e1e1 } .tabs dd.active a, .tabs .tab-title.active a { background: #fff; color: #222 } .tabs.radius dd:first-child a, .tabs.radius .tab:first-child a { border-bottom-left-radius: 3px; border-top-left-radius: 3px } .tabs.radius dd:last-child a, .tabs.radius .tab:last-child a { border-bottom-right-radius: 3px; border-top-right-radius: 3px } .tabs.vertical dd, .tabs.vertical .tab-title { position: inherit; float: none; display: block; top: auto } .tabs-content { margin-bottom: 1.5rem; width: 100% } .tabs-content:before, .tabs-content:after { content: " "; display: table } .tabs-content:after { clear: both } .tabs-content>.content { display: none; float: left; padding: 10px 0; width: 100% } .tabs-content>.content.active { display: block; float: none } .tabs-content>.content.contained { padding: 10px } .tabs-content.vertical { display: block } .tabs-content.vertical>.content { padding: 0 10px } @media only screen and (min-width:40.063em) { .tabs.vertical { width: 20%; float: left; margin-bottom: 1.25rem } .tabs-content.vertical { width: 80%; float: left; margin-left: -1px } } .no-js .tabs-content>.content { display: block; float: none } ul.pagination { display: block; min-height: 1.5rem; margin-left: -0.3125rem } ul.pagination li { height: 1.5rem; color: #222; font-size: .875rem; margin-left: .3125rem } ul.pagination li a { display: block; padding: .0625rem .625rem .0625rem; color: #999; border-radius: 3px } ul.pagination li:hover a, ul.pagination li a:focus { background: #e6e6e6 } ul.pagination li.unavailable a { cursor: default; color: #999 } ul.pagination li.unavailable:hover a, ul.pagination li.unavailable a:focus { background: transparent } ul.pagination li.current a { background: #2ba6cb; color: #fff; font-weight: bold; cursor: default } ul.pagination li.current a:hover, ul.pagination li.current a:focus { background: #2ba6cb } ul.pagination li { float: left; display: block } .pagination-centered { text-align: center } .pagination-centered ul.pagination li { float: none; display: inline-block } .side-nav { display: block; margin: 0; padding: .875rem 0; list-style-type: none; list-style-position: outside; font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif } .side-nav li { margin: 0 0 .4375rem 0; font-size: .875rem } .side-nav li a:not(.button) { display: block; color: #2ba6cb; margin: 0; padding: .4375rem .875rem } .side-nav li a:not(.button):hover, .side-nav li a:not(.button):focus { background: rgba(0, 0, 0, 0.025); color: #67c3df } .side-nav li.active>a:first-child:not(.button) { color: #67c3df; font-weight: normal; font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif } .side-nav li.divider { border-top: 1px solid; height: 0; padding: 0; list-style: none; border-top-color: #fff } .side-nav li.heading { color: #2ba6cb; font-size: .875rem; font-weight: bold; text-transform: uppercase } .accordion { margin-bottom: 0 } .accordion:before, .accordion:after { content: " "; display: table } .accordion:after { clear: both } .accordion .accordion-navigation, .accordion dd { display: block; margin-bottom: 0 !important } .accordion .accordion-navigation.active>a, .accordion dd.active>a { background: #e8e8e8 } .accordion .accordion-navigation>a, .accordion dd>a { background: #efefef; color: #222; padding: 1rem; display: block; font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; font-size: 1rem } .accordion .accordion-navigation>a:hover, .accordion dd>a:hover { background: #e3e3e3 } .accordion .accordion-navigation>.content, .accordion dd>.content { display: none; padding: 10px } .accordion .accordion-navigation>.content.active, .accordion dd>.content.active { display: block; background: #fff } .split.button { position: relative; padding-right: 5.0625rem } .split.button span { display: block; height: 100%; position: absolute; right: 0; top: 0; border-left: solid 1px } .split.button span:after { position: absolute; content: ""; width: 0; height: 0; display: block; border-style: inset; top: 50%; left: 50% } .split.button span:active { background-color: rgba(0, 0, 0, 0.1) } .split.button span { border-left-color: rgba(255, 255, 255, 0.5) } .split.button span { width: 3.09375rem } .split.button span:after { border-top-style: solid; border-width: .375rem; top: 48%; margin-left: -0.375rem } .split.button span:after { border-color: #fff transparent transparent transparent } .split.button.secondary span { border-left-color: rgba(255, 255, 255, 0.5) } .split.button.secondary span:after { border-color: #fff transparent transparent transparent } .split.button.alert span { border-left-color: rgba(255, 255, 255, 0.5) } .split.button.success span { border-left-color: rgba(255, 255, 255, 0.5) } .split.button.tiny { padding-right: 3.75rem } .split.button.tiny span { width: 2.25rem } .split.button.tiny span:after { border-top-style: solid; border-width: .375rem; top: 48%; margin-left: -0.375rem } .split.button.small { padding-right: 4.375rem } .split.button.small span { width: 2.625rem } .split.button.small span:after { border-top-style: solid; border-width: .4375rem; top: 48%; margin-left: -0.375rem } .split.button.large { padding-right: 5.5rem } .split.button.large span { width: 3.4375rem } .split.button.large span:after { border-top-style: solid; border-width: .3125rem; top: 48%; margin-left: -0.375rem } .split.button.expand { padding-left: 2rem } .split.button.secondary span:after { border-color: #333 transparent transparent transparent } .split.button.radius span { border-bottom-right-radius: 3px; border-top-right-radius: 3px } .split.button.round span { border-bottom-right-radius: 1000px; border-top-right-radius: 1000px } .reveal-modal-bg { position: fixed; height: 100%; width: 100%; background: #000; background: rgba(0, 0, 0, 0.45); z-index: 99; display: none; top: 0; left: 0 } dialog, .reveal-modal { visibility: hidden; display: none; position: absolute; z-index: 100; width: 100vw; top: 0; left: 0; background-color: #fff; padding: 1.25rem; border: solid 1px #666; box-shadow: 0 0 10px rgba(0, 0, 0, 0.4) } @media only screen and (max-width:40em) { dialog, .reveal-modal { min-height: 100vh } } @media only screen and (min-width:40.063em) { dialog, .reveal-modal { left: 50% } } dialog .column, dialog .columns, .reveal-modal .column, .reveal-modal .columns { min-width: 0 } dialog>:first-child, .reveal-modal>:first-child { margin-top: 0 } dialog>:last-child, .reveal-modal>:last-child { margin-bottom: 0 } @media only screen and (min-width:40.063em) { dialog, .reveal-modal { margin-left: -40%; width: 80% } } @media only screen and (min-width:40.063em) { dialog, .reveal-modal { top: 6.25rem } } dialog .close-reveal-modal, .reveal-modal .close-reveal-modal { font-size: 2.5rem; line-height: 1; position: absolute; top: .5rem; right: .6875rem; color: #aaa; font-weight: bold; cursor: pointer } dialog[open] { display: block; visibility: visible } @media only screen and (min-width:40.063em) { dialog, .reveal-modal { padding: 1.875rem } dialog.radius, .reveal-modal.radius { border-radius: 3px } dialog.round, .reveal-modal.round { border-radius: 1000px } dialog.collapse, .reveal-modal.collapse { padding: 0 } dialog.full, .reveal-modal.full { top: 0; left: 0; height: 100vh; min-height: 100vh; margin-left: 0 !important } } @media only screen and (min-width:40.063em) and (min-width:40.063em) { dialog.tiny, .reveal-modal.tiny { margin-left: -15%; width: 30% } } @media only screen and (min-width:40.063em) and (min-width:40.063em) { dialog.small, .reveal-modal.small { margin-left: -20%; width: 40% } } @media only screen and (min-width:40.063em) and (min-width:40.063em) { dialog.medium, .reveal-modal.medium { margin-left: -30%; width: 60% } } @media only screen and (min-width:40.063em) and (min-width:40.063em) { dialog.large, .reveal-modal.large { margin-left: -35%; width: 70% } } @media only screen and (min-width:40.063em) and (min-width:40.063em) { dialog.xlarge, .reveal-modal.xlarge { margin-left: -47.5%; width: 95% } } @media only screen and (min-width:40.063em) and (min-width:40.063em) { dialog.full, .reveal-modal.full { margin-left: -50vw; width: 100vw } } @media print { dialog, .reveal-modal { background: #fff !important } } .has-tip { border-bottom: dotted 1px #ccc; cursor: help; font-weight: bold; color: #333 } .has-tip:hover, .has-tip:focus { border-bottom: dotted 1px #134b5b; color: #2ba6cb } .has-tip.tip-left, .has-tip.tip-right { float: none !important } .tooltip { display: none; position: absolute; z-index: 999; font-weight: normal; font-size: .875rem; line-height: 1.3; padding: .75rem; max-width: 300px; left: 50%; width: 100%; color: #fff; background: #333 } .tooltip>.nub { display: block; left: 5px; position: absolute; width: 0; height: 0; border: solid 5px; border-color: transparent transparent #333 transparent; top: -10px } .tooltip>.nub.rtl { left: auto; right: 5px } .tooltip.radius { border-radius: 3px } .tooltip.round { border-radius: 1000px } .tooltip.round>.nub { left: 2rem } .tooltip.opened { color: #2ba6cb !important; border-bottom: dotted 1px #134b5b !important } .tap-to-close { display: block; font-size: .625rem; color: #777; font-weight: normal } @media only screen and (min-width:40.063em) { .tooltip>.nub { border-color: transparent transparent #333 transparent; top: -10px } .tooltip.tip-top>.nub { border-color: #333 transparent transparent transparent; top: auto; bottom: -10px } .tooltip.tip-left, .tooltip.tip-right { float: none !important } .tooltip.tip-left>.nub { border-color: transparent transparent transparent #333; right: -10px; left: auto; top: 50%; margin-top: -5px } .tooltip.tip-right>.nub { border-color: transparent #333 transparent transparent; right: auto; left: -10px; top: 50%; margin-top: -5px } } .clearing-thumbs, [data-clearing] { margin-bottom: 0; margin-left: 0; list-style: none } .clearing-thumbs:before, .clearing-thumbs:after, [data-clearing]:before, [data-clearing]:after { content: " "; display: table } .clearing-thumbs:after, [data-clearing]:after { clear: both } .clearing-thumbs li, [data-clearing] li { float: left; margin-right: 10px } .clearing-thumbs[class*="block-grid-"] li, [data-clearing][class*="block-grid-"] li { margin-right: 0 } .clearing-blackout { background: #333; position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 998 } .clearing-blackout .clearing-close { display: block } .clearing-container { position: relative; z-index: 998; height: 100%; overflow: hidden; margin: 0 } .clearing-touch-label { position: absolute; top: 50%; left: 50%; color: #aaa; font-size: .6em } .visible-img { height: 95%; position: relative } .visible-img img { position: absolute; left: 50%; top: 50%; margin-left: -50%; max-height: 100%; max-width: 100% } .clearing-caption { color: #ccc; font-size: .875em; line-height: 1.3; margin-bottom: 0; text-align: center; bottom: 0; background: #333; width: 100%; padding: 10px 30px 20px; position: absolute; left: 0 } .clearing-close { z-index: 999; padding-left: 20px; padding-top: 10px; font-size: 30px; line-height: 1; color: #ccc; display: none } .clearing-close:hover, .clearing-close:focus { color: #ccc } .clearing-assembled .clearing-container { height: 100% } .clearing-assembled .clearing-container .carousel>ul { display: none } .clearing-feature li { display: none } .clearing-feature li.clearing-featured-img { display: block } @media only screen and (min-width:40.063em) { .clearing-main-prev, .clearing-main-next { position: absolute; height: 100%; width: 40px; top: 0 } .clearing-main-prev>span, .clearing-main-next>span { position: absolute; top: 50%; display: block; width: 0; height: 0; border: solid 12px } .clearing-main-prev>span:hover, .clearing-main-next>span:hover { opacity: .8 } .clearing-main-prev { left: 0 } .clearing-main-prev>span { left: 5px; border-color: transparent; border-right-color: #ccc } .clearing-main-next { right: 0 } .clearing-main-next>span { border-color: transparent; border-left-color: #ccc } .clearing-main-prev.disabled, .clearing-main-next.disabled { opacity: .3 } .clearing-assembled .clearing-container .carousel { background: rgba(51, 51, 51, 0.8); height: 120px; margin-top: 10px; text-align: center } .clearing-assembled .clearing-container .carousel>ul { display: inline-block; z-index: 999; height: 100%; position: relative; float: none } .clearing-assembled .clearing-container .carousel>ul li { display: block; width: 120px; min-height: inherit; float: left; overflow: hidden; margin-right: 0; padding: 0; position: relative; cursor: pointer; opacity: .4; clear: none } .clearing-assembled .clearing-container .carousel>ul li.fix-height img { height: 100%; max-width: none } .clearing-assembled .clearing-container .carousel>ul li a.th { border: 0; box-shadow: none; display: block } .clearing-assembled .clearing-container .carousel>ul li img { cursor: pointer !important; width: 100% !important } .clearing-assembled .clearing-container .carousel>ul li.visible { opacity: 1 } .clearing-assembled .clearing-container .carousel>ul li:hover { opacity: .8 } .clearing-assembled .clearing-container .visible-img { background: #333; overflow: hidden; height: 85% } .clearing-close { position: absolute; top: 10px; right: 20px; padding-left: 0; padding-top: 0 } } .progress { background-color: #f6f6f6; height: 1.5625rem; border: 1px solid #fff; padding: .125rem; margin-bottom: .625rem } .progress .meter { background: #2ba6cb; height: 100%; display: block } .progress.secondary .meter { background: #e9e9e9; height: 100%; display: block } .progress.success .meter { background: #5da423; height: 100%; display: block } .progress.alert .meter { background: #c60f13; height: 100%; display: block } .progress.radius { border-radius: 3px } .progress.radius .meter { border-radius: 2px } .progress.round { border-radius: 1000px } .progress.round .meter { border-radius: 999px } .sub-nav { display: block; width: auto; overflow: hidden; margin: -0.25rem 0 1.125rem; padding-top: .25rem; margin-right: 0; margin-left: -0.75rem } .sub-nav dt { text-transform: uppercase } .sub-nav dt, .sub-nav dd, .sub-nav li { float: left; display: inline; margin-left: 1rem; margin-bottom: .625rem; font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; font-weight: normal; font-size: .875rem; color: #999 } .sub-nav dt a, .sub-nav dd a, .sub-nav li a { text-decoration: none; color: #999; padding: .1875rem 1rem } .sub-nav dt a:hover, .sub-nav dd a:hover, .sub-nav li a:hover { color: #737373 } .sub-nav dt.active a, .sub-nav dd.active a, .sub-nav li.active a { border-radius: 3px; font-weight: normal; background: #2ba6cb; padding: .1875rem 1rem; cursor: default; color: #fff } .sub-nav dt.active a:hover, .sub-nav dd.active a:hover, .sub-nav li.active a:hover { background: #258faf } .joyride-list { display: none } .joyride-tip-guide { display: none; position: absolute; background: #333; color: #fff; z-index: 101; top: 0; left: 2.5%; font-family: inherit; font-weight: normal; width: 95% } .lt-ie9 .joyride-tip-guide { max-width: 800px; left: 50%; margin-left: -400px } .joyride-content-wrapper { width: 100%; padding: 1.125rem 1.25rem 1.5rem } .joyride-content-wrapper .button { margin-bottom: 0 !important } .joyride-tip-guide .joyride-nub { display: block; position: absolute; left: 22px; width: 0; height: 0; border: 10px solid #333 } .joyride-tip-guide .joyride-nub.top { border-top-style: solid; border-color: #333; border-top-color: transparent !important; border-left-color: transparent !important; border-right-color: transparent !important; top: -20px } .joyride-tip-guide .joyride-nub.bottom { border-bottom-style: solid; border-color: #333 !important; border-bottom-color: transparent !important; border-left-color: transparent !important; border-right-color: transparent !important; bottom: -20px } .joyride-tip-guide .joyride-nub.right { right: -20px } .joyride-tip-guide .joyride-nub.left { left: -20px } .joyride-tip-guide h1, .joyride-tip-guide h2, .joyride-tip-guide h3, .joyride-tip-guide h4, .joyride-tip-guide h5, .joyride-tip-guide h6 { line-height: 1.25; margin: 0; font-weight: bold; color: #fff } .joyride-tip-guide p { margin: 0 0 1.125rem 0; font-size: .875rem; line-height: 1.3 } .joyride-timer-indicator-wrap { width: 50px; height: 3px; border: solid 1px #555; position: absolute; right: 1.0625rem; bottom: 1rem } .joyride-timer-indicator { display: block; width: 0; height: inherit; background: #666 } .joyride-close-tip { position: absolute; right: 12px; top: 10px; color: #777 !important; text-decoration: none; font-size: 24px; font-weight: normal; line-height: .5 !important } .joyride-close-tip:hover, .joyride-close-tip:focus { color: #eee !important } .joyride-modal-bg { position: fixed; height: 100%; width: 100%; background: transparent; background: rgba(0, 0, 0, 0.5); z-index: 100; display: none; top: 0; left: 0; cursor: pointer } .joyride-expose-wrapper { background-color: #fff; position: absolute; border-radius: 3px; z-index: 102; box-shadow: 0 0 15px #fff } .joyride-expose-cover { background: transparent; border-radius: 3px; position: absolute; z-index: 9999; top: 0; left: 0 } @media only screen and (min-width:40.063em) { .joyride-tip-guide { width: 300px; left: inherit } .joyride-tip-guide .joyride-nub.bottom { border-color: #333 !important; border-bottom-color: transparent !important; border-left-color: transparent !important; border-right-color: transparent !important; bottom: -20px } .joyride-tip-guide .joyride-nub.right { border-color: #333 !important; border-top-color: transparent !important; border-right-color: transparent !important; border-bottom-color: transparent !important; top: 22px; left: auto; right: -20px } .joyride-tip-guide .joyride-nub.left { border-color: #333 !important; border-top-color: transparent !important; border-left-color: transparent !important; border-bottom-color: transparent !important; top: 22px; left: -20px; right: auto } } .label { font-weight: normal; font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; text-align: center; text-decoration: none; line-height: 1; white-space: nowrap; display: inline-block; position: relative; margin-bottom: inherit; padding: .25rem .5rem .375rem; font-size: .6875rem; background-color: #2ba6cb; color: #fff } .label.radius { border-radius: 3px } .label.round { border-radius: 1000px } .label.alert { background-color: #c60f13; color: #fff } .label.success { background-color: #5da423; color: #fff } .label.secondary { background-color: #e9e9e9; color: #333 } .off-canvas-wrap { -webkit-backface-visibility: hidden; position: relative; width: 100%; overflow: hidden } .off-canvas-wrap.move-right, .off-canvas-wrap.move-left { min-height: 100%; -webkit-overflow-scrolling: touch } .inner-wrap { -webkit-backface-visibility: hidden; position: relative; width: 100%; -webkit-transition: -webkit-transform 500ms ease; -moz-transition: -moz-transform 500ms ease; -ms-transition: -ms-transform 500ms ease; -o-transition: -o-transform 500ms ease; transition: transform 500ms ease } .inner-wrap:before, .inner-wrap:after { content: " "; display: table } .inner-wrap:after { clear: both } .tab-bar { -webkit-backface-visibility: hidden; background: #333; color: #fff; height: 2.8125rem; line-height: 2.8125rem; position: relative } .tab-bar h1, .tab-bar h2, .tab-bar h3, .tab-bar h4, .tab-bar h5, .tab-bar h6 { color: #fff; font-weight: bold; line-height: 2.8125rem; margin: 0 } .tab-bar h1, .tab-bar h2, .tab-bar h3, .tab-bar h4 { font-size: 1.125rem } .left-small { width: 2.8125rem; height: 2.8125rem; position: absolute; top: 0; border-right: solid 1px #1a1a1a; left: 0 } .right-small { width: 2.8125rem; height: 2.8125rem; position: absolute; top: 0; border-left: solid 1px #1a1a1a; right: 0 } .tab-bar-section { padding: 0 .625rem; position: absolute; text-align: center; height: 2.8125rem; top: 0 } @media only screen and (min-width:40.063em) { .tab-bar-section { text-align: left } } .tab-bar-section.left { left: 0; right: 2.8125rem } .tab-bar-section.right { left: 2.8125rem; right: 0 } .tab-bar-section.middle { left: 2.8125rem; right: 2.8125rem } .tab-bar .menu-icon { text-indent: 2.1875rem; width: 2.8125rem; height: 2.8125rem; display: block; padding: 0; color: #fff; position: relative; transform: translate3d(0, 0, 0) } .tab-bar .menu-icon span::after { content: ""; position: absolute; display: block; height: 0; top: 50%; margin-top: -0.5rem; left: .90625rem; box-shadow: 0 0 0 1px #fff, 0 7px 0 1px #fff, 0 14px 0 1px #fff; width: 1rem } .tab-bar .menu-icon span:hover:after { box-shadow: 0 0 0 1px #b3b3b3, 0 7px 0 1px #b3b3b3, 0 14px 0 1px #b3b3b3 } .left-off-canvas-menu { -webkit-backface-visibility: hidden; width: 15.625rem; top: 0; bottom: 0; position: absolute; overflow-y: auto; background: #333; z-index: 1001; box-sizing: content-box; transition: transform 500ms ease 0s; -webkit-overflow-scrolling: touch; -ms-transform: translate(-100%, 0); -webkit-transform: translate3d(-100%, 0, 0); -moz-transform: translate3d(-100%, 0, 0); -ms-transform: translate3d(-100%, 0, 0); -o-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); left: 0 } .left-off-canvas-menu * { -webkit-backface-visibility: hidden } .right-off-canvas-menu { -webkit-backface-visibility: hidden; width: 15.625rem; top: 0; bottom: 0; position: absolute; overflow-y: auto; background: #333; z-index: 1001; box-sizing: content-box; transition: transform 500ms ease 0s; -webkit-overflow-scrolling: touch; -ms-transform: translate(100%, 0); -webkit-transform: translate3d(100%, 0, 0); -moz-transform: translate3d(100%, 0, 0); -ms-transform: translate3d(100%, 0, 0); -o-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); right: 0 } .right-off-canvas-menu * { -webkit-backface-visibility: hidden } ul.off-canvas-list { list-style-type: none; padding: 0; margin: 0 } ul.off-canvas-list li label { display: block; padding: .3rem .9375rem; color: #999; text-transform: uppercase; font-size: .75rem; font-weight: bold; background: #444; border-top: 1px solid #5e5e5e; border-bottom: 0; margin: 0 } ul.off-canvas-list li a { display: block; padding: .66667rem; color: rgba(255, 255, 255, 0.7); border-bottom: 1px solid #262626; transition: background 300ms ease } ul.off-canvas-list li a:hover { background: #242424 } .move-right>.inner-wrap { -ms-transform: translate(15.625rem, 0); -webkit-transform: translate3d(15.625rem, 0, 0); -moz-transform: translate3d(15.625rem, 0, 0); -ms-transform: translate3d(15.625rem, 0, 0); -o-transform: translate3d(15.625rem, 0, 0); transform: translate3d(15.625rem, 0, 0) } .move-right .exit-off-canvas { -webkit-backface-visibility: hidden; transition: background 300ms ease; cursor: pointer; box-shadow: -4px 0 4px rgba(0, 0, 0, 0.5), 4px 0 4px rgba(0, 0, 0, 0.5); display: block; position: absolute; background: rgba(255, 255, 255, 0.2); top: 0; bottom: 0; left: 0; right: 0; z-index: 1002; -webkit-tap-highlight-color: rgba(0, 0, 0, 0) } @media only screen and (min-width:40.063em) { .move-right .exit-off-canvas:hover { background: rgba(255, 255, 255, 0.05) } } .move-left>.inner-wrap { -ms-transform: translate(-15.625rem, 0); -webkit-transform: translate3d(-15.625rem, 0, 0); -moz-transform: translate3d(-15.625rem, 0, 0); -ms-transform: translate3d(-15.625rem, 0, 0); -o-transform: translate3d(-15.625rem, 0, 0); transform: translate3d(-15.625rem, 0, 0) } .move-left .exit-off-canvas { -webkit-backface-visibility: hidden; transition: background 300ms ease; cursor: pointer; box-shadow: -4px 0 4px rgba(0, 0, 0, 0.5), 4px 0 4px rgba(0, 0, 0, 0.5); display: block; position: absolute; background: rgba(255, 255, 255, 0.2); top: 0; bottom: 0; left: 0; right: 0; z-index: 1002; -webkit-tap-highlight-color: rgba(0, 0, 0, 0) } @media only screen and (min-width:40.063em) { .move-left .exit-off-canvas:hover { background: rgba(255, 255, 255, 0.05) } } .offcanvas-overlap .left-off-canvas-menu, .offcanvas-overlap .right-off-canvas-menu { -ms-transform: none; -webkit-transform: none; -moz-transform: none; -o-transform: none; transform: none; z-index: 1003 } .offcanvas-overlap .exit-offcanvas-menu { -webkit-backface-visibility: hidden; transition: background 300ms ease; cursor: pointer; box-shadow: -4px 0 4px rgba(0, 0, 0, 0.5), 4px 0 4px rgba(0, 0, 0, 0.5); display: block; position: absolute; background: rgba(255, 255, 255, 0.2); top: 0; bottom: 0; left: 0; right: 0; z-index: 1002; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); z-index: 1002 } @media only screen and (min-width:40.063em) { .offcanvas-overlap .exit-offcanvas-menu:hover { background: rgba(255, 255, 255, 0.05) } } .no-csstransforms .left-off-canvas-menu { left: -15.625rem } .no-csstransforms .right-off-canvas-menu { right: -15.625rem } .no-csstransforms .move-left>.inner-wrap { right: 15.625rem } .no-csstransforms .move-right>.inner-wrap { left: 15.625rem } .f-dropdown { position: absolute; left: -9999px; list-style: none; margin-left: 0; width: 100%; max-height: none; height: auto; background: #fff; border: solid 1px #ccc; font-size: .875rem; z-index: 99; margin-top: 2px; max-width: 200px } .f-dropdown>*:first-child { margin-top: 0 } .f-dropdown>*:last-child { margin-bottom: 0 } .f-dropdown:before { content: ""; display: block; width: 0; height: 0; border: inset 6px; border-color: transparent transparent #fff transparent; border-bottom-style: solid; position: absolute; top: -12px; left: 10px; z-index: 99 } .f-dropdown:after { content: ""; display: block; width: 0; height: 0; border: inset 7px; border-color: transparent transparent #ccc transparent; border-bottom-style: solid; position: absolute; top: -14px; left: 9px; z-index: 98 } .f-dropdown.right:before { left: auto; right: 10px } .f-dropdown.right:after { left: auto; right: 9px } .f-dropdown.drop-right { position: absolute; left: -9999px; list-style: none; margin-left: 0; width: 100%; max-height: none; height: auto; background: #fff; border: solid 1px #ccc; font-size: .875rem; z-index: 99; margin-top: 0; margin-left: 2px; max-width: 200px } .f-dropdown.drop-right>*:first-child { margin-top: 0 } .f-dropdown.drop-right>*:last-child { margin-bottom: 0 } .f-dropdown.drop-right:before { content: ""; display: block; width: 0; height: 0; border: inset 6px; border-color: transparent #fff transparent transparent; border-right-style: solid; position: absolute; top: 10px; left: -12px; z-index: 99 } .f-dropdown.drop-right:after { content: ""; display: block; width: 0; height: 0; border: inset 7px; border-color: transparent #ccc transparent transparent; border-right-style: solid; position: absolute; top: 9px; left: -14px; z-index: 98 } .f-dropdown.drop-left { position: absolute; left: -9999px; list-style: none; margin-left: 0; width: 100%; max-height: none; height: auto; background: #fff; border: solid 1px #ccc; font-size: .875rem; z-index: 99; margin-top: 0; margin-left: -2px; max-width: 200px } .f-dropdown.drop-left>*:first-child { margin-top: 0 } .f-dropdown.drop-left>*:last-child { margin-bottom: 0 } .f-dropdown.drop-left:before { content: ""; display: block; width: 0; height: 0; border: inset 6px; border-color: transparent transparent transparent #fff; border-left-style: solid; position: absolute; top: 10px; right: -12px; left: auto; z-index: 99 } .f-dropdown.drop-left:after { content: ""; display: block; width: 0; height: 0; border: inset 7px; border-color: transparent transparent transparent #ccc; border-left-style: solid; position: absolute; top: 9px; right: -14px; left: auto; z-index: 98 } .f-dropdown.drop-top { position: absolute; left: -9999px; list-style: none; margin-left: 0; width: 100%; max-height: none; height: auto; background: #fff; border: solid 1px #ccc; font-size: .875rem; z-index: 99; margin-top: -2px; margin-left: 0; max-width: 200px } .f-dropdown.drop-top>*:first-child { margin-top: 0 } .f-dropdown.drop-top>*:last-child { margin-bottom: 0 } .f-dropdown.drop-top:before { content: ""; display: block; width: 0; height: 0; border: inset 6px; border-color: #fff transparent transparent transparent; border-top-style: solid; position: absolute; top: auto; bottom: -12px; left: 10px; right: auto; z-index: 99 } .f-dropdown.drop-top:after { content: ""; display: block; width: 0; height: 0; border: inset 7px; border-color: #ccc transparent transparent transparent; border-top-style: solid; position: absolute; top: auto; bottom: -14px; left: 9px; right: auto; z-index: 98 } .f-dropdown li { font-size: .875rem; cursor: pointer; line-height: 1.125rem; margin: 0 } .f-dropdown li:hover, .f-dropdown li:focus { background: #eee } .f-dropdown li a { display: block; padding: .5rem; color: #555 } .f-dropdown.content { position: absolute; left: -9999px; list-style: none; margin-left: 0; padding: 1.25rem; width: 100%; height: auto; max-height: none; background: #fff; border: solid 1px #ccc; font-size: .875rem; z-index: 99; max-width: 200px } .f-dropdown.content>*:first-child { margin-top: 0 } .f-dropdown.content>*:last-child { margin-bottom: 0 } .f-dropdown.tiny { max-width: 200px } .f-dropdown.small { max-width: 300px } .f-dropdown.medium { max-width: 500px } .f-dropdown.large { max-width: 800px } table { background: #fff; margin-bottom: 1.25rem; border: solid 1px #ddd } table caption { background: transparent; color: #222; font-size: 1rem; font-weight: bold } table thead { background: #f5f5f5 } table thead tr th, table thead tr td { padding: .5rem .625rem .625rem; font-size: .875rem; font-weight: bold; color: #222 } table tfoot { background: #f5f5f5 } table tfoot tr th, table tfoot tr td { padding: .5rem .625rem .625rem; font-size: .875rem; font-weight: bold; color: #222 } table tr th, table tr td { padding: .5625rem .625rem; font-size: .875rem; color: #222; text-align: left } table tr.even, table tr.alt, table tr:nth-of-type(even) { background: #f9f9f9 } table thead tr th, table tfoot tr th, table tfoot tr td, table tbody tr th, table tbody tr td, table tr td { display: table-cell; line-height: 1.125rem } form { margin: 0 0 1rem } form .row .row { margin: 0 -0.5rem } form .row .row .column, form .row .row .columns { padding: 0 .5rem } form .row .row.collapse { margin: 0 } form .row .row.collapse .column, form .row .row.collapse .columns { padding: 0 } form .row .row.collapse input { border-bottom-right-radius: 0; border-top-right-radius: 0 } form .row input.column, form .row input.columns, form .row textarea.column, form .row textarea.columns { padding-left: .5rem } label { font-size: .875rem; color: #4d4d4d; cursor: pointer; display: block; font-weight: normal; line-height: 1.5; margin-bottom: 0 } label.right { float: none !important; text-align: right } label.inline { margin: 0 0 1rem 0; padding: .5625rem 0 } label small { text-transform: capitalize; color: #676767 } select::-ms-expand { display: none } .prefix, .postfix { display: block; position: relative; z-index: 2; text-align: center; width: 100%; padding-top: 0; padding-bottom: 0; border-style: solid; border-width: 1px; overflow: hidden; font-size: .875rem; height: 2.3125rem; line-height: 2.3125rem } .postfix.button { padding-left: 0; padding-right: 0; padding-top: 0; padding-bottom: 0; text-align: center; line-height: 2.125rem; border: 0 } .prefix.button { padding-left: 0; padding-right: 0; padding-top: 0; padding-bottom: 0; text-align: center; line-height: 2.125rem; border: 0 } .prefix.button.radius { border-radius: 0; border-bottom-left-radius: 3px; border-top-left-radius: 3px } .postfix.button.radius { border-radius: 0; border-bottom-right-radius: 3px; border-top-right-radius: 3px } .prefix.button.round { border-radius: 0; border-bottom-left-radius: 1000px; border-top-left-radius: 1000px } .postfix.button.round { border-radius: 0; border-bottom-right-radius: 1000px; border-top-right-radius: 1000px } span.prefix, label.prefix { background: #f2f2f2; border-right: 0; color: #333; border-color: #ccc } span.prefix.radius, label.prefix.radius { border-radius: 0; border-bottom-left-radius: 3px; border-top-left-radius: 3px } span.postfix, label.postfix { background: #f2f2f2; border-left: 0; color: #333; border-color: #ccc } span.postfix.radius, label.postfix.radius { border-radius: 0; border-bottom-right-radius: 3px; border-top-right-radius: 3px } input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], textarea { -webkit-appearance: none; background-color: #fff; font-family: inherit; border: 1px solid #ccc; box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); color: rgba(0, 0, 0, 0.75); display: block; font-size: .875rem; margin: 0 0 1rem 0; padding: .5rem; height: 2.3125rem; width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; transition: box-shadow .45s, border-color .45s ease-in-out } input[type="text"]:focus, input[type="password"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="time"]:focus, input[type="url"]:focus, textarea:focus { box-shadow: 0 0 5px #999; border-color: #999 } input[type="text"]:focus, input[type="password"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="time"]:focus, input[type="url"]:focus, textarea:focus { background: #fafafa; border-color: #999; outline: 0 } input[type="text"][disabled], fieldset[disabled] input[type="text"], input[type="password"][disabled], fieldset[disabled] input[type="password"], input[type="date"][disabled], fieldset[disabled] input[type="date"], input[type="datetime"][disabled], fieldset[disabled] input[type="datetime"], input[type="datetime-local"][disabled], fieldset[disabled] input[type="datetime-local"], input[type="month"][disabled], fieldset[disabled] input[type="month"], input[type="week"][disabled], fieldset[disabled] input[type="week"], input[type="email"][disabled], fieldset[disabled] input[type="email"], input[type="number"][disabled], fieldset[disabled] input[type="number"], input[type="search"][disabled], fieldset[disabled] input[type="search"], input[type="tel"][disabled], fieldset[disabled] input[type="tel"], input[type="time"][disabled], fieldset[disabled] input[type="time"], input[type="url"][disabled], fieldset[disabled] input[type="url"], textarea[disabled], fieldset[disabled] textarea { background-color: #ddd } input[type="text"].radius, input[type="password"].radius, input[type="date"].radius, input[type="datetime"].radius, input[type="datetime-local"].radius, input[type="month"].radius, input[type="week"].radius, input[type="email"].radius, input[type="number"].radius, input[type="search"].radius, input[type="tel"].radius, input[type="time"].radius, input[type="url"].radius, textarea.radius { border-radius: 3px } input[type="submit"] { -webkit-appearance: none } textarea[rows] { height: auto } select { -webkit-appearance: none !important; background-color: #fafafa; background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeD0iMTJweCIgeT0iMHB4IiB3aWR0aD0iMjRweCIgaGVpZ2h0PSIzcHgiIHZpZXdCb3g9IjAgMCA2IDMiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDYgMyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHBvbHlnb24gcG9pbnRzPSI1Ljk5MiwwIDIuOTkyLDMgLTAuMDA4LDAgIi8+PC9zdmc+); background-position: 100% center; background-repeat: no-repeat; border: 1px solid #ccc; padding: .5rem; font-size: .875rem; color: rgba(0, 0, 0, 0.75); line-height: normal; border-radius: 0; height: 2.3125rem } select.radius { border-radius: 3px } select:hover { background-color: #f3f3f3; border-color: #999 } input[type="file"], input[type="checkbox"], input[type="radio"], select { margin: 0 0 1rem 0 } input[type="checkbox"]+label, input[type="radio"]+label { display: inline-block; margin-left: .5rem; margin-right: 1rem; margin-bottom: 0; vertical-align: baseline } input[type="file"] { width: 100% } fieldset { border: 1px solid #ddd; padding: 1.25rem; margin: 1.125rem 0 } fieldset legend { font-weight: bold; background: #fff; padding: 0 .1875rem; margin: 0; margin-left: -0.1875rem } [data-abide] .error small.error, [data-abide] span.error, [data-abide] small.error { display: block; padding: .375rem .5625rem .5625rem; margin-top: -1px; margin-bottom: 1rem; font-size: .75rem; font-weight: normal; font-style: italic; background: #c60f13; color: #fff } [data-abide] span.error, [data-abide] small.error { display: none } span.error, small.error { display: block; padding: .375rem .5625rem .5625rem; margin-top: -1px; margin-bottom: 1rem; font-size: .75rem; font-weight: normal; font-style: italic; background: #c60f13; color: #fff } .error input, .error textarea, .error select { margin-bottom: 0 } .error input[type="checkbox"], .error input[type="radio"] { margin-bottom: 1rem } .error label, .error label.error { color: #c60f13 } .error small.error { display: block; padding: .375rem .5625rem .5625rem; margin-top: -1px; margin-bottom: 1rem; font-size: .75rem; font-weight: normal; font-style: italic; background: #c60f13; color: #fff } .error>label>small { color: #676767; background: transparent; padding: 0; text-transform: capitalize; font-style: normal; font-size: 60%; margin: 0; display: inline } .error span.error-message { display: block } input.error, textarea.error { margin-bottom: 0 } label.error { color: #c60f13 } .range-slider { display: block; position: relative; width: 100%; height: 1rem; border: 1px solid #ddd; margin: 1.25rem 0; -ms-touch-action: none; touch-action: none; background: #fafafa } .range-slider.vertical-range { display: block; position: relative; width: 100%; height: 1rem; border: 1px solid #ddd; margin: 1.25rem 0; -ms-touch-action: none; touch-action: none; display: inline-block; width: 1rem; height: 12.5rem } .range-slider.vertical-range .range-slider-handle { margin-top: 0; margin-left: -0.5rem; position: absolute; bottom: -10.5rem } .range-slider.vertical-range .range-slider-active-segment { width: .875rem; height: auto; bottom: 0 } .range-slider.radius { background: #fafafa; border-radius: 3px } .range-slider.radius .range-slider-handle { background: #2ba6cb; border-radius: 3px } .range-slider.radius .range-slider-handle:hover { background: #2692b3 } .range-slider.round { background: #fafafa; border-radius: 1000px } .range-slider.round .range-slider-handle { background: #2ba6cb; border-radius: 1000px } .range-slider.round .range-slider-handle:hover { background: #2692b3 } .range-slider.disabled, .range-slider[disabled] { background: #fafafa; cursor: default; opacity: .7 } .range-slider.disabled .range-slider-handle, .range-slider[disabled] .range-slider-handle { background: #2ba6cb; cursor: default; opacity: .7 } .range-slider.disabled .range-slider-handle:hover, .range-slider[disabled] .range-slider-handle:hover { background: #2692b3 } .range-slider-active-segment { display: inline-block; position: absolute; height: .875rem; background: #e7e7e7 } .range-slider-handle { display: inline-block; position: absolute; z-index: 1; top: -0.3125rem; width: 2rem; height: 1.375rem; border: 1px solid none; cursor: pointer; background: #2ba6cb } .range-slider-handle:hover { background: #2692b3 } [class*="block-grid-"] { display: block; padding: 0; margin: 0 -0.625rem } [class*="block-grid-"]:before, [class*="block-grid-"]:after { content: " "; display: table } [class*="block-grid-"]:after { clear: both } [class*="block-grid-"]>li { display: block; height: auto; float: left; padding: 0 .625rem 1.25rem } @media only screen { .small-block-grid-1>li { width: 100%; list-style: none } .small-block-grid-1>li:nth-of-type(1n) { clear: none } .small-block-grid-1>li:nth-of-type(1n+1) { clear: both } .small-block-grid-2>li { width: 50%; list-style: none } .small-block-grid-2>li:nth-of-type(1n) { clear: none } .small-block-grid-2>li:nth-of-type(2n+1) { clear: both } .small-block-grid-3>li { width: 33.33333%; list-style: none } .small-block-grid-3>li:nth-of-type(1n) { clear: none } .small-block-grid-3>li:nth-of-type(3n+1) { clear: both } .small-block-grid-4>li { width: 25%; list-style: none } .small-block-grid-4>li:nth-of-type(1n) { clear: none } .small-block-grid-4>li:nth-of-type(4n+1) { clear: both } .small-block-grid-5>li { width: 20%; list-style: none } .small-block-grid-5>li:nth-of-type(1n) { clear: none } .small-block-grid-5>li:nth-of-type(5n+1) { clear: both } .small-block-grid-6>li { width: 16.66667%; list-style: none } .small-block-grid-6>li:nth-of-type(1n) { clear: none } .small-block-grid-6>li:nth-of-type(6n+1) { clear: both } .small-block-grid-7>li { width: 14.28571%; list-style: none } .small-block-grid-7>li:nth-of-type(1n) { clear: none } .small-block-grid-7>li:nth-of-type(7n+1) { clear: both } .small-block-grid-8>li { width: 12.5%; list-style: none } .small-block-grid-8>li:nth-of-type(1n) { clear: none } .small-block-grid-8>li:nth-of-type(8n+1) { clear: both } .small-block-grid-9>li { width: 11.11111%; list-style: none } .small-block-grid-9>li:nth-of-type(1n) { clear: none } .small-block-grid-9>li:nth-of-type(9n+1) { clear: both } .small-block-grid-10>li { width: 10%; list-style: none } .small-block-grid-10>li:nth-of-type(1n) { clear: none } .small-block-grid-10>li:nth-of-type(10n+1) { clear: both } .small-block-grid-11>li { width: 9.09091%; list-style: none } .small-block-grid-11>li:nth-of-type(1n) { clear: none } .small-block-grid-11>li:nth-of-type(11n+1) { clear: both } .small-block-grid-12>li { width: 8.33333%; list-style: none } .small-block-grid-12>li:nth-of-type(1n) { clear: none } .small-block-grid-12>li:nth-of-type(12n+1) { clear: both } } @media only screen and (min-width:40.063em) { .medium-block-grid-1>li { width: 100%; list-style: none } .medium-block-grid-1>li:nth-of-type(1n) { clear: none } .medium-block-grid-1>li:nth-of-type(1n+1) { clear: both } .medium-block-grid-2>li { width: 50%; list-style: none } .medium-block-grid-2>li:nth-of-type(1n) { clear: none } .medium-block-grid-2>li:nth-of-type(2n+1) { clear: both } .medium-block-grid-3>li { width: 33.33333%; list-style: none } .medium-block-grid-3>li:nth-of-type(1n) { clear: none } .medium-block-grid-3>li:nth-of-type(3n+1) { clear: both } .medium-block-grid-4>li { width: 25%; list-style: none } .medium-block-grid-4>li:nth-of-type(1n) { clear: none } .medium-block-grid-4>li:nth-of-type(4n+1) { clear: both } .medium-block-grid-5>li { width: 20%; list-style: none } .medium-block-grid-5>li:nth-of-type(1n) { clear: none } .medium-block-grid-5>li:nth-of-type(5n+1) { clear: both } .medium-block-grid-6>li { width: 16.66667%; list-style: none } .medium-block-grid-6>li:nth-of-type(1n) { clear: none } .medium-block-grid-6>li:nth-of-type(6n+1) { clear: both } .medium-block-grid-7>li { width: 14.28571%; list-style: none } .medium-block-grid-7>li:nth-of-type(1n) { clear: none } .medium-block-grid-7>li:nth-of-type(7n+1) { clear: both } .medium-block-grid-8>li { width: 12.5%; list-style: none } .medium-block-grid-8>li:nth-of-type(1n) { clear: none } .medium-block-grid-8>li:nth-of-type(8n+1) { clear: both } .medium-block-grid-9>li { width: 11.11111%; list-style: none } .medium-block-grid-9>li:nth-of-type(1n) { clear: none } .medium-block-grid-9>li:nth-of-type(9n+1) { clear: both } .medium-block-grid-10>li { width: 10%; list-style: none } .medium-block-grid-10>li:nth-of-type(1n) { clear: none } .medium-block-grid-10>li:nth-of-type(10n+1) { clear: both } .medium-block-grid-11>li { width: 9.09091%; list-style: none } .medium-block-grid-11>li:nth-of-type(1n) { clear: none } .medium-block-grid-11>li:nth-of-type(11n+1) { clear: both } .medium-block-grid-12>li { width: 8.33333%; list-style: none } .medium-block-grid-12>li:nth-of-type(1n) { clear: none } .medium-block-grid-12>li:nth-of-type(12n+1) { clear: both } } @media only screen and (min-width:64.063em) { .large-block-grid-1>li { width: 100%; list-style: none } .large-block-grid-1>li:nth-of-type(1n) { clear: none } .large-block-grid-1>li:nth-of-type(1n+1) { clear: both } .large-block-grid-2>li { width: 50%; list-style: none } .large-block-grid-2>li:nth-of-type(1n) { clear: none } .large-block-grid-2>li:nth-of-type(2n+1) { clear: both } .large-block-grid-3>li { width: 33.33333%; list-style: none } .large-block-grid-3>li:nth-of-type(1n) { clear: none } .large-block-grid-3>li:nth-of-type(3n+1) { clear: both } .large-block-grid-4>li { width: 25%; list-style: none } .large-block-grid-4>li:nth-of-type(1n) { clear: none } .large-block-grid-4>li:nth-of-type(4n+1) { clear: both } .large-block-grid-5>li { width: 20%; list-style: none } .large-block-grid-5>li:nth-of-type(1n) { clear: none } .large-block-grid-5>li:nth-of-type(5n+1) { clear: both } .large-block-grid-6>li { width: 16.66667%; list-style: none } .large-block-grid-6>li:nth-of-type(1n) { clear: none } .large-block-grid-6>li:nth-of-type(6n+1) { clear: both } .large-block-grid-7>li { width: 14.28571%; list-style: none } .large-block-grid-7>li:nth-of-type(1n) { clear: none } .large-block-grid-7>li:nth-of-type(7n+1) { clear: both } .large-block-grid-8>li { width: 12.5%; list-style: none } .large-block-grid-8>li:nth-of-type(1n) { clear: none } .large-block-grid-8>li:nth-of-type(8n+1) { clear: both } .large-block-grid-9>li { width: 11.11111%; list-style: none } .large-block-grid-9>li:nth-of-type(1n) { clear: none } .large-block-grid-9>li:nth-of-type(9n+1) { clear: both } .large-block-grid-10>li { width: 10%; list-style: none } .large-block-grid-10>li:nth-of-type(1n) { clear: none } .large-block-grid-10>li:nth-of-type(10n+1) { clear: both } .large-block-grid-11>li { width: 9.09091%; list-style: none } .large-block-grid-11>li:nth-of-type(1n) { clear: none } .large-block-grid-11>li:nth-of-type(11n+1) { clear: both } .large-block-grid-12>li { width: 8.33333%; list-style: none } .large-block-grid-12>li:nth-of-type(1n) { clear: none } .large-block-grid-12>li:nth-of-type(12n+1) { clear: both } } .flex-video { position: relative; padding-top: 1.5625rem; padding-bottom: 67.5%; height: 0; margin-bottom: 1rem; overflow: hidden } .flex-video.widescreen { padding-bottom: 56.34% } .flex-video.vimeo { padding-top: 0 } .flex-video iframe, .flex-video object, .flex-video embed, .flex-video video { position: absolute; top: 0; left: 0; width: 100%; height: 100% } .keystroke, kbd { background-color: #ededed; border-color: #ddd; color: #222; border-style: solid; border-width: 1px; margin: 0; font-family: "Consolas", "Menlo", "Courier", monospace; font-size: inherit; padding: .125rem .25rem 0; border-radius: 3px } div.switch label { display: block; margin-bottom: 1rem; position: relative; color: transparent; background: #ddd; text-indent: 100%; width: 4rem; height: 2rem; cursor: pointer; transition: left .15s ease-out } div.switch input { display: none } div.switch input+label { margin-left: 0; margin-right: 0 } div.switch label:after { content: ""; display: block; background: #fff; position: absolute; top: .25rem; left: .25rem; width: 1.5rem; height: 1.5rem; -webkit-transition: left .15s ease-out; -moz-transition: left .15s ease-out; transition: left .15s ease-out } div.switch input:checked+label { background: #2ba6cb } div.switch input:checked+label:after { left: 2.25rem } div.switch label { width: 4rem; height: 2rem } div.switch label:after { width: 1.5rem; height: 1.5rem } div.switch input:checked+label:after { left: 2.25rem } div.switch label { color: transparent; background: #ddd } div.switch label:after { background: #fff } div.switch input:checked+label { background: #2ba6cb } div.switch.large label { width: 5rem; height: 2.5rem } div.switch.large label:after { width: 2rem; height: 2rem } div.switch.large input:checked+label:after { left: 2.75rem } div.switch.small label { width: 3.5rem; height: 1.75rem } div.switch.small label:after { width: 1.25rem; height: 1.25rem } div.switch.small input:checked+label:after { left: 2rem } div.switch.tiny label { width: 3rem; height: 1.5rem } div.switch.tiny label:after { width: 1rem; height: 1rem } div.switch.tiny input:checked+label:after { left: 1.75rem } div.switch.radius label { border-radius: 4px } div.switch.radius label:after { border-radius: 3px } div.switch.round { border-radius: 1000px } div.switch.round label { border-radius: 2rem } div.switch.round label:after { border-radius: 2rem } @media only screen { .show-for-small-only, .show-for-small-up, .show-for-small, .show-for-small-down, .hide-for-medium-only, .hide-for-medium-up, .hide-for-medium, .show-for-medium-down, .hide-for-large-only, .hide-for-large-up, .hide-for-large, .show-for-large-down, .hide-for-xlarge-only, .hide-for-xlarge-up, .hide-for-xxlarge-only, .hide-for-xxlarge-up { display: inherit !important } .hide-for-small-only, .hide-for-small-up, .hide-for-small, .hide-for-small-down, .show-for-medium-only, .show-for-medium-up, .show-for-medium, .hide-for-medium-down, .show-for-large-only, .show-for-large-up, .show-for-large, .hide-for-large-down, .show-for-xlarge-only, .show-for-xlarge-up, .show-for-xxlarge-only, .show-for-xxlarge-up { display: none !important } .visible-for-small-only, .visible-for-small-up, .visible-for-small, .visible-for-small-down, .hidden-for-medium-only, .hidden-for-medium-up, .hidden-for-medium, .visible-for-medium-down, .hidden-for-large-only, .hidden-for-large-up, .hidden-for-large, .visible-for-large-down, .hidden-for-xlarge-only, .hidden-for-xlarge-up, .hidden-for-xxlarge-only, .hidden-for-xxlarge-up { position: static !important; height: auto; width: auto; overflow: visible; clip: auto } .hidden-for-small-only, .hidden-for-small-up, .hidden-for-small, .hidden-for-small-down, .visible-for-medium-only, .visible-for-medium-up, .visible-for-medium, .hidden-for-medium-down, .visible-for-large-only, .visible-for-large-up, .visible-for-large, .hidden-for-large-down, .visible-for-xlarge-only, .visible-for-xlarge-up, .visible-for-xxlarge-only, .visible-for-xxlarge-up { position: absolute !important; height: 1px; width: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px) } table.show-for-small-only, table.show-for-small-up, table.show-for-small, table.show-for-small-down, table.hide-for-medium-only, table.hide-for-medium-up, table.hide-for-medium, table.show-for-medium-down, table.hide-for-large-only, table.hide-for-large-up, table.hide-for-large, table.show-for-large-down, table.hide-for-xlarge-only, table.hide-for-xlarge-up, table.hide-for-xxlarge-only, table.hide-for-xxlarge-up { display: table } thead.show-for-small-only, thead.show-for-small-up, thead.show-for-small, thead.show-for-small-down, thead.hide-for-medium-only, thead.hide-for-medium-up, thead.hide-for-medium, thead.show-for-medium-down, thead.hide-for-large-only, thead.hide-for-large-up, thead.hide-for-large, thead.show-for-large-down, thead.hide-for-xlarge-only, thead.hide-for-xlarge-up, thead.hide-for-xxlarge-only, thead.hide-for-xxlarge-up { display: table-header-group !important } tbody.show-for-small-only, tbody.show-for-small-up, tbody.show-for-small, tbody.show-for-small-down, tbody.hide-for-medium-only, tbody.hide-for-medium-up, tbody.hide-for-medium, tbody.show-for-medium-down, tbody.hide-for-large-only, tbody.hide-for-large-up, tbody.hide-for-large, tbody.show-for-large-down, tbody.hide-for-xlarge-only, tbody.hide-for-xlarge-up, tbody.hide-for-xxlarge-only, tbody.hide-for-xxlarge-up { display: table-row-group !important } tr.show-for-small-only, tr.show-for-small-up, tr.show-for-small, tr.show-for-small-down, tr.hide-for-medium-only, tr.hide-for-medium-up, tr.hide-for-medium, tr.show-for-medium-down, tr.hide-for-large-only, tr.hide-for-large-up, tr.hide-for-large, tr.show-for-large-down, tr.hide-for-xlarge-only, tr.hide-for-xlarge-up, tr.hide-for-xxlarge-only, tr.hide-for-xxlarge-up { display: table-row !important } th.show-for-small-only, td.show-for-small-only, th.show-for-small-up, td.show-for-small-up, th.show-for-small, td.show-for-small, th.show-for-small-down, td.show-for-small-down, th.hide-for-medium-only, td.hide-for-medium-only, th.hide-for-medium-up, td.hide-for-medium-up, th.hide-for-medium, td.hide-for-medium, th.show-for-medium-down, td.show-for-medium-down, th.hide-for-large-only, td.hide-for-large-only, th.hide-for-large-up, td.hide-for-large-up, th.hide-for-large, td.hide-for-large, th.show-for-large-down, td.show-for-large-down, th.hide-for-xlarge-only, td.hide-for-xlarge-only, th.hide-for-xlarge-up, td.hide-for-xlarge-up, th.hide-for-xxlarge-only, td.hide-for-xxlarge-only, th.hide-for-xxlarge-up, td.hide-for-xxlarge-up { display: table-cell !important } } @media only screen and (min-width:40.063em) { .hide-for-small-only, .show-for-small-up, .hide-for-small, .hide-for-small-down, .show-for-medium-only, .show-for-medium-up, .show-for-medium, .show-for-medium-down, .hide-for-large-only, .hide-for-large-up, .hide-for-large, .show-for-large-down, .hide-for-xlarge-only, .hide-for-xlarge-up, .hide-for-xxlarge-only, .hide-for-xxlarge-up { display: inherit !important } .show-for-small-only, .hide-for-small-up, .show-for-small, .show-for-small-down, .hide-for-medium-only, .hide-for-medium-up, .hide-for-medium, .hide-for-medium-down, .show-for-large-only, .show-for-large-up, .show-for-large, .hide-for-large-down, .show-for-xlarge-only, .show-for-xlarge-up, .show-for-xxlarge-only, .show-for-xxlarge-up { display: none !important } .hidden-for-small-only, .visible-for-small-up, .hidden-for-small, .hidden-for-small-down, .visible-for-medium-only, .visible-for-medium-up, .visible-for-medium, .visible-for-medium-down, .hidden-for-large-only, .hidden-for-large-up, .hidden-for-large, .visible-for-large-down, .hidden-for-xlarge-only, .hidden-for-xlarge-up, .hidden-for-xxlarge-only, .hidden-for-xxlarge-up { position: static !important; height: auto; width: auto; overflow: visible; clip: auto } .visible-for-small-only, .hidden-for-small-up, .visible-for-small, .visible-for-small-down, .hidden-for-medium-only, .hidden-for-medium-up, .hidden-for-medium, .hidden-for-medium-down, .visible-for-large-only, .visible-for-large-up, .visible-for-large, .hidden-for-large-down, .visible-for-xlarge-only, .visible-for-xlarge-up, .visible-for-xxlarge-only, .visible-for-xxlarge-up { position: absolute !important; height: 1px; width: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px) } table.hide-for-small-only, table.show-for-small-up, table.hide-for-small, table.hide-for-small-down, table.show-for-medium-only, table.show-for-medium-up, table.show-for-medium, table.show-for-medium-down, table.hide-for-large-only, table.hide-for-large-up, table.hide-for-large, table.show-for-large-down, table.hide-for-xlarge-only, table.hide-for-xlarge-up, table.hide-for-xxlarge-only, table.hide-for-xxlarge-up { display: table } thead.hide-for-small-only, thead.show-for-small-up, thead.hide-for-small, thead.hide-for-small-down, thead.show-for-medium-only, thead.show-for-medium-up, thead.show-for-medium, thead.show-for-medium-down, thead.hide-for-large-only, thead.hide-for-large-up, thead.hide-for-large, thead.show-for-large-down, thead.hide-for-xlarge-only, thead.hide-for-xlarge-up, thead.hide-for-xxlarge-only, thead.hide-for-xxlarge-up { display: table-header-group !important } tbody.hide-for-small-only, tbody.show-for-small-up, tbody.hide-for-small, tbody.hide-for-small-down, tbody.show-for-medium-only, tbody.show-for-medium-up, tbody.show-for-medium, tbody.show-for-medium-down, tbody.hide-for-large-only, tbody.hide-for-large-up, tbody.hide-for-large, tbody.show-for-large-down, tbody.hide-for-xlarge-only, tbody.hide-for-xlarge-up, tbody.hide-for-xxlarge-only, tbody.hide-for-xxlarge-up { display: table-row-group !important } tr.hide-for-small-only, tr.show-for-small-up, tr.hide-for-small, tr.hide-for-small-down, tr.show-for-medium-only, tr.show-for-medium-up, tr.show-for-medium, tr.show-for-medium-down, tr.hide-for-large-only, tr.hide-for-large-up, tr.hide-for-large, tr.show-for-large-down, tr.hide-for-xlarge-only, tr.hide-for-xlarge-up, tr.hide-for-xxlarge-only, tr.hide-for-xxlarge-up { display: table-row !important } th.hide-for-small-only, td.hide-for-small-only, th.show-for-small-up, td.show-for-small-up, th.hide-for-small, td.hide-for-small, th.hide-for-small-down, td.hide-for-small-down, th.show-for-medium-only, td.show-for-medium-only, th.show-for-medium-up, td.show-for-medium-up, th.show-for-medium, td.show-for-medium, th.show-for-medium-down, td.show-for-medium-down, th.hide-for-large-only, td.hide-for-large-only, th.hide-for-large-up, td.hide-for-large-up, th.hide-for-large, td.hide-for-large, th.show-for-large-down, td.show-for-large-down, th.hide-for-xlarge-only, td.hide-for-xlarge-only, th.hide-for-xlarge-up, td.hide-for-xlarge-up, th.hide-for-xxlarge-only, td.hide-for-xxlarge-only, th.hide-for-xxlarge-up, td.hide-for-xxlarge-up { display: table-cell !important } } @media only screen and (min-width:64.063em) { .hide-for-small-only, .show-for-small-up, .hide-for-small, .hide-for-small-down, .hide-for-medium-only, .show-for-medium-up, .hide-for-medium, .hide-for-medium-down, .show-for-large-only, .show-for-large-up, .show-for-large, .show-for-large-down, .hide-for-xlarge-only, .hide-for-xlarge-up, .hide-for-xxlarge-only, .hide-for-xxlarge-up { display: inherit !important } .show-for-small-only, .hide-for-small-up, .show-for-small, .show-for-small-down, .show-for-medium-only, .hide-for-medium-up, .show-for-medium, .show-for-medium-down, .hide-for-large-only, .hide-for-large-up, .hide-for-large, .hide-for-large-down, .show-for-xlarge-only, .show-for-xlarge-up, .show-for-xxlarge-only, .show-for-xxlarge-up { display: none !important } .hidden-for-small-only, .visible-for-small-up, .hidden-for-small, .hidden-for-small-down, .hidden-for-medium-only, .visible-for-medium-up, .hidden-for-medium, .hidden-for-medium-down, .visible-for-large-only, .visible-for-large-up, .visible-for-large, .visible-for-large-down, .hidden-for-xlarge-only, .hidden-for-xlarge-up, .hidden-for-xxlarge-only, .hidden-for-xxlarge-up { position: static !important; height: auto; width: auto; overflow: visible; clip: auto } .visible-for-small-only, .hidden-for-small-up, .visible-for-small, .visible-for-small-down, .visible-for-medium-only, .hidden-for-medium-up, .visible-for-medium, .visible-for-medium-down, .hidden-for-large-only, .hidden-for-large-up, .hidden-for-large, .hidden-for-large-down, .visible-for-xlarge-only, .visible-for-xlarge-up, .visible-for-xxlarge-only, .visible-for-xxlarge-up { position: absolute !important; height: 1px; width: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px) } table.hide-for-small-only, table.show-for-small-up, table.hide-for-small, table.hide-for-small-down, table.hide-for-medium-only, table.show-for-medium-up, table.hide-for-medium, table.hide-for-medium-down, table.show-for-large-only, table.show-for-large-up, table.show-for-large, table.show-for-large-down, table.hide-for-xlarge-only, table.hide-for-xlarge-up, table.hide-for-xxlarge-only, table.hide-for-xxlarge-up { display: table } thead.hide-for-small-only, thead.show-for-small-up, thead.hide-for-small, thead.hide-for-small-down, thead.hide-for-medium-only, thead.show-for-medium-up, thead.hide-for-medium, thead.hide-for-medium-down, thead.show-for-large-only, thead.show-for-large-up, thead.show-for-large, thead.show-for-large-down, thead.hide-for-xlarge-only, thead.hide-for-xlarge-up, thead.hide-for-xxlarge-only, thead.hide-for-xxlarge-up { display: table-header-group !important } tbody.hide-for-small-only, tbody.show-for-small-up, tbody.hide-for-small, tbody.hide-for-small-down, tbody.hide-for-medium-only, tbody.show-for-medium-up, tbody.hide-for-medium, tbody.hide-for-medium-down, tbody.show-for-large-only, tbody.show-for-large-up, tbody.show-for-large, tbody.show-for-large-down, tbody.hide-for-xlarge-only, tbody.hide-for-xlarge-up, tbody.hide-for-xxlarge-only, tbody.hide-for-xxlarge-up { display: table-row-group !important } tr.hide-for-small-only, tr.show-for-small-up, tr.hide-for-small, tr.hide-for-small-down, tr.hide-for-medium-only, tr.show-for-medium-up, tr.hide-for-medium, tr.hide-for-medium-down, tr.show-for-large-only, tr.show-for-large-up, tr.show-for-large, tr.show-for-large-down, tr.hide-for-xlarge-only, tr.hide-for-xlarge-up, tr.hide-for-xxlarge-only, tr.hide-for-xxlarge-up { display: table-row !important } th.hide-for-small-only, td.hide-for-small-only, th.show-for-small-up, td.show-for-small-up, th.hide-for-small, td.hide-for-small, th.hide-for-small-down, td.hide-for-small-down, th.hide-for-medium-only, td.hide-for-medium-only, th.show-for-medium-up, td.show-for-medium-up, th.hide-for-medium, td.hide-for-medium, th.hide-for-medium-down, td.hide-for-medium-down, th.show-for-large-only, td.show-for-large-only, th.show-for-large-up, td.show-for-large-up, th.show-for-large, td.show-for-large, th.show-for-large-down, td.show-for-large-down, th.hide-for-xlarge-only, td.hide-for-xlarge-only, th.hide-for-xlarge-up, td.hide-for-xlarge-up, th.hide-for-xxlarge-only, td.hide-for-xxlarge-only, th.hide-for-xxlarge-up, td.hide-for-xxlarge-up { display: table-cell !important } } @media only screen and (min-width:90.063em) { .hide-for-small-only, .show-for-small-up, .hide-for-small, .hide-for-small-down, .hide-for-medium-only, .show-for-medium-up, .hide-for-medium, .hide-for-medium-down, .hide-for-large-only, .show-for-large-up, .hide-for-large, .hide-for-large-down, .show-for-xlarge-only, .show-for-xlarge-up, .hide-for-xxlarge-only, .hide-for-xxlarge-up { display: inherit !important } .show-for-small-only, .hide-for-small-up, .show-for-small, .show-for-small-down, .show-for-medium-only, .hide-for-medium-up, .show-for-medium, .show-for-medium-down, .show-for-large-only, .hide-for-large-up, .show-for-large, .show-for-large-down, .hide-for-xlarge-only, .hide-for-xlarge-up, .show-for-xxlarge-only, .show-for-xxlarge-up { display: none !important } .hidden-for-small-only, .visible-for-small-up, .hidden-for-small, .hidden-for-small-down, .hidden-for-medium-only, .visible-for-medium-up, .hidden-for-medium, .hidden-for-medium-down, .hidden-for-large-only, .visible-for-large-up, .hidden-for-large, .hidden-for-large-down, .visible-for-xlarge-only, .visible-for-xlarge-up, .hidden-for-xxlarge-only, .hidden-for-xxlarge-up { position: static !important; height: auto; width: auto; overflow: visible; clip: auto } .visible-for-small-only, .hidden-for-small-up, .visible-for-small, .visible-for-small-down, .visible-for-medium-only, .hidden-for-medium-up, .visible-for-medium, .visible-for-medium-down, .visible-for-large-only, .hidden-for-large-up, .visible-for-large, .visible-for-large-down, .hidden-for-xlarge-only, .hidden-for-xlarge-up, .visible-for-xxlarge-only, .visible-for-xxlarge-up { position: absolute !important; height: 1px; width: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px) } table.hide-for-small-only, table.show-for-small-up, table.hide-for-small, table.hide-for-small-down, table.hide-for-medium-only, table.show-for-medium-up, table.hide-for-medium, table.hide-for-medium-down, table.hide-for-large-only, table.show-for-large-up, table.hide-for-large, table.hide-for-large-down, table.show-for-xlarge-only, table.show-for-xlarge-up, table.hide-for-xxlarge-only, table.hide-for-xxlarge-up { display: table } thead.hide-for-small-only, thead.show-for-small-up, thead.hide-for-small, thead.hide-for-small-down, thead.hide-for-medium-only, thead.show-for-medium-up, thead.hide-for-medium, thead.hide-for-medium-down, thead.hide-for-large-only, thead.show-for-large-up, thead.hide-for-large, thead.hide-for-large-down, thead.show-for-xlarge-only, thead.show-for-xlarge-up, thead.hide-for-xxlarge-only, thead.hide-for-xxlarge-up { display: table-header-group !important } tbody.hide-for-small-only, tbody.show-for-small-up, tbody.hide-for-small, tbody.hide-for-small-down, tbody.hide-for-medium-only, tbody.show-for-medium-up, tbody.hide-for-medium, tbody.hide-for-medium-down, tbody.hide-for-large-only, tbody.show-for-large-up, tbody.hide-for-large, tbody.hide-for-large-down, tbody.show-for-xlarge-only, tbody.show-for-xlarge-up, tbody.hide-for-xxlarge-only, tbody.hide-for-xxlarge-up { display: table-row-group !important } tr.hide-for-small-only, tr.show-for-small-up, tr.hide-for-small, tr.hide-for-small-down, tr.hide-for-medium-only, tr.show-for-medium-up, tr.hide-for-medium, tr.hide-for-medium-down, tr.hide-for-large-only, tr.show-for-large-up, tr.hide-for-large, tr.hide-for-large-down, tr.show-for-xlarge-only, tr.show-for-xlarge-up, tr.hide-for-xxlarge-only, tr.hide-for-xxlarge-up { display: table-row !important } th.hide-for-small-only, td.hide-for-small-only, th.show-for-small-up, td.show-for-small-up, th.hide-for-small, td.hide-for-small, th.hide-for-small-down, td.hide-for-small-down, th.hide-for-medium-only, td.hide-for-medium-only, th.show-for-medium-up, td.show-for-medium-up, th.hide-for-medium, td.hide-for-medium, th.hide-for-medium-down, td.hide-for-medium-down, th.hide-for-large-only, td.hide-for-large-only, th.show-for-large-up, td.show-for-large-up, th.hide-for-large, td.hide-for-large, th.hide-for-large-down, td.hide-for-large-down, th.show-for-xlarge-only, td.show-for-xlarge-only, th.show-for-xlarge-up, td.show-for-xlarge-up, th.hide-for-xxlarge-only, td.hide-for-xxlarge-only, th.hide-for-xxlarge-up, td.hide-for-xxlarge-up { display: table-cell !important } } @media only screen and (min-width:120.063em) { .hide-for-small-only, .show-for-small-up, .hide-for-small, .hide-for-small-down, .hide-for-medium-only, .show-for-medium-up, .hide-for-medium, .hide-for-medium-down, .hide-for-large-only, .show-for-large-up, .hide-for-large, .hide-for-large-down, .hide-for-xlarge-only, .show-for-xlarge-up, .show-for-xxlarge-only, .show-for-xxlarge-up { display: inherit !important } .show-for-small-only, .hide-for-small-up, .show-for-small, .show-for-small-down, .show-for-medium-only, .hide-for-medium-up, .show-for-medium, .show-for-medium-down, .show-for-large-only, .hide-for-large-up, .show-for-large, .show-for-large-down, .show-for-xlarge-only, .hide-for-xlarge-up, .hide-for-xxlarge-only, .hide-for-xxlarge-up { display: none !important } .hidden-for-small-only, .visible-for-small-up, .hidden-for-small, .hidden-for-small-down, .hidden-for-medium-only, .visible-for-medium-up, .hidden-for-medium, .hidden-for-medium-down, .hidden-for-large-only, .visible-for-large-up, .hidden-for-large, .hidden-for-large-down, .hidden-for-xlarge-only, .visible-for-xlarge-up, .visible-for-xxlarge-only, .visible-for-xxlarge-up { position: static !important; height: auto; width: auto; overflow: visible; clip: auto } .visible-for-small-only, .hidden-for-small-up, .visible-for-small, .visible-for-small-down, .visible-for-medium-only, .hidden-for-medium-up, .visible-for-medium, .visible-for-medium-down, .visible-for-large-only, .hidden-for-large-up, .visible-for-large, .visible-for-large-down, .visible-for-xlarge-only, .hidden-for-xlarge-up, .hidden-for-xxlarge-only, .hidden-for-xxlarge-up { position: absolute !important; height: 1px; width: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px) } table.hide-for-small-only, table.show-for-small-up, table.hide-for-small, table.hide-for-small-down, table.hide-for-medium-only, table.show-for-medium-up, table.hide-for-medium, table.hide-for-medium-down, table.hide-for-large-only, table.show-for-large-up, table.hide-for-large, table.hide-for-large-down, table.hide-for-xlarge-only, table.show-for-xlarge-up, table.show-for-xxlarge-only, table.show-for-xxlarge-up { display: table } thead.hide-for-small-only, thead.show-for-small-up, thead.hide-for-small, thead.hide-for-small-down, thead.hide-for-medium-only, thead.show-for-medium-up, thead.hide-for-medium, thead.hide-for-medium-down, thead.hide-for-large-only, thead.show-for-large-up, thead.hide-for-large, thead.hide-for-large-down, thead.hide-for-xlarge-only, thead.show-for-xlarge-up, thead.show-for-xxlarge-only, thead.show-for-xxlarge-up { display: table-header-group !important } tbody.hide-for-small-only, tbody.show-for-small-up, tbody.hide-for-small, tbody.hide-for-small-down, tbody.hide-for-medium-only, tbody.show-for-medium-up, tbody.hide-for-medium, tbody.hide-for-medium-down, tbody.hide-for-large-only, tbody.show-for-large-up, tbody.hide-for-large, tbody.hide-for-large-down, tbody.hide-for-xlarge-only, tbody.show-for-xlarge-up, tbody.show-for-xxlarge-only, tbody.show-for-xxlarge-up { display: table-row-group !important } tr.hide-for-small-only, tr.show-for-small-up, tr.hide-for-small, tr.hide-for-small-down, tr.hide-for-medium-only, tr.show-for-medium-up, tr.hide-for-medium, tr.hide-for-medium-down, tr.hide-for-large-only, tr.show-for-large-up, tr.hide-for-large, tr.hide-for-large-down, tr.hide-for-xlarge-only, tr.show-for-xlarge-up, tr.show-for-xxlarge-only, tr.show-for-xxlarge-up { display: table-row !important } th.hide-for-small-only, td.hide-for-small-only, th.show-for-small-up, td.show-for-small-up, th.hide-for-small, td.hide-for-small, th.hide-for-small-down, td.hide-for-small-down, th.hide-for-medium-only, td.hide-for-medium-only, th.show-for-medium-up, td.show-for-medium-up, th.hide-for-medium, td.hide-for-medium, th.hide-for-medium-down, td.hide-for-medium-down, th.hide-for-large-only, td.hide-for-large-only, th.show-for-large-up, td.show-for-large-up, th.hide-for-large, td.hide-for-large, th.hide-for-large-down, td.hide-for-large-down, th.hide-for-xlarge-only, td.hide-for-xlarge-only, th.show-for-xlarge-up, td.show-for-xlarge-up, th.show-for-xxlarge-only, td.show-for-xxlarge-only, th.show-for-xxlarge-up, td.show-for-xxlarge-up { display: table-cell !important } } .show-for-landscape, .hide-for-portrait { display: inherit !important } .hide-for-landscape, .show-for-portrait { display: none !important } table.hide-for-landscape, table.show-for-portrait { display: table } thead.hide-for-landscape, thead.show-for-portrait { display: table-header-group !important } tbody.hide-for-landscape, tbody.show-for-portrait { display: table-row-group !important } tr.hide-for-landscape, tr.show-for-portrait { display: table-row !important } td.hide-for-landscape, td.show-for-portrait, th.hide-for-landscape, th.show-for-portrait { display: table-cell !important } @media only screen and (orientation:landscape) { .show-for-landscape, .hide-for-portrait { display: inherit !important } .hide-for-landscape, .show-for-portrait { display: none !important } table.show-for-landscape, table.hide-for-portrait { display: table } thead.show-for-landscape, thead.hide-for-portrait { display: table-header-group !important } tbody.show-for-landscape, tbody.hide-for-portrait { display: table-row-group !important } tr.show-for-landscape, tr.hide-for-portrait { display: table-row !important } td.show-for-landscape, td.hide-for-portrait, th.show-for-landscape, th.hide-for-portrait { display: table-cell !important } } @media only screen and (orientation:portrait) { .show-for-portrait, .hide-for-landscape { display: inherit !important } .hide-for-portrait, .show-for-landscape { display: none !important } table.show-for-portrait, table.hide-for-landscape { display: table } thead.show-for-portrait, thead.hide-for-landscape { display: table-header-group !important } tbody.show-for-portrait, tbody.hide-for-landscape { display: table-row-group !important } tr.show-for-portrait, tr.hide-for-landscape { display: table-row !important } td.show-for-portrait, td.hide-for-landscape, th.show-for-portrait, th.hide-for-landscape { display: table-cell !important } } .show-for-touch { display: none !important } .hide-for-touch { display: inherit !important } .touch .show-for-touch { display: inherit !important } .touch .hide-for-touch { display: none !important } table.hide-for-touch { display: table } .touch table.show-for-touch { display: table } thead.hide-for-touch { display: table-header-group !important } .touch thead.show-for-touch { display: table-header-group !important } tbody.hide-for-touch { display: table-row-group !important } .touch tbody.show-for-touch { display: table-row-group !important } tr.hide-for-touch { display: table-row !important } .touch tr.show-for-touch { display: table-row !important } td.hide-for-touch { display: table-cell !important } .touch td.show-for-touch { display: table-cell !important } th.hide-for-touch { display: table-cell !important } .touch th.show-for-touch { display: table-cell !important } @media print { .show-for-print { display: block } .hide-for-print { display: none } table.show-for-print { display: table } thead.show-for-print { display: table-header-group !important } tbody.show-for-print { display: table-row-group !important } tr.show-for-print { display: table-row !important } td.show-for-print { display: table-cell !important } th.show-for-print { display: table-cell !important } } /*! normalize.css v3.0.1 | MIT License | git.io/normalize */ html { font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100% } body { margin: 0 } article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block } audio, canvas, progress, video { display: inline-block; vertical-align: baseline } audio:not([controls]) { display: none; height: 0 } [hidden], template { display: none } a { background: transparent } a:active, a:hover { outline: 0 } abbr[title] { border-bottom: 1px dotted } b, strong { font-weight: bold } dfn { font-style: italic } h1 { font-size: 2em; margin: .67em 0 } mark { background: #ff0; color: #000 } small { font-size: 80% } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline } sup { top: -0.5em } sub { bottom: -0.25em } img { border: 0 } svg:not(:root) { overflow: hidden } figure { margin: 1em 40px } hr { -moz-box-sizing: content-box; box-sizing: content-box; height: 0 } pre { overflow: auto } code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em } button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0 } button { overflow: visible } button, select { text-transform: none } button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer } button[disabled], html input[disabled] { cursor: default } button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0 } input { line-height: normal } input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0 } input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto } input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none } fieldset { border: 1px solid silver; margin: 0 2px; padding: .35em .625em .75em } legend { border: 0; padding: 0 } textarea { overflow: auto } optgroup { font-weight: bold } table { border-collapse: collapse; border-spacing: 0 } td, th { padding: 0 } .dl-menuwrapper { width: 100%; max-width: 300px; float: left; position: relative; -webkit-perspective: 1000px; perspective: 1000px; -webkit-perspective-origin: 50% 200%; perspective-origin: 50% 200% } .dl-menuwrapper:first-child { margin-right: 100px } .dl-menuwrapper button { background: #ccc; border: 0; width: 48px; height: 45px; text-indent: -900em; overflow: hidden; position: relative; cursor: pointer; outline: 0 } .dl-menuwrapper button:hover, .dl-menuwrapper button.dl-active, .dl-menuwrapper ul { background: #aaa } .dl-menuwrapper button:after { content: ''; position: absolute; width: 68%; height: 5px; background: #fff; top: 10px; left: 16%; box-shadow: 0 10px 0 #fff, 0 20px 0 #fff } .dl-menuwrapper ul { padding: 0; list-style: none; -webkit-transform-style: preserve-3d; transform-style: preserve-3d } .dl-menuwrapper li { position: relative } .dl-menuwrapper li a { display: block; position: relative; padding: 15px 20px; font-size: 16px; line-height: 20px; font-weight: 300; color: #fff; outline: 0 } .no-touch .dl-menuwrapper li a:hover { background: rgba(255, 248, 213, 0.1) } .dl-menuwrapper li.dl-back>a { padding-left: 30px; background: rgba(0, 0, 0, 0.1) } .dl-menuwrapper li.dl-back:after, .dl-menuwrapper li>a:not(:only-child):after { position: absolute; top: 0; line-height: 50px; font-family: 'icomoon'; speak: none; -webkit-font-smoothing: antialiased; content: "\e000" } .dl-menuwrapper li.dl-back:after { left: 10px; color: rgba(212, 204, 198, 0.3); -webkit-transform: rotate(180deg); transform: rotate(180deg) } .dl-menuwrapper li>a:after { right: 10px; color: rgba(0, 0, 0, 0.15) } .dl-menuwrapper .dl-menu { margin: 5px 0 0 0; position: absolute; width: 100%; opacity: 0; pointer-events: none; -webkit-transform: translateY(10px); transform: translateY(10px); -webkit-backface-visibility: hidden; backface-visibility: hidden } .dl-menuwrapper .dl-menu.dl-menu-toggle { transition: all .3s ease } .dl-menuwrapper .dl-menu.dl-menuopen { opacity: 1; pointer-events: auto; -webkit-transform: translateY(0px); transform: translateY(0px) } .dl-menuwrapper li .dl-submenu { display: none } .dl-menu.dl-subview li, .dl-menu.dl-subview li.dl-subviewopen>a, .dl-menu.dl-subview li.dl-subview>a { display: none } .dl-menu.dl-subview li.dl-subview, .dl-menu.dl-subview li.dl-subview .dl-submenu, .dl-menu.dl-subview li.dl-subviewopen, .dl-menu.dl-subview li.dl-subviewopen>.dl-submenu, .dl-menu.dl-subview li.dl-subviewopen>.dl-submenu>li { display: block } .dl-menuwrapper>.dl-submenu { position: absolute; width: 100%; top: 50px; left: 0; margin: 0 } .dl-menu.dl-animate-out-1 { -webkit-animation: MenuAnimOut1 .4s; animation: MenuAnimOut1 .4s } .dl-menu.dl-animate-out-2 { -webkit-animation: MenuAnimOut2 .3s ease-in-out; animation: MenuAnimOut2 .3s ease-in-out } .dl-menu.dl-animate-out-3 { -webkit-animation: MenuAnimOut3 .4s ease; animation: MenuAnimOut3 .4s ease } .dl-menu.dl-animate-out-4 { -webkit-animation: MenuAnimOut4 .4s ease; animation: MenuAnimOut4 .4s ease } .dl-menu.dl-animate-out-5 { -webkit-animation: MenuAnimOut5 .4s ease; animation: MenuAnimOut5 .4s ease } @-webkit-keyframes MenuAnimOut1 { 50% { -webkit-transform: translateZ(-250px) rotateY(30deg) } 75% { -webkit-transform: translateZ(-372.5px) rotateY(15deg); opacity: .5 } 100% { -webkit-transform: translateZ(-500px) rotateY(0deg); opacity: 0 } } @-webkit-keyframes MenuAnimOut2 { 100% { -webkit-transform: translateX(-100%); opacity: 0 } } @-webkit-keyframes MenuAnimOut3 { 100% { -webkit-transform: translateZ(300px); opacity: 0 } } @-webkit-keyframes MenuAnimOut4 { 100% { -webkit-transform: translateZ(-300px); opacity: 0 } } @-webkit-keyframes MenuAnimOut5 { 100% { -webkit-transform: translateY(40%); opacity: 0 } } @keyframes MenuAnimOut1 { 50% { -webkit-transform: translateZ(-250px) rotateY(30deg); transform: translateZ(-250px) rotateY(30deg) } 75% { -webkit-transform: translateZ(-372.5px) rotateY(15deg); transform: translateZ(-372.5px) rotateY(15deg); opacity: .5 } 100% { -webkit-transform: translateZ(-500px) rotateY(0deg); transform: translateZ(-500px) rotateY(0deg); opacity: 0 } } @keyframes MenuAnimOut2 { 100% { -webkit-transform: translateX(-100%); transform: translateX(-100%); opacity: 0 } } @keyframes MenuAnimOut3 { 100% { -webkit-transform: translateZ(300px); transform: translateZ(300px); opacity: 0 } } @keyframes MenuAnimOut4 { 100% { -webkit-transform: translateZ(-300px); transform: translateZ(-300px); opacity: 0 } } @keyframes MenuAnimOut5 { 100% { -webkit-transform: translateY(40%); transform: translateY(40%); opacity: 0 } } .dl-menu.dl-animate-in-1 { -webkit-animation: MenuAnimIn1 .3s; animation: MenuAnimIn1 .3s } .dl-menu.dl-animate-in-2 { -webkit-animation: MenuAnimIn2 .3s ease-in-out; animation: MenuAnimIn2 .3s ease-in-out } .dl-menu.dl-animate-in-3 { -webkit-animation: MenuAnimIn3 .4s ease; animation: MenuAnimIn3 .4s ease } .dl-menu.dl-animate-in-4 { -webkit-animation: MenuAnimIn4 .4s ease; animation: MenuAnimIn4 .4s ease } .dl-menu.dl-animate-in-5 { -webkit-animation: MenuAnimIn5 .4s ease; animation: MenuAnimIn5 .4s ease } @-webkit-keyframes MenuAnimIn1 { 0% { -webkit-transform: translateZ(-500px) rotateY(0deg); opacity: 0 } 20% { -webkit-transform: translateZ(-250px) rotateY(30deg); opacity: .5 } 100% { -webkit-transform: translateZ(0px) rotateY(0deg); opacity: 1 } } @-webkit-keyframes MenuAnimIn2 { 0% { -webkit-transform: translateX(-100%); opacity: 0 } 100% { -webkit-transform: translateX(0px); opacity: 1 } } @-webkit-keyframes MenuAnimIn3 { 0% { -webkit-transform: translateZ(300px); opacity: 0 } 100% { -webkit-transform: translateZ(0px); opacity: 1 } } @-webkit-keyframes MenuAnimIn4 { 0% { -webkit-transform: translateZ(-300px); opacity: 0 } 100% { -webkit-transform: translateZ(0px); opacity: 1 } } @-webkit-keyframes MenuAnimIn5 { 0% { -webkit-transform: translateY(40%); opacity: 0 } 100% { -webkit-transform: translateY(0); opacity: 1 } } @keyframes MenuAnimIn1 { 0% { -webkit-transform: translateZ(-500px) rotateY(0deg); transform: translateZ(-500px) rotateY(0deg); opacity: 0 } 20% { -webkit-transform: translateZ(-250px) rotateY(30deg); transform: translateZ(-250px) rotateY(30deg); opacity: .5 } 100% { -webkit-transform: translateZ(0px) rotateY(0deg); transform: translateZ(0px) rotateY(0deg); opacity: 1 } } @keyframes MenuAnimIn2 { 0% { -webkit-transform: translateX(-100%); transform: translateX(-100%); opacity: 0 } 100% { -webkit-transform: translateX(0px); transform: translateX(0px); opacity: 1 } } @keyframes MenuAnimIn3 { 0% { -webkit-transform: translateZ(300px); transform: translateZ(300px); opacity: 0 } 100% { -webkit-transform: translateZ(0px); transform: translateZ(0px); opacity: 1 } } @keyframes MenuAnimIn4 { 0% { -webkit-transform: translateZ(-300px); transform: translateZ(-300px); opacity: 0 } 100% { -webkit-transform: translateZ(0px); transform: translateZ(0px); opacity: 1 } } @keyframes MenuAnimIn5 { 0% { -webkit-transform: translateY(40%); transform: translateY(40%); opacity: 0 } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1 } } .dl-menuwrapper>.dl-submenu.dl-animate-in-1 { -webkit-animation: SubMenuAnimIn1 .4s ease; animation: SubMenuAnimIn1 .4s ease } .dl-menuwrapper>.dl-submenu.dl-animate-in-2 { -webkit-animation: SubMenuAnimIn2 .3s ease-in-out; animation: SubMenuAnimIn2 .3s ease-in-out } .dl-menuwrapper>.dl-submenu.dl-animate-in-3 { -webkit-animation: SubMenuAnimIn3 .4s ease; animation: SubMenuAnimIn3 .4s ease } .dl-menuwrapper>.dl-submenu.dl-animate-in-4 { -webkit-animation: SubMenuAnimIn4 .4s ease; animation: SubMenuAnimIn4 .4s ease } .dl-menuwrapper>.dl-submenu.dl-animate-in-5 { -webkit-animation: SubMenuAnimIn5 .4s ease; animation: SubMenuAnimIn5 .4s ease } @-webkit-keyframes SubMenuAnimIn1 { 0% { -webkit-transform: translateX(50%); opacity: 0 } 100% { -webkit-transform: translateX(0px); opacity: 1 } } @-webkit-keyframes SubMenuAnimIn2 { 0% { -webkit-transform: translateX(100%); opacity: 0 } 100% { -webkit-transform: translateX(0px); opacity: 1 } } @-webkit-keyframes SubMenuAnimIn3 { 0% { -webkit-transform: translateZ(-300px); opacity: 0 } 100% { -webkit-transform: translateZ(0px); opacity: 1 } } @-webkit-keyframes SubMenuAnimIn4 { 0% { -webkit-transform: translateZ(300px); opacity: 0 } 100% { -webkit-transform: translateZ(0px); opacity: 1 } } @-webkit-keyframes SubMenuAnimIn5 { 0% { -webkit-transform: translateZ(-200px); opacity: 0 } 100% { -webkit-transform: translateZ(0); opacity: 1 } } @keyframes SubMenuAnimIn1 { 0% { -webkit-transform: translateX(50%); transform: translateX(50%); opacity: 0 } 100% { -webkit-transform: translateX(0px); transform: translateX(0px); opacity: 1 } } @keyframes SubMenuAnimIn2 { 0% { -webkit-transform: translateX(100%); transform: translateX(100%); opacity: 0 } 100% { -webkit-transform: translateX(0px); transform: translateX(0px); opacity: 1 } } @keyframes SubMenuAnimIn3 { 0% { -webkit-transform: translateZ(-300px); transform: translateZ(-300px); opacity: 0 } 100% { -webkit-transform: translateZ(0px); transform: translateZ(0px); opacity: 1 } } @keyframes SubMenuAnimIn4 { 0% { -webkit-transform: translateZ(300px); transform: translateZ(300px); opacity: 0 } 100% { -webkit-transform: translateZ(0px); transform: translateZ(0px); opacity: 1 } } @keyframes SubMenuAnimIn5 { 0% { -webkit-transform: translateZ(-200px); transform: translateZ(-200px); opacity: 0 } 100% { -webkit-transform: translateZ(0); transform: translateZ(0); opacity: 1 } } .dl-menuwrapper>.dl-submenu.dl-animate-out-1 { -webkit-animation: SubMenuAnimOut1 .4s ease; animation: SubMenuAnimOut1 .4s ease } .dl-menuwrapper>.dl-submenu.dl-animate-out-2 { -webkit-animation: SubMenuAnimOut2 .3s ease-in-out; animation: SubMenuAnimOut2 .3s ease-in-out } .dl-menuwrapper>.dl-submenu.dl-animate-out-3 { -webkit-animation: SubMenuAnimOut3 .4s ease; animation: SubMenuAnimOut3 .4s ease } .dl-menuwrapper>.dl-submenu.dl-animate-out-4 { -webkit-animation: SubMenuAnimOut4 .4s ease; animation: SubMenuAnimOut4 .4s ease } .dl-menuwrapper>.dl-submenu.dl-animate-out-5 { -webkit-animation: SubMenuAnimOut5 .4s ease; animation: SubMenuAnimOut5 .4s ease } @-webkit-keyframes SubMenuAnimOut1 { 0% { -webkit-transform: translateX(0%); opacity: 1 } 100% { -webkit-transform: translateX(50%); opacity: 0 } } @-webkit-keyframes SubMenuAnimOut2 { 0% { -webkit-transform: translateX(0%); opacity: 1 } 100% { -webkit-transform: translateX(100%); opacity: 0 } } @-webkit-keyframes SubMenuAnimOut3 { 0% { -webkit-transform: translateZ(0px); opacity: 1 } 100% { -webkit-transform: translateZ(-300px); opacity: 0 } } @-webkit-keyframes SubMenuAnimOut4 { 0% { -webkit-transform: translateZ(0px); opacity: 1 } 100% { -webkit-transform: translateZ(300px); opacity: 0 } } @-webkit-keyframes SubMenuAnimOut5 { 0% { -webkit-transform: translateZ(0); opacity: 1 } 100% { -webkit-transform: translateZ(-200px); opacity: 0 } } @keyframes SubMenuAnimOut1 { 0% { -webkit-transform: translateX(0%); transform: translateX(0%); opacity: 1 } 100% { -webkit-transform: translateX(50%); transform: translateX(50%); opacity: 0 } } @keyframes SubMenuAnimOut2 { 0% { -webkit-transform: translateX(0%); transform: translateX(0%); opacity: 1 } 100% { -webkit-transform: translateX(100%); transform: translateX(100%); opacity: 0 } } @keyframes SubMenuAnimOut3 { 0% { -webkit-transform: translateZ(0px); transform: translateZ(0px); opacity: 1 } 100% { -webkit-transform: translateZ(-300px); transform: translateZ(-300px); opacity: 0 } } @keyframes SubMenuAnimOut4 { 0% { -webkit-transform: translateZ(0px); transform: translateZ(0px); opacity: 1 } 100% { -webkit-transform: translateZ(300px); transform: translateZ(300px); opacity: 0 } } @keyframes SubMenuAnimOut5 { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); opacity: 1 } 100% { -webkit-transform: translateZ(-200px); transform: translateZ(-200px); opacity: 0 } } .no-js .dl-menuwrapper .dl-menu { position: relative; opacity: 1; -webkit-transform: none; transform: none } .no-js .dl-menuwrapper li .dl-submenu { display: block } .no-js .dl-menuwrapper li.dl-back { display: none } .no-js .dl-menuwrapper li>a:not(:only-child) { background: rgba(0, 0, 0, 0.1) } .no-js .dl-menuwrapper li>a:not(:only-child):after { content: '' } .demo-1 .dl-menuwrapper button { background: #c62860 } .demo-1 .dl-menuwrapper button:hover, .demo-1 .dl-menuwrapper button.dl-active, .demo-1 .dl-menuwrapper ul { background: #9e1847 } .demo-2 .dl-menuwrapper button { background: #e86814 } .demo-2 .dl-menuwrapper button:hover, .demo-2 .dl-menuwrapper button.dl-active, .demo-2 .dl-menuwrapper ul { background: #d35400 } .demo-3 .dl-menuwrapper button { background: #08cbc4 } .demo-3 .dl-menuwrapper button:hover, .demo-3 .dl-menuwrapper button.dl-active, .demo-3 .dl-menuwrapper ul { background: #00b4ae } .demo-4 .dl-menuwrapper button { background: #90b912 } .demo-4 .dl-menuwrapper button:hover, .demo-4 .dl-menuwrapper button.dl-active, .demo-4 .dl-menuwrapper ul { background: #79a002 } .demo-5 .dl-menuwrapper button { background: #744783 } .demo-5 .dl-menuwrapper button:hover, .demo-5 .dl-menuwrapper button.dl-active, .demo-5 .dl-menuwrapper ul { background: #643771 } @-webkit-keyframes bounce { 0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0) } 40% { -webkit-transform: translateY(-30px) } 60% { -webkit-transform: translateY(-15px) } } @-moz-keyframes bounce { 0%, 20%, 50%, 80%, 100% { -moz-transform: translateY(0) } 40% { -moz-transform: translateY(-30px) } 60% { -moz-transform: translateY(-15px) } } @-o-keyframes bounce { 0%, 20%, 50%, 80%, 100% { -o-transform: translateY(0) } 40% { -o-transform: translateY(-30px) } 60% { -o-transform: translateY(-15px) } } @keyframes bounce { 0%, 20%, 50%, 80%, 100% { transform: translateY(0) } 40% { transform: translateY(-30px) } 60% { transform: translateY(-15px) } } @-webkit-keyframes tada { 0% { -webkit-transform: scale(1) } 10%, 20% { -webkit-transform: scale(0.9) rotate(-3deg) } 30%, 50%, 70%, 90% { -webkit-transform: scale(1.1) rotate(3deg) } 40%, 60%, 80% { -webkit-transform: scale(1.1) rotate(-3deg) } 100% { -webkit-transform: scale(1) rotate(0) } } @-moz-keyframes tada { 0% { -moz-transform: scale(1) } 10%, 20% { -moz-transform: scale(0.9) rotate(-3deg) } 30%, 50%, 70%, 90% { -moz-transform: scale(1.1) rotate(3deg) } 40%, 60%, 80% { -moz-transform: scale(1.1) rotate(-3deg) } 100% { -moz-transform: scale(1) rotate(0) } } @-o-keyframes tada { 0% { -o-transform: scale(1) } 10%, 20% { -o-transform: scale(0.9) rotate(-3deg) } 30%, 50%, 70%, 90% { -o-transform: scale(1.1) rotate(3deg) } 40%, 60%, 80% { -o-transform: scale(1.1) rotate(-3deg) } 100% { -o-transform: scale(1) rotate(0) } } @keyframes tada { 0% { transform: scale(1) } 10%, 20% { transform: scale(0.9) rotate(-3deg) } 30%, 50%, 70%, 90% { transform: scale(1.1) rotate(3deg) } 40%, 60%, 80% { transform: scale(1.1) rotate(-3deg) } 100% { transform: scale(1) rotate(0) } } @-webkit-keyframes swing { 20%, 40%, 60%, 80%, 100% { -webkit-transform-origin: top center } 20% { -webkit-transform: rotate(15deg) } 40% { -webkit-transform: rotate(-10deg) } 60% { -webkit-transform: rotate(5deg) } 80% { -webkit-transform: rotate(-5deg) } 100% { -webkit-transform: rotate(0deg) } } @-moz-keyframes swing { 20% { -moz-transform: rotate(15deg) } 40% { -moz-transform: rotate(-10deg) } 60% { -moz-transform: rotate(5deg) } 80% { -moz-transform: rotate(-5deg) } 100% { -moz-transform: rotate(0deg) } } @-o-keyframes swing { 20% { -o-transform: rotate(15deg) } 40% { -o-transform: rotate(-10deg) } 60% { -o-transform: rotate(5deg) } 80% { -o-transform: rotate(-5deg) } 100% { -o-transform: rotate(0deg) } } @keyframes swing { 20% { transform: rotate(15deg) } 40% { transform: rotate(-10deg) } 60% { transform: rotate(5deg) } 80% { transform: rotate(-5deg) } 100% { transform: rotate(0deg) } } @-webkit-keyframes wobble { 0% { -webkit-transform: translateX(0%) } 15% { -webkit-transform: translateX(-25%) rotate(-5deg) } 30% { -webkit-transform: translateX(20%) rotate(3deg) } 45% { -webkit-transform: translateX(-15%) rotate(-3deg) } 60% { -webkit-transform: translateX(10%) rotate(2deg) } 75% { -webkit-transform: translateX(-5%) rotate(-1deg) } 100% { -webkit-transform: translateX(0%) } } @-moz-keyframes wobble { 0% { -moz-transform: translateX(0%) } 15% { -moz-transform: translateX(-25%) rotate(-5deg) } 30% { -moz-transform: translateX(20%) rotate(3deg) } 45% { -moz-transform: translateX(-15%) rotate(-3deg) } 60% { -moz-transform: translateX(10%) rotate(2deg) } 75% { -moz-transform: translateX(-5%) rotate(-1deg) } 100% { -moz-transform: translateX(0%) } } @-o-keyframes wobble { 0% { -o-transform: translateX(0%) } 15% { -o-transform: translateX(-25%) rotate(-5deg) } 30% { -o-transform: translateX(20%) rotate(3deg) } 45% { -o-transform: translateX(-15%) rotate(-3deg) } 60% { -o-transform: translateX(10%) rotate(2deg) } 75% { -o-transform: translateX(-5%) rotate(-1deg) } 100% { -o-transform: translateX(0%) } } @keyframes wobble { 0% { transform: translateX(0%) } 15% { transform: translateX(-25%) rotate(-5deg) } 30% { transform: translateX(20%) rotate(3deg) } 45% { transform: translateX(-15%) rotate(-3deg) } 60% { transform: translateX(10%) rotate(2deg) } 75% { transform: translateX(-5%) rotate(-1deg) } 100% { transform: translateX(0%) } } @-webkit-keyframes wiggle { 0% { -webkit-transform: skewX(9deg) } 10% { -webkit-transform: skewX(-8deg) } 20% { -webkit-transform: skewX(7deg) } 30% { -webkit-transform: skewX(-6deg) } 40% { -webkit-transform: skewX(5deg) } 50% { -webkit-transform: skewX(-4deg) } 60% { -webkit-transform: skewX(3deg) } 70% { -webkit-transform: skewX(-2deg) } 80% { -webkit-transform: skewX(1deg) } 90% { -webkit-transform: skewX(0deg) } 100% { -webkit-transform: skewX(0deg) } } @-moz-keyframes wiggle { 0% { -moz-transform: skewX(9deg) } 10% { -moz-transform: skewX(-8deg) } 20% { -moz-transform: skewX(7deg) } 30% { -moz-transform: skewX(-6deg) } 40% { -moz-transform: skewX(5deg) } 50% { -moz-transform: skewX(-4deg) } 60% { -moz-transform: skewX(3deg) } 70% { -moz-transform: skewX(-2deg) } 80% { -moz-transform: skewX(1deg) } 90% { -moz-transform: skewX(0deg) } 100% { -moz-transform: skewX(0deg) } } @-o-keyframes wiggle { 0% { -o-transform: skewX(9deg) } 10% { -o-transform: skewX(-8deg) } 20% { -o-transform: skewX(7deg) } 30% { -o-transform: skewX(-6deg) } 40% { -o-transform: skewX(5deg) } 50% { -o-transform: skewX(-4deg) } 60% { -o-transform: skewX(3deg) } 70% { -o-transform: skewX(-2deg) } 80% { -o-transform: skewX(1deg) } 90% { -o-transform: skewX(0deg) } 100% { -o-transform: skewX(0deg) } } @keyframes wiggle { 0% { transform: skewX(9deg) } 10% { transform: skewX(-8deg) } 20% { transform: skewX(7deg) } 30% { transform: skewX(-6deg) } 40% { transform: skewX(5deg) } 50% { transform: skewX(-4deg) } 60% { transform: skewX(3deg) } 70% { transform: skewX(-2deg) } 80% { transform: skewX(1deg) } 90% { transform: skewX(0deg) } 100% { transform: skewX(0deg) } } @-webkit-keyframes pulse { 0% { -webkit-transform: scale(1) } 50% { -webkit-transform: scale(1.1) } 100% { -webkit-transform: scale(1) } } @-moz-keyframes pulse { 0% { -moz-transform: scale(1) } 50% { -moz-transform: scale(1.1) } 100% { -moz-transform: scale(1) } } @-o-keyframes pulse { 0% { -o-transform: scale(1) } 50% { -o-transform: scale(1.1) } 100% { -o-transform: scale(1) } } @keyframes pulse { 0% { transform: scale(1) } 50% { transform: scale(1.1) } 100% { transform: scale(1) } } @-webkit-keyframes flip { 0% { -webkit-transform: perspective(400px) rotateY(0); -webkit-animation-timing-function: ease-out } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg); -webkit-animation-timing-function: ease-out } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in } 80% { -webkit-transform: perspective(400px) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in } 100% { -webkit-transform: perspective(400px) scale(1); -webkit-animation-timing-function: ease-in } } @-moz-keyframes flip { 0% { -moz-transform: perspective(400px) rotateY(0); -moz-animation-timing-function: ease-out } 40% { -moz-transform: perspective(400px) translateZ(150px) rotateY(170deg); -moz-animation-timing-function: ease-out } 50% { -moz-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -moz-animation-timing-function: ease-in } 80% { -moz-transform: perspective(400px) rotateY(360deg) scale(.95); -moz-animation-timing-function: ease-in } 100% { -moz-transform: perspective(400px) scale(1); -moz-animation-timing-function: ease-in } } @-o-keyframes flip { 0% { -o-transform: perspective(400px) rotateY(0); -o-animation-timing-function: ease-out } 40% { -o-transform: perspective(400px) translateZ(150px) rotateY(170deg); -o-animation-timing-function: ease-out } 50% { -o-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -o-animation-timing-function: ease-in } 80% { -o-transform: perspective(400px) rotateY(360deg) scale(.95); -o-animation-timing-function: ease-in } 100% { -o-transform: perspective(400px) scale(1); -o-animation-timing-function: ease-in } } @keyframes flip { 0% { transform: perspective(400px) rotateY(0); animation-timing-function: ease-out } 40% { transform: perspective(400px) translateZ(150px) rotateY(170deg); animation-timing-function: ease-out } 50% { transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); animation-timing-function: ease-in } 80% { transform: perspective(400px) rotateY(360deg) scale(.95); animation-timing-function: ease-in } 100% { transform: perspective(400px) scale(1); animation-timing-function: ease-in } } @-webkit-keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg); opacity: 0 } 40% { -webkit-transform: perspective(400px) rotateX(-10deg) } 70% { -webkit-transform: perspective(400px) rotateX(10deg) } 100% { -webkit-transform: perspective(400px) rotateX(0deg); opacity: 1 } } @-moz-keyframes flipInX { 0% { -moz-transform: perspective(400px) rotateX(90deg); opacity: 0 } 40% { -moz-transform: perspective(400px) rotateX(-10deg) } 70% { -moz-transform: perspective(400px) rotateX(10deg) } 100% { -moz-transform: perspective(400px) rotateX(0deg); opacity: 1 } } @-o-keyframes flipInX { 0% { -o-transform: perspective(400px) rotateX(90deg); opacity: 0 } 40% { -o-transform: perspective(400px) rotateX(-10deg) } 70% { -o-transform: perspective(400px) rotateX(10deg) } 100% { -o-transform: perspective(400px) rotateX(0deg); opacity: 1 } } @keyframes flipInX { 0% { transform: perspective(400px) rotateX(90deg); opacity: 0 } 40% { transform: perspective(400px) rotateX(-10deg) } 70% { transform: perspective(400px) rotateX(10deg) } 100% { transform: perspective(400px) rotateX(0deg); opacity: 1 } } @-webkit-keyframes flipOutX { 0% { -webkit-transform: perspective(400px) rotateX(0deg); opacity: 1 } 100% { -webkit-transform: perspective(400px) rotateX(90deg); opacity: 0 } } @-moz-keyframes flipOutX { 0% { -moz-transform: perspective(400px) rotateX(0deg); opacity: 1 } 100% { -moz-transform: perspective(400px) rotateX(90deg); opacity: 0 } } @-o-keyframes flipOutX { 0% { -o-transform: perspective(400px) rotateX(0deg); opacity: 1 } 100% { -o-transform: perspective(400px) rotateX(90deg); opacity: 0 } } @keyframes flipOutX { 0% { transform: perspective(400px) rotateX(0deg); opacity: 1 } 100% { transform: perspective(400px) rotateX(90deg); opacity: 0 } } @-webkit-keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotateY(90deg); opacity: 0 } 40% { -webkit-transform: perspective(400px) rotateY(-10deg) } 70% { -webkit-transform: perspective(400px) rotateY(10deg) } 100% { -webkit-transform: perspective(400px) rotateY(0deg); opacity: 1 } } @-moz-keyframes flipInY { 0% { -moz-transform: perspective(400px) rotateY(90deg); opacity: 0 } 40% { -moz-transform: perspective(400px) rotateY(-10deg) } 70% { -moz-transform: perspective(400px) rotateY(10deg) } 100% { -moz-transform: perspective(400px) rotateY(0deg); opacity: 1 } } @-o-keyframes flipInY { 0% { -o-transform: perspective(400px) rotateY(90deg); opacity: 0 } 40% { -o-transform: perspective(400px) rotateY(-10deg) } 70% { -o-transform: perspective(400px) rotateY(10deg) } 100% { -o-transform: perspective(400px) rotateY(0deg); opacity: 1 } } @keyframes flipInY { 0% { transform: perspective(400px) rotateY(90deg); opacity: 0 } 40% { transform: perspective(400px) rotateY(-10deg) } 70% { transform: perspective(400px) rotateY(10deg) } 100% { transform: perspective(400px) rotateY(0deg); opacity: 1 } } @-webkit-keyframes flipOutY { 0% { -webkit-transform: perspective(400px) rotateY(0deg); opacity: 1 } 100% { -webkit-transform: perspective(400px) rotateY(90deg); opacity: 0 } } @-moz-keyframes flipOutY { 0% { -moz-transform: perspective(400px) rotateY(0deg); opacity: 1 } 100% { -moz-transform: perspective(400px) rotateY(90deg); opacity: 0 } } @-o-keyframes flipOutY { 0% { -o-transform: perspective(400px) rotateY(0deg); opacity: 1 } 100% { -o-transform: perspective(400px) rotateY(90deg); opacity: 0 } } @keyframes flipOutY { 0% { transform: perspective(400px) rotateY(0deg); opacity: 1 } 100% { transform: perspective(400px) rotateY(90deg); opacity: 0 } } @-webkit-keyframes fadeIn { 0% { opacity: .2 } 100% { opacity: 1 } } @-moz-keyframes fadeIn { 0% { opacity: .2 } 100% { opacity: 1 } } @-o-keyframes fadeIn { 0% { opacity: .2 } 100% { opacity: 1 } } @keyframes fadeIn { 0% { opacity: .2 } 100% { opacity: 1 } } @-webkit-keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translateY(20px) } 100% { opacity: 1; -webkit-transform: translateY(0) } } @-moz-keyframes fadeInUp { 0% { opacity: 0; -moz-transform: translateY(20px) } 100% { opacity: 1; -moz-transform: translateY(0) } } @-o-keyframes fadeInUp { 0% { opacity: 0; -o-transform: translateY(20px) } 100% { opacity: 1; -o-transform: translateY(0) } } @keyframes fadeInUp { 0% { opacity: 0; transform: translateY(20px) } 100% { opacity: 1; transform: translateY(0) } } @-webkit-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translateY(-20px) } 100% { opacity: 1; -webkit-transform: translateY(0) } } @-moz-keyframes fadeInDown { 0% { opacity: 0; -moz-transform: translateY(-20px) } 100% { opacity: 1; -moz-transform: translateY(0) } } @-o-keyframes fadeInDown { 0% { opacity: 0; -o-transform: translateY(-20px) } 100% { opacity: 1; -o-transform: translateY(0) } } @keyframes fadeInDown { 0% { opacity: 0; transform: translateY(-20px) } 100% { opacity: 1; transform: translateY(0) } } @-webkit-keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translateX(-20px) } 100% { opacity: 1; -webkit-transform: translateX(0) } } @-moz-keyframes fadeInLeft { 0% { opacity: 0; -moz-transform: translateX(-20px) } 100% { opacity: 1; -moz-transform: translateX(0) } } @-o-keyframes fadeInLeft { 0% { opacity: 0; -o-transform: translateX(-20px) } 100% { opacity: 1; -o-transform: translateX(0) } } @keyframes fadeInLeft { 0% { opacity: 0; transform: translateX(-20px) } 100% { opacity: 1; transform: translateX(0) } } @-webkit-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translateX(20px) } 100% { opacity: 1; -webkit-transform: translateX(0) } } @-moz-keyframes fadeInRight { 0% { opacity: 0; -moz-transform: translateX(20px) } 100% { opacity: 1; -moz-transform: translateX(0) } } @-o-keyframes fadeInRight { 0% { opacity: 0; -o-transform: translateX(20px) } 100% { opacity: 1; -o-transform: translateX(0) } } @keyframes fadeInRight { 0% { opacity: 0; transform: translateX(20px) } 100% { opacity: 1; transform: translateX(0) } } @-webkit-keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translateY(2000px) } 100% { opacity: 1; -webkit-transform: translateY(0) } } @-moz-keyframes fadeInUpBig { 0% { opacity: 0; -moz-transform: translateY(2000px) } 100% { opacity: 1; -moz-transform: translateY(0) } } @-o-keyframes fadeInUpBig { 0% { opacity: 0; -o-transform: translateY(2000px) } 100% { opacity: 1; -o-transform: translateY(0) } } @keyframes fadeInUpBig { 0% { opacity: 0; transform: translateY(2000px) } 100% { opacity: 1; transform: translateY(0) } } @-webkit-keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translateY(-2000px) } 100% { opacity: 1; -webkit-transform: translateY(0) } } @-moz-keyframes fadeInDownBig { 0% { opacity: 0; -moz-transform: translateY(-2000px) } 100% { opacity: 1; -moz-transform: translateY(0) } } @-o-keyframes fadeInDownBig { 0% { opacity: 0; -o-transform: translateY(-2000px) } 100% { opacity: 1; -o-transform: translateY(0) } } @keyframes fadeInDownBig { 0% { opacity: 0; transform: translateY(-2000px) } 100% { opacity: 1; transform: translateY(0) } } @-webkit-keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translateX(-2000px) } 100% { opacity: 1; -webkit-transform: translateX(0) } } @-moz-keyframes fadeInLeftBig { 0% { opacity: 0; -moz-transform: translateX(-2000px) } 100% { opacity: 1; -moz-transform: translateX(0) } } @-o-keyframes fadeInLeftBig { 0% { opacity: 0; -o-transform: translateX(-2000px) } 100% { opacity: 1; -o-transform: translateX(0) } } @keyframes fadeInLeftBig { 0% { opacity: 0; transform: translateX(-2000px) } 100% { opacity: 1; transform: translateX(0) } } @-webkit-keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translateX(2000px) } 100% { opacity: 1; -webkit-transform: translateX(0) } } @-moz-keyframes fadeInRightBig { 0% { opacity: 0; -moz-transform: translateX(2000px) } 100% { opacity: 1; -moz-transform: translateX(0) } } @-o-keyframes fadeInRightBig { 0% { opacity: 0; -o-transform: translateX(2000px) } 100% { opacity: 1; -o-transform: translateX(0) } } @keyframes fadeInRightBig { 0% { opacity: 0; transform: translateX(2000px) } 100% { opacity: 1; transform: translateX(0) } } @-webkit-keyframes fadeOut { 0% { opacity: 1 } 100% { opacity: 0 } } @-moz-keyframes fadeOut { 0% { opacity: 1 } 100% { opacity: 0 } } @-o-keyframes fadeOut { 0% { opacity: 1 } 100% { opacity: 0 } } @keyframes fadeOut { 0% { opacity: 1 } 100% { opacity: 0 } } @-webkit-keyframes fadeOutUp { 0% { opacity: 1; -webkit-transform: translateY(0) } 100% { opacity: 0; -webkit-transform: translateY(-20px) } } @-moz-keyframes fadeOutUp { 0% { opacity: 1; -moz-transform: translateY(0) } 100% { opacity: 0; -moz-transform: translateY(-20px) } } @-o-keyframes fadeOutUp { 0% { opacity: 1; -o-transform: translateY(0) } 100% { opacity: 0; -o-transform: translateY(-20px) } } @keyframes fadeOutUp { 0% { opacity: 1; transform: translateY(0) } 100% { opacity: 0; transform: translateY(-20px) } } @-webkit-keyframes fadeOutDown { 0% { opacity: 1; -webkit-transform: translateY(0) } 100% { opacity: 0; -webkit-transform: translateY(20px) } } @-moz-keyframes fadeOutDown { 0% { opacity: 1; -moz-transform: translateY(0) } 100% { opacity: 0; -moz-transform: translateY(20px) } } @-o-keyframes fadeOutDown { 0% { opacity: 1; -o-transform: translateY(0) } 100% { opacity: 0; -o-transform: translateY(20px) } } @keyframes fadeOutDown { 0% { opacity: 1; transform: translateY(0) } 100% { opacity: 0; transform: translateY(20px) } } @-webkit-keyframes fadeOutLeft { 0% { opacity: 1; -webkit-transform: translateX(0) } 100% { opacity: 0; -webkit-transform: translateX(-20px) } } @-moz-keyframes fadeOutLeft { 0% { opacity: 1; -moz-transform: translateX(0) } 100% { opacity: 0; -moz-transform: translateX(-20px) } } @-o-keyframes fadeOutLeft { 0% { opacity: 1; -o-transform: translateX(0) } 100% { opacity: 0; -o-transform: translateX(-20px) } } @keyframes fadeOutLeft { 0% { opacity: 1; transform: translateX(0) } 100% { opacity: 0; transform: translateX(-20px) } } @-webkit-keyframes fadeOutRight { 0% { opacity: 1; -webkit-transform: translateX(0) } 100% { opacity: 0; -webkit-transform: translateX(20px) } } @-moz-keyframes fadeOutRight { 0% { opacity: 1; -moz-transform: translateX(0) } 100% { opacity: 0; -moz-transform: translateX(20px) } } @-o-keyframes fadeOutRight { 0% { opacity: 1; -o-transform: translateX(0) } 100% { opacity: 0; -o-transform: translateX(20px) } } @keyframes fadeOutRight { 0% { opacity: 1; transform: translateX(0) } 100% { opacity: 0; transform: translateX(20px) } } @-webkit-keyframes fadeOutUpBig { 0% { opacity: 1; -webkit-transform: translateY(0) } 100% { opacity: 0; -webkit-transform: translateY(-2000px) } } @-moz-keyframes fadeOutUpBig { 0% { opacity: 1; -moz-transform: translateY(0) } 100% { opacity: 0; -moz-transform: translateY(-2000px) } } @-o-keyframes fadeOutUpBig { 0% { opacity: 1; -o-transform: translateY(0) } 100% { opacity: 0; -o-transform: translateY(-2000px) } } @keyframes fadeOutUpBig { 0% { opacity: 1; transform: translateY(0) } 100% { opacity: 0; transform: translateY(-2000px) } } @-webkit-keyframes fadeOutDownBig { 0% { opacity: 1; -webkit-transform: translateY(0) } 100% { opacity: 0; -webkit-transform: translateY(2000px) } } @-moz-keyframes fadeOutDownBig { 0% { opacity: 1; -moz-transform: translateY(0) } 100% { opacity: 0; -moz-transform: translateY(2000px) } } @-o-keyframes fadeOutDownBig { 0% { opacity: 1; -o-transform: translateY(0) } 100% { opacity: 0; -o-transform: translateY(2000px) } } @keyframes fadeOutDownBig { 0% { opacity: 1; transform: translateY(0) } 100% { opacity: 0; transform: translateY(2000px) } } @-webkit-keyframes fadeOutLeftBig { 0% { opacity: 1; -webkit-transform: translateX(0) } 100% { opacity: 0; -webkit-transform: translateX(-2000px) } } @-moz-keyframes fadeOutLeftBig { 0% { opacity: 1; -moz-transform: translateX(0) } 100% { opacity: 0; -moz-transform: translateX(-2000px) } } @-o-keyframes fadeOutLeftBig { 0% { opacity: 1; -o-transform: translateX(0) } 100% { opacity: 0; -o-transform: translateX(-2000px) } } @keyframes fadeOutLeftBig { 0% { opacity: 1; transform: translateX(0) } 100% { opacity: 0; transform: translateX(-2000px) } } @-webkit-keyframes fadeOutRightBig { 0% { opacity: 1; -webkit-transform: translateX(0) } 100% { opacity: 0; -webkit-transform: translateX(2000px) } } @-moz-keyframes fadeOutRightBig { 0% { opacity: 1; -moz-transform: translateX(0) } 100% { opacity: 0; -moz-transform: translateX(2000px) } } @-o-keyframes fadeOutRightBig { 0% { opacity: 1; -o-transform: translateX(0) } 100% { opacity: 0; -o-transform: translateX(2000px) } } @keyframes fadeOutRightBig { 0% { opacity: 1; transform: translateX(0) } 100% { opacity: 0; transform: translateX(2000px) } } @-webkit-keyframes bounceIn { 0% { opacity: 0; -webkit-transform: scale(.3) } 50% { opacity: 1; -webkit-transform: scale(1.05) } 70% { -webkit-transform: scale(.9) } 100% { -webkit-transform: scale(1) } } @-moz-keyframes bounceIn { 0% { opacity: 0; -moz-transform: scale(.3) } 50% { opacity: 1; -moz-transform: scale(1.05) } 70% { -moz-transform: scale(.9) } 100% { -moz-transform: scale(1) } } @-o-keyframes bounceIn { 0% { opacity: 0; -o-transform: scale(.3) } 50% { opacity: 1; -o-transform: scale(1.05) } 70% { -o-transform: scale(.9) } 100% { -o-transform: scale(1) } } @keyframes bounceIn { 0% { opacity: 0; transform: scale(.3) } 50% { opacity: 1; transform: scale(1.05) } 70% { transform: scale(.9) } 100% { transform: scale(1) } } @-webkit-keyframes bounceInUp { 0% { opacity: 0; -webkit-transform: translateY(2000px) } 60% { opacity: 1; -webkit-transform: translateY(-30px) } 80% { -webkit-transform: translateY(10px) } 100% { -webkit-transform: translateY(0) } } @-moz-keyframes bounceInUp { 0% { opacity: 0; -moz-transform: translateY(2000px) } 60% { opacity: 1; -moz-transform: translateY(-30px) } 80% { -moz-transform: translateY(10px) } 100% { -moz-transform: translateY(0) } } @-o-keyframes bounceInUp { 0% { opacity: 0; -o-transform: translateY(2000px) } 60% { opacity: 1; -o-transform: translateY(-30px) } 80% { -o-transform: translateY(10px) } 100% { -o-transform: translateY(0) } } @keyframes bounceInUp { 0% { opacity: 0; transform: translateY(2000px) } 60% { opacity: 1; transform: translateY(-30px) } 80% { transform: translateY(10px) } 100% { transform: translateY(0) } } @-webkit-keyframes bounceInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px) } 60% { opacity: 1; -webkit-transform: translateY(30px) } 80% { -webkit-transform: translateY(-10px) } 100% { -webkit-transform: translateY(0) } } @-moz-keyframes bounceInDown { 0% { opacity: 0; -moz-transform: translateY(-2000px) } 60% { opacity: 1; -moz-transform: translateY(30px) } 80% { -moz-transform: translateY(-10px) } 100% { -moz-transform: translateY(0) } } @-o-keyframes bounceInDown { 0% { opacity: 0; -o-transform: translateY(-2000px) } 60% { opacity: 1; -o-transform: translateY(30px) } 80% { -o-transform: translateY(-10px) } 100% { -o-transform: translateY(0) } } @keyframes bounceInDown { 0% { opacity: 0; transform: translateY(-2000px) } 60% { opacity: 1; transform: translateY(30px) } 80% { transform: translateY(-10px) } 100% { transform: translateY(0) } } @-webkit-keyframes bounceInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px) } 60% { opacity: 1; -webkit-transform: translateX(30px) } 80% { -webkit-transform: translateX(-10px) } 100% { -webkit-transform: translateX(0) } } @-moz-keyframes bounceInLeft { 0% { opacity: 0; -moz-transform: translateX(-2000px) } 60% { opacity: 1; -moz-transform: translateX(30px) } 80% { -moz-transform: translateX(-10px) } 100% { -moz-transform: translateX(0) } } @-o-keyframes bounceInLeft { 0% { opacity: 0; -o-transform: translateX(-2000px) } 60% { opacity: 1; -o-transform: translateX(30px) } 80% { -o-transform: translateX(-10px) } 100% { -o-transform: translateX(0) } } @keyframes bounceInLeft { 0% { opacity: 0; transform: translateX(-2000px) } 60% { opacity: 1; transform: translateX(30px) } 80% { transform: translateX(-10px) } 100% { transform: translateX(0) } } @-webkit-keyframes bounceInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px) } 60% { opacity: 1; -webkit-transform: translateX(-30px) } 80% { -webkit-transform: translateX(10px) } 100% { -webkit-transform: translateX(0) } } @-moz-keyframes bounceInRight { 0% { opacity: 0; -moz-transform: translateX(2000px) } 60% { opacity: 1; -moz-transform: translateX(-30px) } 80% { -moz-transform: translateX(10px) } 100% { -moz-transform: translateX(0) } } @-o-keyframes bounceInRight { 0% { opacity: 0; -o-transform: translateX(2000px) } 60% { opacity: 1; -o-transform: translateX(-30px) } 80% { -o-transform: translateX(10px) } 100% { -o-transform: translateX(0) } } @keyframes bounceInRight { 0% { opacity: 0; transform: translateX(2000px) } 60% { opacity: 1; transform: translateX(-30px) } 80% { transform: translateX(10px) } 100% { transform: translateX(0) } } @-webkit-keyframes bounceOut { 0% { -webkit-transform: scale(1) } 25% { -webkit-transform: scale(.95) } 50% { opacity: 1; -webkit-transform: scale(1.1) } 100% { opacity: 0; -webkit-transform: scale(.3) } } @-moz-keyframes bounceOut { 0% { -moz-transform: scale(1) } 25% { -moz-transform: scale(.95) } 50% { opacity: 1; -moz-transform: scale(1.1) } 100% { opacity: 0; -moz-transform: scale(.3) } } @-o-keyframes bounceOut { 0% { -o-transform: scale(1) } 25% { -o-transform: scale(.95) } 50% { opacity: 1; -o-transform: scale(1.1) } 100% { opacity: 0; -o-transform: scale(.3) } } @keyframes bounceOut { 0% { transform: scale(1) } 25% { transform: scale(.95) } 50% { opacity: 1; transform: scale(1.1) } 100% { opacity: 0; transform: scale(.3) } } @-webkit-keyframes bounceOutUp { 0% { -webkit-transform: translateY(0) } 20% { opacity: 1; -webkit-transform: translateY(20px) } 100% { opacity: 0; -webkit-transform: translateY(-2000px) } } @-moz-keyframes bounceOutUp { 0% { -moz-transform: translateY(0) } 20% { opacity: 1; -moz-transform: translateY(20px) } 100% { opacity: 0; -moz-transform: translateY(-2000px) } } @-o-keyframes bounceOutUp { 0% { -o-transform: translateY(0) } 20% { opacity: 1; -o-transform: translateY(20px) } 100% { opacity: 0; -o-transform: translateY(-2000px) } } @keyframes bounceOutUp { 0% { transform: translateY(0) } 20% { opacity: 1; transform: translateY(20px) } 100% { opacity: 0; transform: translateY(-2000px) } } @-webkit-keyframes bounceOutDown { 0% { -webkit-transform: translateY(0) } 20% { opacity: 1; -webkit-transform: translateY(-20px) } 100% { opacity: 0; -webkit-transform: translateY(2000px) } } @-moz-keyframes bounceOutDown { 0% { -moz-transform: translateY(0) } 20% { opacity: 1; -moz-transform: translateY(-20px) } 100% { opacity: 0; -moz-transform: translateY(2000px) } } @-o-keyframes bounceOutDown { 0% { -o-transform: translateY(0) } 20% { opacity: 1; -o-transform: translateY(-20px) } 100% { opacity: 0; -o-transform: translateY(2000px) } } @keyframes bounceOutDown { 0% { transform: translateY(0) } 20% { opacity: 1; transform: translateY(-20px) } 100% { opacity: 0; transform: translateY(2000px) } } @-webkit-keyframes bounceOutLeft { 0% { -webkit-transform: translateX(0) } 20% { opacity: 1; -webkit-transform: translateX(20px) } 100% { opacity: 0; -webkit-transform: translateX(-2000px) } } @-moz-keyframes bounceOutLeft { 0% { -moz-transform: translateX(0) } 20% { opacity: 1; -moz-transform: translateX(20px) } 100% { opacity: 0; -moz-transform: translateX(-2000px) } } @-o-keyframes bounceOutLeft { 0% { -o-transform: translateX(0) } 20% { opacity: 1; -o-transform: translateX(20px) } 100% { opacity: 0; -o-transform: translateX(-2000px) } } @keyframes bounceOutLeft { 0% { transform: translateX(0) } 20% { opacity: 1; transform: translateX(20px) } 100% { opacity: 0; transform: translateX(-2000px) } } @-webkit-keyframes bounceOutRight { 0% { -webkit-transform: translateX(0) } 20% { opacity: 1; -webkit-transform: translateX(-20px) } 100% { opacity: 0; -webkit-transform: translateX(2000px) } } @-moz-keyframes bounceOutRight { 0% { -moz-transform: translateX(0) } 20% { opacity: 1; -moz-transform: translateX(-20px) } 100% { opacity: 0; -moz-transform: translateX(2000px) } } @-o-keyframes bounceOutRight { 0% { -o-transform: translateX(0) } 20% { opacity: 1; -o-transform: translateX(-20px) } 100% { opacity: 0; -o-transform: translateX(2000px) } } @keyframes bounceOutRight { 0% { transform: translateX(0) } 20% { opacity: 1; transform: translateX(-20px) } 100% { opacity: 0; transform: translateX(2000px) } } @-webkit-keyframes rotateIn { 0% { -webkit-transform-origin: center center; -webkit-transform: rotate(-200deg); opacity: 0 } 100% { -webkit-transform-origin: center center; -webkit-transform: rotate(0); opacity: 1 } } @-moz-keyframes rotateIn { 0% { -moz-transform-origin: center center; -moz-transform: rotate(-200deg); opacity: 0 } 100% { -moz-transform-origin: center center; -moz-transform: rotate(0); opacity: 1 } } @-o-keyframes rotateIn { 0% { -o-transform-origin: center center; -o-transform: rotate(-200deg); opacity: 0 } 100% { -o-transform-origin: center center; -o-transform: rotate(0); opacity: 1 } } @keyframes rotateIn { 0% { transform-origin: center center; transform: rotate(-200deg); opacity: 0 } 100% { transform-origin: center center; transform: rotate(0); opacity: 1 } } @-webkit-keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(90deg); opacity: 0 } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1 } } @-moz-keyframes rotateInUpLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(90deg); opacity: 0 } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1 } } @-o-keyframes rotateInUpLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(90deg); opacity: 0 } 100% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1 } } @keyframes rotateInUpLeft { 0% { transform-origin: left bottom; transform: rotate(90deg); opacity: 0 } 100% { transform-origin: left bottom; transform: rotate(0); opacity: 1 } } @-webkit-keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(-90deg); opacity: 0 } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1 } } @-moz-keyframes rotateInDownLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(-90deg); opacity: 0 } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1 } } @-o-keyframes rotateInDownLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(-90deg); opacity: 0 } 100% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1 } } @keyframes rotateInDownLeft { 0% { transform-origin: left bottom; transform: rotate(-90deg); opacity: 0 } 100% { transform-origin: left bottom; transform: rotate(0); opacity: 1 } } @-webkit-keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(-90deg); opacity: 0 } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1 } } @-moz-keyframes rotateInUpRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(-90deg); opacity: 0 } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1 } } @-o-keyframes rotateInUpRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(-90deg); opacity: 0 } 100% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1 } } @keyframes rotateInUpRight { 0% { transform-origin: right bottom; transform: rotate(-90deg); opacity: 0 } 100% { transform-origin: right bottom; transform: rotate(0); opacity: 1 } } @-webkit-keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(90deg); opacity: 0 } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1 } } @-moz-keyframes rotateInDownRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(90deg); opacity: 0 } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1 } } @-o-keyframes rotateInDownRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(90deg); opacity: 0 } 100% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1 } } @keyframes rotateInDownRight { 0% { transform-origin: right bottom; transform: rotate(90deg); opacity: 0 } 100% { transform-origin: right bottom; transform: rotate(0); opacity: 1 } } @-webkit-keyframes rotateOut { 0% { -webkit-transform-origin: center center; -webkit-transform: rotate(0); opacity: 1 } 100% { -webkit-transform-origin: center center; -webkit-transform: rotate(200deg); opacity: 0 } } @-moz-keyframes rotateOut { 0% { -moz-transform-origin: center center; -moz-transform: rotate(0); opacity: 1 } 100% { -moz-transform-origin: center center; -moz-transform: rotate(200deg); opacity: 0 } } @-o-keyframes rotateOut { 0% { -o-transform-origin: center center; -o-transform: rotate(0); opacity: 1 } 100% { -o-transform-origin: center center; -o-transform: rotate(200deg); opacity: 0 } } @keyframes rotateOut { 0% { transform-origin: center center; transform: rotate(0); opacity: 1 } 100% { transform-origin: center center; transform: rotate(200deg); opacity: 0 } } @-webkit-keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1 } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(-90deg); opacity: 0 } } @-moz-keyframes rotateOutUpLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1 } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(-90deg); opacity: 0 } } @-o-keyframes rotateOutUpLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1 } 100% { -o-transform-origin: left bottom; -o-transform: rotate(-90deg); opacity: 0 } } @keyframes rotateOutUpLeft { 0% { transform-origin: left bottom; transform: rotate(0); opacity: 1 } 100% { -transform-origin: left bottom; -transform: rotate(-90deg); opacity: 0 } } @-webkit-keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1 } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(90deg); opacity: 0 } } @-moz-keyframes rotateOutDownLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1 } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(90deg); opacity: 0 } } @-o-keyframes rotateOutDownLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1 } 100% { -o-transform-origin: left bottom; -o-transform: rotate(90deg); opacity: 0 } } @keyframes rotateOutDownLeft { 0% { transform-origin: left bottom; transform: rotate(0); opacity: 1 } 100% { transform-origin: left bottom; transform: rotate(90deg); opacity: 0 } } @-webkit-keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1 } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(90deg); opacity: 0 } } @-moz-keyframes rotateOutUpRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1 } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(90deg); opacity: 0 } } @-o-keyframes rotateOutUpRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1 } 100% { -o-transform-origin: right bottom; -o-transform: rotate(90deg); opacity: 0 } } @keyframes rotateOutUpRight { 0% { transform-origin: right bottom; transform: rotate(0); opacity: 1 } 100% { transform-origin: right bottom; transform: rotate(90deg); opacity: 0 } } @-webkit-keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1 } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(-90deg); opacity: 0 } } @-moz-keyframes rotateOutDownRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1 } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(-90deg); opacity: 0 } } @-o-keyframes rotateOutDownRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1 } 100% { -o-transform-origin: right bottom; -o-transform: rotate(-90deg); opacity: 0 } } @keyframes rotateOutDownRight { 0% { transform-origin: right bottom; transform: rotate(0); opacity: 1 } 100% { transform-origin: right bottom; transform: rotate(-90deg); opacity: 0 } } @-webkit-keyframes lightSpeedIn { 0% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0 } 60% { -webkit-transform: translateX(-20%) skewX(30deg); opacity: 1 } 80% { -webkit-transform: translateX(0%) skewX(-15deg); opacity: 1 } 100% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1 } } @-moz-keyframes lightSpeedIn { 0% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0 } 60% { -moz-transform: translateX(-20%) skewX(30deg); opacity: 1 } 80% { -moz-transform: translateX(0%) skewX(-15deg); opacity: 1 } 100% { -moz-transform: translateX(0%) skewX(0deg); opacity: 1 } } @-o-keyframes lightSpeedIn { 0% { -o-transform: translateX(100%) skewX(-30deg); opacity: 0 } 60% { -o-transform: translateX(-20%) skewX(30deg); opacity: 1 } 80% { -o-transform: translateX(0%) skewX(-15deg); opacity: 1 } 100% { -o-transform: translateX(0%) skewX(0deg); opacity: 1 } } @keyframes lightSpeedIn { 0% { transform: translateX(100%) skewX(-30deg); opacity: 0 } 60% { transform: translateX(-20%) skewX(30deg); opacity: 1 } 80% { transform: translateX(0%) skewX(-15deg); opacity: 1 } 100% { transform: translateX(0%) skewX(0deg); opacity: 1 } } @-webkit-keyframes lightSpeedOut { 0% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1 } 100% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0 } } @-moz-keyframes lightSpeedOut { 0% { -moz-transform: translateX(0%) skewX(0deg); opacity: 1 } 100% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0 } } @-o-keyframes lightSpeedOut { 0% { -o-transform: translateX(0%) skewX(0deg); opacity: 1 } 100% { -o-transform: translateX(100%) skewX(-30deg); opacity: 0 } } @keyframes lightSpeedOut { 0% { transform: translateX(0%) skewX(0deg); opacity: 1 } 100% { transform: translateX(100%) skewX(-30deg); opacity: 0 } } @-webkit-keyframes hinge { 0% { -webkit-transform: rotate(0); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out } 20%, 60% { -webkit-transform: rotate(80deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out } 40% { -webkit-transform: rotate(60deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out } 80% { -webkit-transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out } 100% { -webkit-transform: translateY(700px); opacity: 0 } } @-moz-keyframes hinge { 0% { -moz-transform: rotate(0); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out } 20%, 60% { -moz-transform: rotate(80deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out } 40% { -moz-transform: rotate(60deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out } 80% { -moz-transform: rotate(60deg) translateY(0); opacity: 1; -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out } 100% { -moz-transform: translateY(700px); opacity: 0 } } @-o-keyframes hinge { 0% { -o-transform: rotate(0); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out } 20%, 60% { -o-transform: rotate(80deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out } 40% { -o-transform: rotate(60deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out } 80% { -o-transform: rotate(60deg) translateY(0); opacity: 1; -o-transform-origin: top left; -o-animation-timing-function: ease-in-out } 100% { -o-transform: translateY(700px); opacity: 0 } } @keyframes hinge { 0% { transform: rotate(0); transform-origin: top left; animation-timing-function: ease-in-out } 20%, 60% { transform: rotate(80deg); transform-origin: top left; animation-timing-function: ease-in-out } 40% { transform: rotate(60deg); transform-origin: top left; animation-timing-function: ease-in-out } 80% { transform: rotate(60deg) translateY(0); opacity: 1; transform-origin: top left; animation-timing-function: ease-in-out } 100% { transform: translateY(700px); opacity: 0 } } @-webkit-keyframes rollIn { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg) } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg) } } @-moz-keyframes rollIn { 0% { opacity: 0; -moz-transform: translateX(-100%) rotate(-120deg) } 100% { opacity: 1; -moz-transform: translateX(0px) rotate(0deg) } } @-o-keyframes rollIn { 0% { opacity: 0; -o-transform: translateX(-100%) rotate(-120deg) } 100% { opacity: 1; -o-transform: translateX(0px) rotate(0deg) } } @keyframes rollIn { 0% { opacity: 0; transform: translateX(-100%) rotate(-120deg) } 100% { opacity: 1; transform: translateX(0px) rotate(0deg) } } @-webkit-keyframes rollOut { 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg) } 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg) } } @-moz-keyframes rollOut { 0% { opacity: 1; -moz-transform: translateX(0px) rotate(0deg) } 100% { opacity: 0; -moz-transform: translateX(100%) rotate(120deg) } } @-o-keyframes rollOut { 0% { opacity: 1; -o-transform: translateX(0px) rotate(0deg) } 100% { opacity: 0; -o-transform: translateX(100%) rotate(120deg) } } @keyframes rollOut { 0% { opacity: 1; transform: translateX(0px) rotate(0deg) } 100% { opacity: 0; transform: translateX(100%) rotate(120deg) } } .flex-container a:active, .flexslider a:active, .flex-container a:focus, .flexslider a:focus { outline: 0 } .slides, .flex-control-nav, .flex-direction-nav { margin: 0 auto; padding: 0; list-style: none } .flexslider { margin: 0; padding: 0 } .flexslider .slides>li { display: none; -webkit-backface-visibility: hidden; position: relative } .flexslider .slides img { width: 100%; display: block; max-height: 565px } .flex-pauseplay span { text-transform: capitalize } .flex-control-thumbs { display: none } .slides:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0 } html[xmlns] .slides { display: block } * html .slides { height: 1% } .no-js .slides>li:first-child { display: block } .flexslider { margin: 0; background: #fff; position: relative; zoom: 1 } .flex-viewport { max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease } .loading .flex-viewport { max-height: 300px } .loading { background: transparent url("../img/ajax-loader.gif") no-repeat 50% 50%; min-height: 300px } .flexslider .slides { zoom: 1 } .carousel li { margin-right: 5px } .flexslider .flex-direction-nav { *height: 0; text-align: center; width: 100%; display: block; position: absolute; bottom: 230px } .flex-direction-nav a { width: 50px; height: 50px; margin: -20px 0 0; display: block; background: url('../img/bg_direction_nav.png') no-repeat 0 0; position: absolute; top: 50%; z-index: 10; cursor: pointer; text-indent: -9999px; opacity: 0; -webkit-transition: all .3s ease } .flex-direction-nav li { position: relative; max-width: 1172px; margin: 0 auto } .flex-direction-nav .flex-next { background-position: 100% 0; right: 5px } .flex-direction-nav .flex-prev { left: 5px } .flexslider:hover .flex-next { opacity: .8; right: 5px } .flexslider:hover .flex-prev { opacity: .8; left: 5px } .flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover { opacity: 1 } .flex-direction-nav .flex-disabled { opacity: .3 !important; filter: alpha(opacity=30); cursor: default } .flex-control-nav { width: 100%; position: absolute; bottom: -40px; text-align: center } .flex-control-nav li { border-top: 3px; margin: 0 6px; display: inline-block; zoom: 1; *display: inline } .flex-control-paging li a { width: 11px; height: 11px; display: block; background: #666; background: rgba(0, 0, 0, 0.5); cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3) } .flex-control-paging li a:hover { background: #333; background: rgba(0, 0, 0, 0.7) } .flex-control-paging li a.flex-active { background: #000; background: rgba(0, 0, 0, 0.9); cursor: default } .flex-control-thumbs { padding: 3px auto; position: absolute; bottom: 20px; overflow: hidden; max-height: 156px; background: rgba(0, 0, 0, 0.7) } .flex-control-thumbs li { max-width: 272px; margin: 0 12px } .flex-control-thumbs img { width: 100%; display: block; opacity: .6; cursor: pointer } .flex-control-thumbs img:hover { opacity: 1 } .flex-control-thumbs .flex-active { opacity: 1; cursor: default } .flex-caption { position: absolute; top: 100px; left: 0; width: 100% } .flex-content { margin: 0 auto } .flex-content h1 { font-size: 36px; color: #fff; font-family: 'Archivo Narrow', sans-serif; font-weight: bold; line-height: normal; margin-bottom: 12px; width: 50% } .flex-content h2 { font-size: 24px; color: #fff; margin-bottom: 12px; width: 50% } .flex-content .flex-button a { color: #fff; text-transform: uppercase; border: 1px solid #fff; text-decoration: none; padding: 5px 10px; margin: 12px 0; display: inline-block } .flex-content .flex-button a:hover { color: #fff } .flex-content .flex-button i { margin-left: 5px; font-size: 17px } .flex-active-slide h1 { -webkit-animation-name: fadeInDown; -moz-animation-name: fadeInDown; -o-animation-name: fadeInDown; animation-name: fadeInDown; animation-delay: 0s; -moz-animation-delay: 0s; -webkit-animation-delay: 0s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -ms-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-duration: 1s; -moz-animation-duration: 1s; -ms-animation-duration: 1s; -o-animation-duration: 1s; animation-duration: 1s } .flex-active-slide h2 { -webkit-animation-name: fadeInDown; -moz-animation-name: fadeInDown; -o-animation-name: fadeInDown; animation-name: fadeInDown; animation-delay: 1s; -moz-animation-delay: 1s; -webkit-animation-delay: 1s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -ms-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-duration: 1s; -moz-animation-duration: 1s; -ms-animation-duration: 1s; -o-animation-duration: 1s; animation-duration: 1s } .flex-active-slide .flex-button { -webkit-animation-name: fadeInDown; -moz-animation-name: fadeInDown; -o-animation-name: fadeInDown; animation-name: fadeInDown; animation-delay: 2s; -moz-animation-delay: 2s; -webkit-animation-delay: 2s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -ms-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-duration: 1s; -moz-animation-duration: 1s; -ms-animation-duration: 1s; -o-animation-duration: 1s; animation-duration: 1s } @media screen and (max-width:1200px) { .flex-direction-nav { display: none } .flexslider .flex-direction-nav { bottom: 80px } .flex-control-thumbs { display: none } .flex-content h1 { width: 100%; font-size: 24px } .flex-content h2 { width: 100%; font-size: 18px } .flex-caption { top: 100px } } @media(max-width:768px) { .flex-caption { top: 60px } } @media(max-width:640px) { .flexslider .flex-direction-nav { display: none } .flex-caption { top: 40px } } @media(max-width:480px) { .flex-caption { top: 20px } .loading { min-height: 100px } } .full-width { width: 100% } .max-full-width { max-width: 1180px !important } .helper-align-right { text-align: right !important } .helper-align-left { text-align: left !important } .no-padding { padding: 0 !important } .vps-padding { padding: 2px !important } .no-margin { margin-top: 0 !important; margin-bottom: 0 !important; margin-left: 0 !important; margin-right: 0 !important } .no-side-margin { margin-left: 0 !important; margin-right: 0 !important } .helper-normalize-padd-left, .helper-normalize-padd-horiz { padding-left: 0 !important } .helper-normalize-padd-right, .helper-normalize-padd-horiz { padding-right: 0 !important } .helper-extra-padding { padding: 0 55px } .helper-extra-top-padding { padding: 100px 0 !important } .helper-small-top-padding { padding: 50px 0 !important } .helper-small-bot-padding { padding-bottom: 50px !important } .helper-position-relative { position: relative !important } .helper-position-absolute { position: absolute !important } .helper-hidden-text { text-indent: -1000em; display: inline-block } .helper-dummy * { text-indent: -1000em } .clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0 } .clearfix { display: inline-block } /*\*/ * html .clearfix { height: 1% } .clearfix { display: block } /**/ .float-right { float: right !important } .float-left { float: left !important } .white-bg { background: white !important; overflow: hidden } .black-bg { background: #1e1e1e !important } .black-bg * { color: white } .black-bg p { color: white } .google-apps-bg, .button.google-apps-bg:hover { background-color: #5e94ff !important } .button.google-apps-bg { border: none !important; color: white !important } .red-bg { background: #c64949 !important; overflow: hidden } .red-bg p, .red-bg * { color: white !important } .green-bg { background: #45b996 !important; overflow: hidden } .green-bg p { color: white !important } .grey-bg { background: #e6e7e8 !important; overflow: hidden } .grey-bg * { color: black !important } .grey-bg p { color: #000 !important } .grey-bg h2.sub-heading { color: black } .blue-bg { background: #5f93c8 !important; overflow: hidden } .blue-bg h2 { color: #fff } .blue-bg p { color: #000 } .grey-white-bg { background: #f8f8f8 !important; overflow: hidden } .grey-white-bg p { color: #000 } .light-grey-bg { background: #ebebeb !important; overflow: hidden } .light-grey-bg p { color: #000 } .light-grey-bg h2, .light-grey-bg p, .white-bg p { color: #000 !important } .black-bg .post-content { color: white } .arrow:after { content: "" !important; border-left: 25px solid transparent !important; border-right: 25px solid transparent !important; border-top: 25px solid white !important; position: absolute !important; bottom: -25px !important; left: 50% !important; margin-left: -25px !important; width: 50px !important; height: 25px !important; z-index: 99 !important } .arrow.grey:after { border-top-color: #dfdfdf !important } .arrow.black:after { border-top-color: black !important } .white-bg p { margin-bottom: 20px !important } .slight-dark-grey { background: #e6e6e6 !important; overflow: hidden } .white-heading { color: white; font-family: 'ralewayregular', sans-serif; font-size: 40px !important; margin-bottom: 20px } .wrapper iframe { display: block; line-height: 1; height: 100%; min-height: 200px } body>iframe { display: none } ::-webkit-input-placeholder { color: #808184; font-family: 'ralewayregular', sans-serif; font-size: 16px } :-moz-placeholder { color: #808184; font-family: 'ralewayregular', sans-serif; font-size: 16px } ::-moz-placeholder { color: #808184; font-family: 'ralewayregular', sans-serif; font-size: 16px } :-ms-input-placeholder { color: #808184; font-family: 'ralewayregular', sans-serif; font-size: 16px } .search-404 input[type="text"]::-webkit-input-placeholder { font-size: 18px } .search-404 input[type="text"]:-moz-placeholder { font-size: 18px } .search-404 input[type="text"]::-moz-placeholder { font-size: 18px } .search-404 input[type="text"]:-ms-input-placeholder { font-size: 18px } h1, h1 a { font-family: 'ralewaylight', sans-serif; font-size: 44px; line-height: 1.4 } h2, h2 a { font-family: 'ralewaylight', sans-serif; font-size: 40px; line-height: 1.4; margin-top: 10px; margin-bottom: 20px } h3, h4, h3 a, h4 a { font-family: 'ralewaylight', sans-serif; font-size: 30px; line-height: 1.4 } .custom-show-option { display: none } p, a, li { font-size: 16px; font-family: 'ralewayregular', sans-serif; color: #000; line-height: 1.4 } main a:hover { color: darkslategray } section { width: 100%; float: left; position: relative } .red-color { color: #c64949 !important } .blue-color { color: #5f93c8 !important } .green-color { color: #45b996 !important } .grey-color { color: #838484 !important } .red-link, .blue-link, section a { color: #c64949; font-family: 'ralewayregular', sans-serif } .blue-link { color: #83aacb !important } .red-link:hover, a:hover { color: #9a3a39 } .button { color: #000; font-family: 'ralewaymedium', sans-serif; background: transparent; display: inline-block; padding: 13px 20px; font-size: 20px; text-transform: uppercase; border: 1px solid black } button:hover, button:focus, .button:hover, .button:focus { background: transparent; color: black } .button:hover { background-color: #c64949 !important; border: 1px solid #c64949; color: white } .button.green, .button.green:hover { background-color: #45b996 !important; border-color: #45b996; color: white !important } .button.blue, .button.blue:hover { background-color: #5f93c8 !important; border-color: #5f93c8; color: white !important } .button.red, .button.red:hover { background-color: #c64949 !important; border-color: #c64949; color: white !important } .button.orange, .button.orange:hover { background-color: #f36339 !important; border-color: #f36339; color: white !important; margin-bottom: 0; height: auto; position: relative; top: -2px } .black-box .button.orange:hover { background-color: #f36339 !important } .button.green:hover, .button.blue:hover, .button.red:hover, .button.orange:hover, .button.google-apps-bg:hover { opacity: .6; -webkit-transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -ms-transition: opacity .25s ease-in-out; -o-transition: opacity .25s ease-in-out; transition: opacity .25s ease-in-out } .orange-hover.button:hover { background: #f36339 !important; border: 1px solid #f36339 } .contact-btn { color: black; margin-top: 30px; display: block; font-family: 'ralewaybold', sans-serif } .oj-border { border: 2px solid #f36339 } .round-button { background: url("../img/icons/submit-arrow.png") no-repeat center center; background-size: 10px; color: white; border: 2px solid white; border-radius: 50px; padding: 0 28px; text-indent: -9999em; display: inline-block } .custom.button { color: white; border-color: white; height: auto } .custom.button:hover { background: white !important; color: #c64949 !important; border-color: #c64949 } .padding-container { width: 100%; float: left; padding: 0 35px } .border-left { border-left: 1px solid #828283 } .border-right { border-right: 1px solid #828283 } .no-background { background-image: none !important } .background-image { background-size: cover; background-repeat: no-repeat; background-position: center center } .background-image .black-box { left: 40% } .rounded-input { background-image: url("../img/icons/submit-arrow.png"); background-repeat: no-repeat; background-position: 95% center; background-color: white !important; background-size: 10px; padding: 5px 50px 5px 20px !important; font-size: 16px !important; height: 46px !important; border-radius: 30px; font-family: 'ralewayregular', sans-serif !important; margin-bottom: 0 !important; cursor: text } .rounded-input:focus { background-image: url("../img/icons/submit-arrow.png") !important; background-repeat: no-repeat !important; background-position: 95% center !important; background-size: 10px !important } .arrow-button { margin-left: -1px; font-size: 16px; border: 0; background-image: url("../img/icons/submit-arrow.png"); background-repeat: no-repeat; background-position: center center; background-color: transparent; background-size: 10px; width: 50px; height: 50px; display: inline-block } .arrow-btn { display: inline-block; position: relative } .arrow-btn:after { content: '>'; position: absolute; top: -7px; right: -40px; padding-top: 4px; background: transparent; border: 1px solid white; border-radius: 100px; width: 30px; height: 30px; font-size: 14px } .sub-heading-section { padding: 55px 10px !important; z-index: 10 } .sub-heading-section:after { content: ""; border-left: 25px solid transparent; border-right: 25px solid transparent; border-top: 25px solid #1e1e1e; position: absolute; bottom: -25px; left: 50%; margin-left: -25px; width: 50px; height: 25px; z-index: 100 } .sub-heading-section.no-arrow:after { border: 0 !important } .feature { margin: 15px 0 } .feature img { max-width: 90% } .vps.feature img { margin-bottom: 20px } .feature h4, .vps.feature h4 { font-family: 'ralewaysemibold', sans-serif; font-size: 20px } .vps.feature h4 { margin-bottom: 10px !important } .vps.feature p { font-size: 18px } .feature p { font-family: 'ralewaylight', sans-serif; font-size: 16px } .feature p span { font-family: 'ralewaybold', sans-serif; font-size: 16px } .feature .black-bg td { color: white; padding: 15px 0; font-family: 'ralewayregular', sans-serif } .feature table tr td { text-align: center; font-family: 'ralewayregular', sans-serif } .feature table tr:nth-of-type(even) { background: transparent } .feature table tr { border-bottom: 1px solid #7f7f7f } #loading-icon { background: url("../img/loading/ajax-loader.gif") no-repeat center center; width: 50px; height: 50px; display: none; position: absolute; left: 50%; margin-left: -25px; top: -50px } .ease-of-use { margin-left: 0 !important; display: block; width: 100%; float: left } .full-circle, .full-circle-full { background-color: rgba(95, 147, 200, 0); border: 1px solid #333; height: 20px; width: 20px; -moz-border-radius: 75px; -webkit-border-radius: 75px; float: left; list-style-type: none; margin-right: 5px } .full-circle-full { background-color: rgba(95, 147, 200, 1) !important; border: none !important } .popcorn:after { content: ''; background-image: url("../img/icons/popcorn.png"); background-position: center center; background-repeat: no-repeat; position: absolute; width: 53px; height: 65px; background-size: 55px; left: 110%; top: 0 } input[type=radio].css-checkbox { display: none } input[type=radio].css-checkbox+label.css-label { padding-left: 50px; display: inline-block; line-height: 25px; background-position: 0 -60.5px; background-repeat: no-repeat; vertical-align: middle; cursor: pointer; font-family: 'ralewaybold', sans-serif; font-size: 20px; width: 100%; max-width: 300px; min-height: 25px } input[type=radio].css-checkbox:checked+label.css-label { background-position: 0 0; color: black } label.css-label { background-image: url('../img/icons/radio-btn.png'); -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-size: 25px } .section-arrow { width: 80px; height: 80px; position: absolute; bottom: 15px; left: 50%; margin-left: -40px; background: url("../img/icons/down-arrow.png") no-repeat center center; -webkit-animation: fade-in-out 5s infinite; -moz-animation: fade-in-out 5s infinite; -o-animation: fade-in-out 5s infinite; animation: fade-in-out 5s infinite; z-index: 10; cursor: pointer } @-webkit-keyframes fade-in-out { 0% { opacity: .25 } 50% { opacity: 1 } 100% { opacity: .25 } } @-moz-keyframes fade-in-out { 0% { opacity: .25 } 50% { opacity: 1 } 100% { opacity: .25 } } @-o-keyframes fade-in-out { 0% { opacity: .25 } 50% { opacity: 1 } 100% { opacity: .25 } } @keyframes fade-in-out { 0% { opacity: .25 } 50% { opacity: 1 } 100% { opacity: .25 } } .navigation { float: left; margin-top: 50px } .navigation ul { margin: 25px 0 } .navigation li a, .navigation li a:hover, .navigation li.active a, .navigation li.disabled { color: #fff !important; text-decoration: none } .navigation li { display: inline } .navigation li a, .navigation li a:hover, .navigation li.active a, .navigation li.disabled { background-color: #c64949; border-radius: 3px; cursor: pointer; padding: 12px; padding: .75rem } .navigation li a:hover, .navigation li.active a { background-color: #9a3a39 } .display-hidden { margin-top: 50px } .display-hidden .button.plus { padding: 13px 50px 13px 35px; text-transform: none } .display-hidden .button.plus:after { content: url("../img/icons/plus.png"); position: relative; right: -20px; top: 3px } .display-hidden .hidden-content { display: none; padding: 30px 30px 10px; max-width: 375px; margin: 0 auto } .display-hidden .hidden-content p { color: white } .hidden-features, .hidden-text { display: none } .promotion { background: #c64849; position: absolute; right: 0; bottom: -225px; border-radius: 1000px; max-width: 450px; max-height: 450px; width: 100%; height: 100%; padding: 30px } .promotion p.promotion-heading { font-size: 50px; font-family: 'ralewaybold', sans-serif; text-transform: uppercase; margin: 0; color: white } .promotion p { margin-bottom: 10px; font-size: 16px; text-transform: uppercase; font-family: 'ralewaysemibold', sans-serif; color: white } .promotion p span { margin-bottom: 10px; font-size: 18px; text-transform: uppercase; font-family: 'ralewaylight', sans-serif; color: white } .promotion p span span { background: #a93f3f; padding: 5px } .promotion a { font-family: "ralewaybold", sans-serif; font-size: 16px; color: black; text-transform: uppercase } .promotion hr { border: 1px solid white; max-width: 50px; margin: 0 auto; margin-bottom: 20px } .promotion.mobile { display: none } .no-visibility { visibility: hidden } .call-out { position: fixed; top: 50%; margin-top: -35px; width: 80px; z-index: 9999; background: black; border-top: 5px solid #e6e7e9; padding: 5px 5px 10px 0; text-align: center; cursor: pointer; display: none } .call-out p { color: white; font-family: 'ralewaysemibold', sans-serif; font-size: 18px } .triangle { position: relative; top: -15px } .triangle:before, .triangle:after { content: ""; position: absolute; bottom: -17px; left: 23px; border-width: 13px 13px 0; border-style: solid; border-color: #e6e7e9 transparent } .triangle:after { bottom: -10px; border-color: #000 transparent } .call-out.vps, .call-out.vps .triangle:before { border-color: #5f94ca transparent } .call-out.reseller, .call-out.reseller .triangle:before { border-color: #44ba97 transparent } .call-out.web, .call-out.web .triangle:before { border-color: #c64849 transparent } .off-grid-image { position: absolute; left: -210px; right: auto } .text-image.on-grid { margin-top: 20px } .text-image.off-grid-image.right { left: auto; right: -270px } #TB_window #TB_ajaxContent { overflow: hidden; width: 100% !important; height: 100% !important } #TB_ajaxContent .orange.button { width: 100%; top: 0 } header { -webkit-box-shadow: 1px 3px 5px 0 rgba(50, 50, 50, 0.3); -moz-box-shadow: 1px 3px 5px 0 rgba(50, 50, 50, 0.3); box-shadow: 1px 3px 5px 0 rgba(50, 50, 50, 0.3); z-index: 200; position: fixed; width: 100%; background: white } .notification-panel { background: #000; z-index: 99 } .current-page-parent a, .main-nav .current_page_item a, ul.sub-menu .current_page_item a, ul.sub-menu .current_page_item:hover a { color: black !important } header nav ul { float: right; margin: 0; position: relative; list-style-type: none; display: inline-block } nav ul li { float: left; position: relative; padding: 5px 10px } nav ul li a { display: block } .main-nav ul li { padding: 30px 25px 30px 20px; min-width: 135px } .main-nav ul li a { letter-spacing: 1px } .main-nav>ul>li:last-child { padding-right: 10px; text-align: right } .main-nav>ul>li:after { content: ""; background-image: url("/resources/assets/frontend/img/crucial/nav-arrow.png"); background-position: right -1%; background-repeat: no-repeat; background-size: 60%; width: 23px; height: 10px; position: absolute; right: 7px; top: 39px } .main-nav>ul>li:first-child:after, .link-arrow:after { content: ""; background-image: url("/resources/assets/frontend/img/crucial/dropdown-arrow.png") !important; background-position: right 102%; background-repeat: no-repeat; background-size: 60%; width: 23px; height: 10px; position: absolute; right: 7px; top: 39px } .main-nav>ul>li:last-child:after, .main-nav>ul>li:last-child:hover:after { content: ""; background: url("") } .main-nav>ul>li:hover:after, nav ul .current-page-ancestor:after, nav ul .current-menu-item:after, .link-arrow:hover:after { background-image: url("/resources/assets/frontend/img/crucial/nav-arrow.png"); background-position: right 102%; background-repeat: no-repeat; background-size: 60%; width: 23px; height: 10px; position: absolute; right: 7px; top: 39px } nav ul .menu-item:hover a { color: #c64949 } ul.sub-menu { display: none; position: absolute; z-index: 999; left: 0; background: #f5f5f5; top: 100%; padding: 10px 0 } ul.sub-menu li { float: none; padding: 7px 20px } ul.sub-menu li a { white-space: nowrap; letter-spacing: normal; color: #000 !important } ul.sub-menu li:hover a { color: #c64949 !important } nav ul li:hover>ul { display: block } .notification-panel p, .notification-panel a { color: #45b996; text-transform: uppercase; padding: 5px 0; margin: 0; text-align: center; font-family: 'ralewaybold', sans-serif; font-size: 14px } .header-search { margin: 0; position: relative } .header-search a { margin: 0; background: url("/resources/assets/frontend/img/crucial/search-icon.png") no-repeat center center; background-size: 35px; border: 0; width: 50px; min-height: 30px; position: relative; top: 0; left: 0; z-index: 9999; cursor: pointer; float: right; text-indent: -9999em } .header-search input[type="text"] { margin-top: 10px; position: relative; top: -8px; width: 200px; display: none; padding: 2px 25px 2px 10px !important; height: auto !important; background-size: 7px !important; background-image: none !important } .header-search input[type="submit"] { display: none; position: absolute; right: 40px; top: -10px; background-size: 7px; border: 0 !important } header a.phone { padding: 4px 10px 5px 25px; display: block; background: url("/resources/assets/frontend/img/crucial/phone.png"); background-size: 18px; background-repeat: no-repeat; background-position: left center; font-size: 15px; font-family: 'ralewaylight', sans-serif } .mini-nav ul li:hover { background: #c64949 } .mini-nav ul li:hover a { color: white } .mini-nav { background: #f5f5f5; height: 30px; z-index: 99 } .mini-nav ul li { background: #d6d6d6; border-right: 1px solid #f5f5f5 } .hiring { background-color: transparent; background-image: url("../img/icons/beer-mug.png"); background-repeat: no-repeat; background-position: 13px 80%; background-size: 15px; padding-left: 22px; padding-right: 12px } .hiring a { color: #c64949 !important; font-family: 'ralewaysemibold', sans-serif !important; font-size: 13px !important; padding-left: 10px !important; padding-top: 7px; display: inline-block; float: right } .mini-nav ul { margin: 0 !important } .mini-nav a { font-size: 13px; font-family: 'ralewayregular', sans-serif } #site-title, .site-title { margin: 14px 0; float: left } header #site-title img, header .site-title img { float: left; max-width: 184px } nav a { font-size: 16px; font-family: 'ralewayregular', sans-serif; color: #000 } .call-icon { text-align: right } .call-icon a { position: relative; right: 20px } .call-icon img { max-width: 25px; margin-top: 23px } .dl-trigger { margin: 14px 0 0; background: white !important } .dl-menuwrapper button:after { background: black !important; box-shadow: 0 10px 0 #000, 0 20px 0 #000 !important } .dl-menuwrapper .dl-menu { right: 0; top: 67px; min-width: 310px; background: #000; display: none } .dl-menuwrapper .dl-menu.dl-menuopen { display: block } .dl-menuwrapper li { width: 100%; z-index: 9 } ul.dl-menu li a, ul.dl-menu ul.sub-menu li a { padding: 10px 20px !important; color: #848484 !important } .dl-menu>li:hover>a { color: white !important } .dl-menuwrapper li>a:after { color: white !important } .dl-menuwrapper li .dl-submenu { min-width: 320px; background: black; top: 0; z-index: 10 } .black-box { position: absolute; top: 78px; left: 7%; padding: 25px; background: rgba(0, 0, 0, 0.8); width: auto; max-width: 355px } .black-box h1 { margin-top: 0; margin-bottom: 25px; font-family: 'ralewaylight', sans-serif; font-size: 40px; color: white } .black-box h2 { margin-top: 0; margin-bottom: 10px; font-size: 22px !important; color: white } .black-box .button, .red.button { color: white; font-family: 'ralewayregular', sans-serif; background: #c64949; display: inline-block; font-size: 21px; text-transform: uppercase; padding: 13px 20px; height: auto } .black-box .button:hover { background: #9a3a39 !important; border: 1px solid #9a3a39 } .black-box p { font-size: 16px; color: #cecece; font-family: 'ralewayregular', sans-serif } .black-box p span { font-size: 16px; color: white; font-family: 'ralewaybold', sans-serif; display: inline-block } .black-box p a { font-size: 16px; color: #c64949; font-family: 'ralewaybold', sans-serif } .flex-control-nav { bottom: 20px } .flex-control-paging li a { background: transparent; box-shadow: none; border: 1px solid black } .flex-control-paging li a.flex-active { position: relative; color: black } .flexslider .flex-content { padding-left: 10px; padding-right: 10px } .flexslider .flex-content h1 { font-size: 35px; color: white; font-family: 'ralewayregular', sans-serif; width: 100% } .flex-content .flex-button a { font-family: 'ralewayregular', sans-serif; background: #c64949; color: black !important; border: 1px solid black !important } .flexslider .flex-direction-nav a { opacity: 1 } .flexslider .flex-direction-nav { bottom: 50% !important } .domain { background: #f5f5f5; padding: 47px 0 } .domain form { margin: 0 } .domain h2 { font-size: 34px; text-align: right; margin: 0 } .domains-page .header-image .domain-name { background-color: rgba(255, 255, 255, 0.9) !important; margin-top: 100px; padding: 50px 30px } .header-image .domain-name { padding: 20px } .header-image .domain-name h1 { margin-top: 0; color: black } .domain-name form .rounded-input { border: 1px solid black; background: white !important; padding-left: 55px !important; padding-right: 0 !important; height: 45px } .domain-name input[type="text"], .domain-name input[type="text"]:focus { background-color: transparent !important; width: auto; float: left; border-radius: 30px; box-shadow: none; border: 0; font-family: 'ralewaybold', sans-serif; font-size: 16px; padding-left: 0 !important; padding-right: 0 !important; transition: width .15s; text-indent: 0 !important; height: 33px; padding-top: 12px } .domain-name select { position: relative; width: 85px; right: -5px; top: 0; height: 35px; background-color: #f3f0f0; color: black; padding: 5px; border: 0; font-family: 'ralewaylight', sans-serif; float: left; display: none; z-index: 90 } .domain-name label { position: relative; left: -8px; font-size: 20px; margin-top: 11px } .domain-name .arrow-button { position: absolute; top: -3px; right: 10px } .domain-name .arrow-button:focus { border: 0 } .domain-name a { display: block; margin-top: 10px } .options { margin-top: 120px } .options:after { content: ""; border-left: 25px solid transparent; border-right: 25px solid transparent; border-top: 25px solid white; position: absolute; bottom: -25px; left: 50%; margin-left: -25px; width: 50px; height: 25px; z-index: 99 } .options.no-arrow:after { border: 0 } h2.sub-heading { color: #bdbec0; margin-bottom: 10px; font-size: 30px } p.sub-heading, .sub-heading-section p { color: #bdbec0; margin-bottom: 5px; font-size: 16px } .sub-heading-section p span { font-size: 14px; margin: 10px 0; display: inline-block } .flex-direction-nav { display: block !important } .option { position: relative; margin: 0 0 125px; min-height: 350px } .option .launch, .option .transform, .option .amplify { background-repeat: no-repeat; background-position: center center; background-size: 15%; padding-top: 100px } .option:after, .tab-title:after { content: ''; border-left: 25px solid transparent; border-right: 25px solid transparent; border-bottom: 25px solid #dfdfdf; position: absolute; bottom: -37%; left: 50%; margin-left: -25px; width: 50px; height: 25px; z-index: 99; display: none } .tab-title:after { bottom: -20px } .display:after, .tab-title.active:after { display: block !important } .option .transform { background-position: center 25% } .option .amplify { background-position: center 45% } .option .transform { background-size: 25% } .option .amplify { background-size: 40% } .user-groups .option .button { position: absolute; bottom: 0; max-width: 190px; width: 100%; margin-left: -95px; left: 50%; font-family: 'ralewaymedium', sans-serif; font-size: 24px } .user-groups h2, .flex-content h2 { font-family: 'ralewayextrabold', sans-serif; font-size: 52px !important; margin-bottom: 0; line-height: 1 } .flex-content h2 { color: black !important } .user-groups h3 { display: block; font-family: 'ralewaybold', sans-serif; font-size: 34px; line-height: 1 } .user-groups p { display: block; font-family: 'ralewaylight', sans-serif; font-size: 20px } .services { background-position: center bottom; background-repeat: no-repeat; background-size: cover; padding: 100px 0 } .services .sub-heading { margin-bottom: 60px; background: 0; color: black } .service { padding: 20px 30px 60px; background: #e4e4e3; opacity: .8; float: none; margin: 0 auto } .service img { max-width: 47% !important } .service h2 { color: #000; margin-bottom: 20px; font-family: 'ralewaybold', sans-serif; font-size: 34px } .service p.bold-text, .bold-text { font-family: 'ralewaybold', sans-serif; font-size: 20px; margin-bottom: 15px } .medium-text { font-family: 'ralewaymedium', sans-serif; font-size: 20px } .light-text { font-family: 'ralewaylight', sans-serif; font-size: 20px } .service p { margin-bottom: 70px } .service p, .service p span { display: block; font-size: 20px } .service .button { max-width: 200px; width: 100%; left: 50%; margin-left: -100px; position: absolute; bottom: 5px; margin-bottom: 25px !important; padding: 15px 20px !important; height: auto !important; font-size: 20px !important } .social-feed { background: #1e1e1e; padding: 100px 0 } .social-feed img { max-width: 84px } .social-feed h2 { color: white; font-family: 'ralewaybold', sans-serif; font-size: 34px; margin-bottom: 40px } .social-feed p { color: white; font-family: 'ralewaylight', sans-serif; font-size: 34px } .join-up, .our-blog { position: relative } .join-up .content-block, .our-blog .content-block { position: absolute; left: 50%; top: 60%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%) } .our-blog h3 { color: #c64949 } .our-blog .subheading { font-family: 'ralewaybold', sans-serif; font-size: 30px; margin-bottom: 0 } .contact { padding: 40px 0 !important } .contact h2 { margin-bottom: 30px } #contact p { font-size: 26px } .contact .button { width: 100%; top: 0 !important } .btn-img img { margin-bottom: 20px; max-width: 70px } .contact .phone img { max-width: 55% !important } .ninja-forms-form input, .ninja-forms-form textarea { border: 1px solid #000; color: #979797; font-family: 'ralewayregular', sans-serif; font-size: .875rem } .ninja-forms-form textarea { margin: 0 0 1rem 0 } .ninja-forms-form input { height: 40px !important } #contact .ninja-forms-form input, .ninja-forms-field { width: 100% !important; border: 1px solid #000; font-family: 'ralewayregular', sans-serif; font-size: .875rem; transition: box-shadow .45s, border-color .45s ease-in-out; background-color: white } .list-dropdown-wrap .ninja-forms-field-error { margin-top: 16px } .ninja-forms-form-wrap select:hover { background-color: white !important; border: 1px solid #000 !important } .ninja-forms-form input[type="submit"] { font-size: 20px !important; margin-bottom: 0 !important; border-color: #f36339 !important } .ninja-forms-form .button { padding: 8px } .request.button { padding: 10px 5px; max-width: 300px } .ninja-forms-error-msg p, .ninja-forms-success-msg p { font-size: 24px; margin-bottom: 0 } .ninja-forms-error-msg p { color: #c64949; display: none } .ninja-forms-field-error { color: #c64949; font-family: 'ralewayregular', sans-serif } .ninja-forms-success-msg p { color: #45b996 } #contact .ninja-forms-response-msg { position: absolute; top: 100%; padding: 0 5px } #contact .textarea-wrap.label-inside textarea { height: 175px } #ajax-loader main { margin-top: 0 !important } .header-image, .custom-row { width: 100%; min-height: 515px; background-size: cover; background-repeat: no-repeat; background-position: center center } .custom-row { overflow: hidden } .header-image img { width: 100% } .header-image h1 { color: white; font-family: 'ralewaylight', sans-serif; font-size: 44px; line-height: 1.2 } .red.button { margin-bottom: 0 } .post-content { font-size: 30px; font-family: 'ralewaylight', sans-serif; margin-bottom: 35px } .post-image, .background-image { background-repeat: no-repeat; background-size: cover; background-position: center center } .post-image img, .background-image img { display: none } .person-image img { position: absolute; bottom: 0; max-width: 350px; right: 0 } .success-content h2 { color: white; margin-bottom: 30px } .success-content p { font-size: 30px } .success-content p span { font-size: 24px } #ajax-loader .black-box { bottom: 30px; top: auto; left: 25%; margin: 0 auto; position: absolute } .blue-bg .button.custom:hover { color: #5f93c8; border-color: #5f93c8 } .red-bg .button.custom:hover { color: #c64949; border-color: white } .green-bg .button.custom:hover { color: #45b996; border-color: white } .get-started h2 { display: inline-block } .add-on-list { padding: 85px 0 } .add-on-list .sub-heading { text-align: center; color: #000 } .add-on-list p.sub-heading { font-size: 24px; margin-bottom: 50px } .add-on { margin: 0 0 30px } .add-on p { font-family: 'ralewaylight', sans-serif; font-size: 16px } .add-on .black-bg td { color: white; padding: 15px 0; font-family: 'ralewayregular', sans-serif } .add-on table tr td { text-align: center; font-family: 'ralewayregular', sans-serif } .add-on table tr:nth-of-type(even) { background: transparent } .add-on table tr { border-bottom: 1px solid #7f7f7f } .faq h3 { font-family: 'ralewaysemibold', sans-serif; font-size: 24px; margin-bottom: 40px } .faq .bold-text { margin-bottom: 0; font-size: 14px } .features { z-index: 12 } .page.ssl { padding: 0 !important } .ssl-page .payment h3, .ssl h3 { font-family: 'ralewaybold', sans-serif; font-size: 20px; line-height: 1 } .ssl-page .payment h4, .ssl h4 { font-size: 20px; line-height: 1; margin-bottom: 15px } .ssl-page p, .ssl p { padding-left: 0; margin-top: 15px; margin-bottom: 15px } .ssl-page .payment .price, .ssl .price { font-size: 30px; font-family: 'ralewaylight', sans-serif } .ssl-page .payment .button, .ssl .button { width: 100% } .ssl-list h2 { margin-bottom: 60px } .ssl { background: #e6e6e6; padding: 30px; margin-bottom: 20px } .ssl p { color: #000 } #option_content { background: #dfdfdf; position: relative } #option_content p { font-size: 16px; font-family: 'ralewaylight', sans-serif } .getting-started h4 { font-size: 24px; margin-bottom: 30px } .getting-started .feature p, .getting-started .feature p span { font-size: 14px; color: #000 } #ajax-loader { display: none } .success .post-image { min-height: 400px } .press-articles article { border-top: 1px solid #000; padding: 25px 0 } .press-title h2 { font-size: 25px; padding: 25px 0; margin: 0 } .press-title h2:hover { text-decoration: underline } .press-date p { font-size: 18px; padding: 30px 0; margin-bottom: 0 } .textwidget * { font-size: 24px } .header-image.affiliate { min-height: 750px } .clickToDisplay { display: none; font-size: 40px } .cost-estimate { top: 50px; padding: 30px 100px; background-color: rgba(255, 255, 255, 1) !important } .cost-estimate .pricing-table { padding: 15px 25px 25px; margin-bottom: 12px !important } .cost-estimate h1 { color: #000; margin-top: 0; margin-bottom: 10px } .cost-estimate h4 { font-family: 'ralewaylight', sans-serif; line-height: 1.2; margin-bottom: 30px } .cost-estimate input[type="text"] { display: block; text-align: center; height: 65px; font-family: 'ralewayregular', sans-serif; font-size: 20px; background-color: #ebebeb; border: 2px solid #f36339 } .referral-amount img { max-width: 80px; margin-top: 30px; margin-bottom: 10px } .referral-amount p { font-size: 20px; font-family: 'ralewayregular', sans-serif } .referral-amount p span { font-size: 35px; font-family: 'ralewaymedium', sans-serif } .cost-estimate input[type="text"]::-webkit-input-placeholder { font-size: 20px; font-family: 'ralewayregular', sans-serif; color: #000 } .cost-estimate input[type="text"]:-moz-placeholder { font-size: 20px; font-family: 'ralewayregular', sans-serif; color: #000 } .cost-estimate input[type="text"]::-moz-placeholder { font-size: 20px; font-family: 'ralewayregular', sans-serif; color: #000 } .cost-estimate input[type="text"]:-ms-input-placeholder { font-size: 20px; font-family: 'ralewayregular', sans-serif; color: #000 } .ninja-forms-form input[type="text"]::-webkit-input-placeholder, .ninja-forms-form textarea::-webkit-input-placeholder { font-size: .875rem; font-family: 'ralewayregular', sans-serif; color: #979797 } .ninja-forms-form input[type="text"]:-moz-placeholder, .ninja-forms-form textarea:-moz-placeholder { font-size: .875rem; font-family: 'ralewayregular', sans-serif; color: #979797 } .ninja-forms-form input[type="text"]::-moz-placeholder, .ninja-forms-form textarea::-moz-placeholder { font-size: .875rem; font-family: 'ralewayregular', sans-serif; color: #979797 } .ninja-forms-form input[type="text"]:-ms-input-placeholder, .ninja-forms-form textarea:-ms-input-placeholder { font-size: .875rem; font-family: 'ralewayregular', sans-serif; color: #979797 } .cost-estimate .button { height: auto; font-size: 24px; padding: 15px 25px; margin: 0 10px 10px 0; display: none; max-width: 250px; margin: 0 auto } .cost-estimate form { position: relative } .cost-estimate form .reset { position: absolute; right: 20px; top: 17px; font-size: 20px; display: none; display: none } .cost-estimate #costEstimate:hover .reset { display: block } .pricing-table .clickableLinks, .clickableLinks a { font-size: 13px; margin-bottom: 0 !important } .pricing-table p:first-child { margin-bottom: 0 !important } #referralImage { max-width: 112px } .special-offer .header-image .custom-row { min-height: 670px } .special-offer .header-image { background-repeat: repeat; background-size: auto } .special-offer .header-image img { max-width: 50px } .special-offer .black-box { max-width: 50%; left: 0; padding-bottom: 0 } .special-offer .black-box h1 { font-family: "ralewaysemibold", sans-serif } .special-offer .black-box h2 { margin-bottom: 20px; font-family: "ralewayregular", sans-serif } .special-offer .black-box h2 span, .discount-code { background: #f8f8f8; display: inline-block; padding: 5px } .discount-code { background: transparent; border: 1px solid black } .special-offer .black-box p.disclaimer span { position: relative; bottom: -10px; font-size: 14px; font-family: "ralewaylight", sans-serif } .special-offer .black-box p { font-size: 20px; font-family: "ralewaylight", sans-serif } .special-offer .hosting-features { position: relative; top: 78px; right: 0 } .special-offer .hosting-features h3 { font-family: "ralewaysemibold", sans-serif; font-size: 18px } .special-offer .hosting-features p { font-family: "ralewaylight", sans-serif; font-size: 20px } .special-offer .hosting-features .feature { margin: 0 } .special-offer .hosting-features .feature p { font-size: 16px } .hosting-features .show-more-features, .arrow-btn-down { color: black; font-family: "ralewaysemibold", sans-serif; position: relative; margin-top: 30px; display: inline-block } .hosting-features .show-more-features:after, .arrow-btn-down:after { content: ''; width: 15px; height: 15px; position: absolute; background: url("../img/icons/down-arrow.png") no-repeat center center; cursor: pointer; right: -40px; border: 1px solid #000; border-radius: 50px; padding: 15px; background-size: 15px; top: -5px } .arrow-btn-down { font-size: 16px; margin-top: 0; margin-bottom: 10px } .arrow-btn-down:hover, .arrow-btn:hover, .hosting-features .show-more-features:hover { color: #c9253a } .hosting-features .show-more-features:hover:after { background: #fff; border-color: #c64949; background: url("../img/icons/down-arrow.png") no-repeat center center; background-size: 15px } .virtual-server { margin-top: 90px } .virtual-server .option { padding: 45px 0 0; margin-bottom: 0; min-height: 450px; -webkit-transition: background .25s ease-in-out; -moz-transition: background .25s ease-in-out; -ms-transition: background .25s ease-in-out; -o-transition: background .25s ease-in-out; transition: background .25s ease-in-out; cursor: pointer } .special-offer .virtual-server .option { cursor: auto } .virtual-server .option.popular, .virtual-server .option.active, .virtual-server .option:hover { background: #cfdfef !important } .option .selectButton { padding: 20px 35px; position: absolute; bottom: 0; background: #cfcfcf; -webkit-transition: background .25s ease-in-out; -moz-transition: background .25s ease-in-out; -ms-transition: background .25s ease-in-out; -o-transition: background .25s ease-in-out; transition: background .25s ease-in-out } .special-offer .option .selectButton { position: relative } .option.popular .selectButton { background: #a9c3de } .option:hover .selectButton, .option.active .selectButton { background: #5a97cd !important } .option .half-circle { display: none } .virtual-server .option.popular .half-circle, .popular .half-circle { background: #5a97cd; color: white !important; padding: 58px 15px 0; border-radius: 70px; width: 110px; height: 110px; text-align: center; position: absolute; top: -52px; right: 20px; display: block; font-family: 'ralewaybold', sans-serif; font-size: 14px } .virtual-server h4 { margin-top: 45px; text-align: center; font-size: 30px } .product-heading { font-family: 'ralewaybold', sans-serif; font-size: 20px; margin: 0 } .product-desc { font-family: 'ralewaylight', sans-serif !important; font-size: 20px; color: #000 !important } .option-list li:nth-child(even) { font-family: 'ralewaysemibold', sans-serif; padding: 5px 0 } .select-option { text-align: center } .payment { padding: 23px 25px } .payment input[type="radio"].css-checkbox+label.css-label { padding-left: 40px; margin-top: 20px; margin-bottom: 20px; font-family: 'ralewaylight', sans-serif !important; font-size: 30px !important } .payment input:disabled[type="radio"].css-checkbox+label.css-label { opacity: .3 } .payment p { margin: 0; font-size: 14px; padding-left: 30px; color: #000 } .payment label p { margin-bottom: 0; text-align: left; font-size: 16px; font-family: 'ralewaybold', sans-serif; margin-top: 10px } .web-hosting .payment { margin-top: 25px; margin-bottom: 0 } .web-hosting .payment .button.orange, .web-hosting .payment .button.orange:hover { margin-left: 0; margin-top: 20px; margin-bottom: 10px } .meet-team-slides img { max-width: 100% !important } .the-team .row { position: absolute; left: 50%; margin-left: -590px; top: 90px } .meet-team h2 { font-family: 'ralewaysemibold', sans-serif } .member-info { width: 25%; float: left; margin: 25px 0 } .member-info p { text-align: left; color: white; margin-bottom: 5px; font-family: 'ralewaylight', sans-serif } .member-info a { color: #838484; font-family: 'ralewaylight', sans-serif } .member-info a:hover { color: white } .partners .helper-extra-top-padding { padding: 35px 0 !important } .partners article h2 { margin-bottom: 15px } .partners article h3 { font-size: 18px; display: block; font-family: 'ralewaysemibold', sans-serif; margin-bottom: 30px } .partners article .author span { font-family: 'ralewaysemibold', sans-serif } .purpose h2 { margin-bottom: 20px } .purpose p { font-family: 'ralewaylight', sans-serif } .values img { width: 70px } .values h4 { font-family: 'ralewaybold', sans-serif; font-size: 14px; margin-top: 20px } .values p { font-family: 'ralewaylight', sans-serif; font-size: 14px } .domain-info h3 { font-size: 20px; font-family: 'ralewaybold', sans-serif; padding: 10px 0 10px 60px; text-align: left; background-image: url("../img/icons/server.png"); background-size: 35px; background-repeat: no-repeat; background-position: left center } .domain-info table { background: transparent; border: 0 } .domain-info .black-bg td { color: white; padding: 15px 0; font-family: 'ralewayregular', sans-serif } .domain-info table tr td { text-align: center; font-family: 'ralewayregular', sans-serif } .domain-info table tr:nth-of-type(even) { background: transparent } .domain-info table tr { border-bottom: 1px solid #7f7f7f } .getintouch-page .custom-show-option { display: none !important } .getintouch-page .header-image .contact { padding: 0 !important; margin-top: 100px } .getintouch-page .header-info { opacity: .9; padding: 30px 30px 30px 15px } .getintouch-page .contact p { margin-bottom: 5px } .getintouch-page .contact .contact-info { padding: 20px } .location .post-image { height: 100%; min-height: 500px } .location-info { padding: 40px } #post-404 h1 { font-size: 40px; font-family: 'ralewayextrabold', sans-serif } #post-404 a { color: #c0392b; font-family: 'ralewaybold', sans-serif; font-size: 20px; margin-bottom: 50px; display: inline-block } .search-404 input[type="text"] { height: 50px; font-size: 18px } .search-404 input[type="submit"] { background: url("../img/icons/submit-arrow.png") no-repeat center right; position: absolute; top: 17px; right: 30px; border: 0; margin-bottom: 50px } .single-post-image img { width: 100% } .social-section { white-space: normal; text-align: left; width: 100%; color: white; padding: 20px; overflow: hidden; margin-bottom: 20px } .social-section .height { min-height: 130px } .social-section .button:hover { background: transparent !important; border-color: white } .social-section h4, .social-section p { color: white } .twitter-bg, .twitter-bg .social-footer { background-color: #45b0e3 } .facebook-bg, .facebook-bg .social-footer { background-color: #39599f } .google-bg, .google-bg .social-footer { background-color: #de4444 } .social-image { position: relative; bottom: 17px; text-align: right } .social-image img { max-width: 50px } .social-footer { position: absolute; bottom: 0; left: 0; padding-top: 20px } .twitter-bg .social-footer { -webkit-box-shadow: 0 -15px 20px 0 rgba(69, 176, 227, 1); -moz-box-shadow: 0 -15px 20px 0 rgba(69, 176, 227, 1); box-shadow: 0 -15px 20px 0 rgba(69, 176, 227, 1) } .facebook-bg .social-footer { -webkit-box-shadow: 0 -15px 20px 0 rgba(57, 89, 159, 1); -moz-box-shadow: 0 -15px 20px 0 rgba(57, 89, 159, 1); box-shadow: 0 -15px 20px 0 rgba(57, 89, 159, 1) } .google-bg .social-footer { -webkit-box-shadow: 0 -15px 20px 0 rgba(222, 68, 68, 1); -moz-box-shadow: 0 -15px 20px 0 rgba(222, 68, 68, 1); box-shadow: 0 -15px 20px 0 rgba(222, 68, 68, 1) } .footer { background: #000 } footer #site-title, footer .site-title { margin: 0; padding: 50px 0 30px; float: none } .footer-widgets { margin-top: 60px } .footer-widgets h3 { color: white; font-family: 'ralewaybold', sans-serif; font-size: 14px; margin-bottom: 20px } .footer-widgets ul { margin: 0 } .footer-widgets ul li { list-style-type: none; margin-bottom: 10px } .footer-widgets ul li a { color: #cccecf !important; font-family: 'ralewayregular', sans-serif; font-size: 14px } #menu-footer-resources li:last-child { margin-top: 50px } #menu-footer-resources li:last-child a, .back-to-top a { font-family: 'ralewaylight', sans-serif; font-size: 17px; color: white; margin-bottom: 50px; display: block } #menu-footer-resources li:last-child a:after, .back-to-top a:after { content: ''; color: white; background: url("/resources/assets/frontend/img/crucial/back-top-arrow.png") no-repeat center right; height: 20px; background-size: 20px; padding-left: 30px; display: inline-block; position: absolute } .menu li:hover a, .back-to-top a:hover { color: #c64949 !important } .contact-phone a, .contact-phone p { font-family: 'ralewaymedium', sans-serif; color: #cccecf !important; font-size: 20px; padding-left: 30px; display: block } .contact-phone a:hover, .contact-phone p:hover { color: white !important } .contact-phone a.ticket { font-size: 16px; margin-bottom: 30px; background: url("/resources/assets/frontend/img/crucial/white-tickets.png") no-repeat center left; background-size: 20px } .contact-phone a.phone { background: url("/resources/assets/frontend/img/crucial/white-phone.png") no-repeat center left; background-size: 15px } .social-buttons { list-style-type: none; margin-top: 1.25rem } footer .social-buttons { margin-top: 0 } .social-buttons li { margin-bottom: 10px; padding-left: 0 } #mc-embedded-subscribe-form { position: relative } .news-letter { float: left !important } .news-letter p { color: #cccecf; font-size: 18px } .news-letter .rounded-input { max-width: 100%; margin: 0 auto; background-image: none !important } .news-letter input[type="submit"] { position: absolute; text-indent: -9999em; right: -5px; top: -2px } .copyright { background: #898b8d; padding: 10px 0; margin-top: 86px } .copyright p, .copyright a { color: #000; margin-bottom: 0 } .copyright a:hover { color: white } .designby { display: block } .logo-list { margin-top: 60px; float: left !important } .logo-items { float: right; width: 100% } .logo-list li { list-style-type: none; float: left; text-align: right } .logo_single img { opacity: .7; -webkit-transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -ms-transition: opacity .25s ease-in-out; -o-transition: opacity .25s ease-in-out; transition: opacity .25s ease-in-out; width: 100px } .logo_single:hover img { opacity: 1 } .logo_single a { display: block } .live-chat { position: fixed; bottom: 0; right: 0; width: 15%; max-width: 200px; min-width: 100px } .live-chat input[type="submit"] { width: 100%; height: 40px; font-size: 20px; background: #000; border: 0; color: white; font-family: 'ralewaysemibold', sans-serif } #secondary { margin-top: 35px } .sidebar ul, .sidebar li, .widget-area ul, .widget-area li { list-style-type: none; margin-left: 0; background: none !important } .sidebar ul li a, .widget-area ul li a { font-size: 18px; font-family: 'ralewaylight', sans-serif; display: inline-block; width: 100%; margin: 5px 0 } .sidebar ul li a:hover, .widget-area ul li a:hover { color: #cecece } .textwidget { background: #cecece; padding: 15px; margin-bottom: 10px } .search-page .search-input { width: 90% } .search-results span { color: black; font-family: 'ralewayregular', sans-serif } body { background: white !important } .alignnone { margin: 0 !important } .row { position: relative } .halfrow { width: 100%; max-width: 590px; margin: 0 auto; position: relative } span.prefix { padding: 0; border: 0; background: 0; width: auto; font-family: 'ralewaylight', sans-serif; font-size: 16px; position: absolute } .one-third { width: 33.33%; float: left } .one-fifth { width: 20%; float: left } .two-fifth { width: 40%; float: left } @media screen and (min-width:1400px) { .header-image, .custom-row { min-height: 700px } } @media screen and (max-width:1680px) { .text-image.off-grid-image { display: none } } @media screen and (max-width:1024px) { .google-apps-logo { margin-top: 0 !important; margin-bottom: 20px } .stats .helper-extra-top-padding { padding: 40px 0 !important } .no-padding-mobile { padding: 0 !important } .no-background-color { background: none !important } .accordion { padding: 0 } .content-box .columns { padding: 0 10px !important } .content-box h2 { margin-top: 30px } .content-box iframe { margin-bottom: 30px; padding: 0 10px } .accordion-navigation h3 { font-size: 28px !important } .accordion .accordion-navigation>.content, .accordion dd>.content { margin-bottom: 30px; background: #efefef !important; padding: 40px 0 !important } .tabs dd>a, .tabs .tab-title>a, .tabs .tab-title>a:hover, .accordion .accordion-navigation>a, .accordion dd>a { margin-bottom: 40px; background: #efefef !important } .accordion .accordion-navigation.active>a.active { margin-bottom: 0; background: #efefef !important } .view-plans { max-width: none !important } .special-offer .black-box { position: relative } .special-offer .black-box h1 { font-size: 30px } .special-offer .black-box h2 { font-size: 20px !important } .special-offer .black-box p { font-size: 16px } .special-offer .hosting-features h3 { font-size: 16px } .special-offer .hosting-features p { font-size: 14px } .promotion { bottom: -210px; max-width: 400px; max-height: 400px } .promotion p.promotion-heading { font-size: 34px } .promotion p, .promotion a { font-size: 14px } .promotion p span { font-size: 16px } .option .selectButton { margin-top: 30px } .the-team .row { position: absolute; left: 0; margin-left: 0 } .getintouch-page .header-image { background: none !important } .getintouch-page .header-image .custom-show-option { display: block } .getintouch-page .header-image .contact { margin: 0 !important } .values .row>div { margin-bottom: 20px } .red.button { margin-top: 20px } .payment { max-width: 400px } .payment .button.orange, .payment .button.orange:hover { margin-left: 0 } .person-image { height: auto !important } .person-image img { position: relative; left: 50%; margin-left: -200px } .post-title { padding: 0 20px } #option_content .post-title { height: auto !important } .halfrow { max-width: 100% } .current-page-parent a, ul.sub-menu .current_page_item a, ul.sub-menu .current_page_item:hover a { color: white !important } ul ul.sub-menu li:hover a { color: white !important } #site-title, .site-title { margin: 12px 0 } #site-title img, .site-title img { width: 160px } .alignnone { margin-top: 20px !important } .domain h2 { text-align: center } .meet-team.sub-heading-section { padding-top: 0 } .meet-team .flexslider .slides img { padding-top: 0 } .page-template-template-standard-php .center-element { margin: 0 !important } .flexslider { background: transparent !important } .flexslider .flex-caption { top: 80px } .contact .btn-img { text-align: center } .options { padding: 0; margin-top: 0 } .virtual-server.options { margin-top: 50px } .virtual-server .flex-control-nav { bottom: 10px } .flexslider .slides img { max-width: 64px; margin: 0 auto } .flex-caption { position: relative !important; top: 0 !important } .options .slides li { padding: 45px 0 } .options .option-list li { padding: 5px 0 } #option_content:before { left: 50% } .services .slides { float: none; margin: 0 auto } .service { background: 0; padding-bottom: 0 } .service .flex-content { background: #e4e4e3 } .service .flex-caption { position: relative; top: auto } .flexslider .slides img { padding-top: 30px; width: auto } .options .flexslider .slides img { padding-top: 30px; height: auto; max-width: 100% !important } .service .button { left: auto; margin-left: 0; position: relative } .services { padding-bottom: 0 } .contact .v-align { margin-top: 50px !important } .contact { padding: 50px 0 !important } .contact h2 { text-align: center } .contact .btn-img img { margin-bottom: 20px; max-width: 60px !important } .contact-mobile-image { max-width: 50%; margin-top: 30px } #option_content { padding-top: 30px } .virtual-server .option { margin: 0; min-height: 470px } .web-hosting .payment { margin-top: 0; float: left !important } .payment-heading { margin-top: 60px } .contact-phone { text-align: center } .contact-phone a { font-size: 16px } .contact-phone p { display: inline-block; margin-top: 10px; margin-bottom: 50px } .contact-phone a, .contact-phone p { display: inline-block } footer .social-buttons li { text-align: center } footer .social-buttons li iframe { margin: 0 auto } .news-letter { text-align: center; float: none !important } .back-to-top a { display: inline-block; margin-top: 30px; margin-bottom: 0 } .copyright { margin-top: 30px; padding: 25px 0; text-align: center } footer .site-title { text-align: center } } @media screen and (max-width:850px) { .cost-estimate input[type="text"]::-webkit-input-placeholder { font-size: 16px; font-family: 'ralewayregular', sans-serif; color: #000 } .cost-estimate input[type="text"]:-moz-placeholder { font-size: 16px; font-family: 'ralewayregular', sans-serif; color: #000 } .cost-estimate input[type="text"]::-moz-placeholder { font-size: 16px; font-family: 'ralewayregular', sans-serif; color: #000 } .cost-estimate input[type="text"]:-ms-input-placeholder { font-size: 16px; font-family: 'ralewayregular', sans-serif; color: #000 } .cost-estimate { top: 0 !important; padding: 30px 60px !important } .cost-estimate h4 { font-size: 24px } .section-arrow { display: none } .promotion { bottom: -185px; max-width: 350px; max-height: 350px } .promotion p.promotion-heading { font-size: 20px } .promotion p, .promotion a { font-size: 12px } .promotion p span { font-size: 14px } .blog-articles-widget article { width: 50% !important; float: left !important; margin-bottom: 30px !important; margin-top: 30px !important } } @media screen and (max-width:640px) { .tooltip { max-width: 95% } .full-width-mobile { width: 100% } .rwd-table.custom-table td:before { content: '' !important; width: 0 } .rwd-table.custom-table td { border-left: 0 !important } .border-left, .border-right { border: none !important } .google-apps .google-app-section { margin-bottom: 20px } .awards .award-logo { min-height: 0 !important; text-align: center } .values .one-fifth { width: 50% } .values .one-fifth:last-child { width: 100% } .cost-estimate { margin-top: 0 !important; padding-left: 20px !important; padding-right: 20px !important } .helper-small-top-padding { padding: 30px 0 !important } .special-offer .black-box { max-width: 100% } .special-offer .hosting-features { top: 0; padding: 20px } .promotion { display: none } .promotion-row { padding: 10px 0; background: #c64849 } .promotion.mobile { display: block; top: 0; max-width: none; width: 275px; position: relative; height: auto; border-radius: 1000px; margin: 0 auto; border: 7px solid white } .promotion.mobile .promotion-heading { font-size: 35px } .promotion.mobile p, .promotion.mobile a { font-size: 14px } .promotion.mobile p span { font-size: 16px } .section-arrow { display: none } .social-feed { display: none } .web-hosting .payment .button.orange, .web-hosting .payment .button.orange:hover { width: 100% } .call-icon a { position: relative; right: 30px } .add-on-list p.sub-heading { font-size: 20px } .domains-page .header-image .v-align { margin-top: 0 !important } .button.orange, .button.orange:hover { margin-top: 10px } p, a, li { font-size: 14px } .header-image h1, .header-image h2 { font-size: 24px } h2, .domain h2, h2.sub-heading { font-size: 24px } .domains-page h1 { color: black } .user-groups h2, .flex-content h2 { font-size: 38px !important } .user-groups h3 { font-size: 24px } .black-box p { font-size: 13px } .black-box .button, .button { font-size: 16px; height: auto } .rounded-input { font-size: 13px !important } .sub-heading-section { padding: 45px 0 } .service img { max-width: 35% !important } .service h2 { font-size: 24px !important } .service p.bold-text, .service p, .bold-text { font-size: 15px } .service p { margin-bottom: 40px } .contact .button { font-size: 20px } .contact p { font-size: 16px } .news-letter p { font-size: 14px } .wrapper .header-image, .wrapper .background-image, .custom-row { background-image: none !important; min-height: 0 } .accordion-navigation .post-image { min-height: 100px !important } .accordion-navigation h3 { padding-top: 30px !important } .custom-show-option { display: block } .black-box, .background-image .black-box { position: relative; top: 0; left: 0; max-width: 100%; width: 100% } #ajax-loader .black-box { left: 0 } nav ul li:hover>ul { display: none } .main-nav ul li { padding: 10px } .hero-slider .flexslider .flex-caption { position: relative; top: 0; width: 100% } .flexslider .flex-direction-nav { bottom: auto !important; top: 40% } .cost-estimate { top: 0 } .payment { max-width: 100% } } @media screen and (max-width:480px) { .cost-estimate input[type="text"]::-webkit-input-placeholder { font-size: 12px; font-family: 'ralewayregular', sans-serif; color: #000 } .cost-estimate input[type="text"]:-moz-placeholder { font-size: 12px; font-family: 'ralewayregular', sans-serif; color: #000 } .cost-estimate input[type="text"]::-moz-placeholder { font-size: 12px; font-family: 'ralewayregular', sans-serif; color: #000 } .cost-estimate input[type="text"]:-ms-input-placeholder { font-size: 12px; font-family: 'ralewayregular', sans-serif; color: #000 } .text-left-mobile { text-align: left !important } .text-image { display: none } .call-out { display: none !important } .call-icon img { margin-top: 25px } .call-icon a { right: 40px } .dl-trigger { margin: 15px 0 0 } .news-letter .rounded-input { max-width: 100%; margin: 0 auto } .contact .button { width: 100% } .rounded-input { padding-right: 35px !important } .red.button { min-width: 150px } .payment input[type="radio"].css-checkbox+label.css-label { font-size: 20px !important; line-height: 25px; background-size: 25px } input[type=radio].css-checkbox:checked+label.css-label { background-position: 0 0; color: black } .oj-border .button { display: block } .blog-articles-widget article { width: 100% !important; float: left !important; margin-bottom: 30px !important; margin-top: 30px !important } ::-webkit-input-placeholder { font-size: 12px !important } :-moz-placeholder { font-size: 12px !important } ::-moz-placeholder { font-size: 12px !important } :-ms-input-placeholder { font-size: 12px !important } } @media screen and (max-width:320px) { .flexslider .flex-content h2 { display: block !important } } @media screen and (max-height:480px) { .dl-menuwrapper li a { padding: 2px 20px !important } .dl-menuwrapper li>a:not(:only-child):after { line-height: 20px } .dl-menuwrapper li.dl-back:after { line-height: 37px } } .rwd-table { margin: 1em 0; min-width: 100%; border: 0 !important } .rwd-table .option { height: auto !important; text-align: center } .rwd-table * { font-family: 'ralewayregular', sans-serif; font-size: 16px } .rwd-table th, .rwd-table th p { font-family: 'ralewaysemibold', sans-serif; font-size: 22px; margin-bottom: 0 !important } .rwd-table.vps th, .rwd-table.vps th p { color: #f8f8f8 !important } .rwd-table.vps th.hover, .rwd-table.vps th.hover p { color: #222 !important } .rwd-table th { display: none } .rwd-table td { display: block } .rwd-table td:first-child { padding-top: .5em; font-family: 'ralewaybold', sans-serif } .rwd-table td:last-child { padding-bottom: .5em } .rwd-table td:before { content: attr(data-th) ": "; font-weight: bold; width: 6.5em; display: inline-block } @media(min-width:480px) { .rwd-table td:before { display: none } } .rwd-table th, .rwd-table td { text-align: left } @media(min-width:480px) { .rwd-table th, .rwd-table td { display: table-cell; padding: .25em .5em } .rwd-table th:first-child, .rwd-table td:first-child { padding-left: 0 } .rwd-table th:last-child, .rwd-table td:last-child { padding-right: 0 } } .rwd-table { color: #fff } .rwd-table tr:last-child { background-color: transparent !important } .rwd-table thead tr, .rwd-table.vps tr:last-child { background-color: #e1e1e1 !important } .rwd-table thead { background-color: #e1e1e1 !important } .rwd-table tr:nth-of-type(even) { background-color: #f8f8f8 } .rwd-table tr:nth-of-type(odd) { background-color: #fff } .rwd-table th, .rwd-table td { margin: .5em 1em; width: 25%; border-left: 2px solid #fff; text-align: left; -webkit-transition: background .25s ease-in-out; -moz-transition: background .25s ease-in-out; -ms-transition: background .25s ease-in-out; -o-transition: background .25s ease-in-out; transition: background .25s ease-in-out; position: relative } .rwd-table.vps th, .rwd-table.vps td { cursor: pointer } .rwd-table.vps th .sub-heading { display: none } .rwd-table.vps thead tr th { text-align: left; padding-left: 50px !important } .rwd-table.vps thead tr th.popular .half-circle { background: #dee8f2 !important; color: #1e1e1e !important } .rwd-table th { overflow: hidden } @media(min-width:480px) { .rwd-table th, .rwd-table td { padding: 20px 35px !important } .rwd-table.custom-table th, .rwd-table.custom-table td { padding: 20px 25px !important } .rwd-table th { padding: 30px 35px !important; text-align: center; background: #5f93c8; color: #f8f8f8 !important } } .rwd-table th, .rwd-table td:before { color: #000 } .rwd-table input[type=radio].css-checkbox+label.css-label { padding-left: 25px; width: auto; max-width: 100%; margin: 0 } td.option { padding: 0 !important } td.option .selectButton { position: relative } .option:hover .selectButton, .option.active .selectButton { background: #5a97cd !important } .hover { background: rgba(228, 235, 243, 0.5) !important } .hover .selectButton { background-color: #e8eff6 !important } .rwd-table td:nth-child(1), .rwd-table th:nth-child(1) { background: none !important; cursor: auto; position: relative; border-left: 0; text-align: left } .hoverText { padding: 15px 20px 15px 25px; position: absolute; bottom: 60px; left: 135px; width: 300px; margin-left: -125px; background: white; z-index: 20; font-size: 16px; -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.5); box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.5); color: black } .hoverText:after, .hoverText:before { top: 100%; left: 45px; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none } .hoverText:after { border-color: rgba(136, 183, 213, 0); border-top-color: #fff; border-width: 15px; margin-left: -15px } .hoverText:before { border-color: rgba(194, 225, 245, 0); border-top-color: #000; border-width: 17px; margin-left: -17px; opacity: .2 } .popular { background: rgba(219, 226, 232, 0.5); text-align: left; overflow: hidden; padding: 15px 25px } .pricing .popular { background: #5f93c8 } .vps-padding .popular .half-circle { background: #dee8f2 !important; color: #1e1e1e !important } .vps-padding .popular p { margin-bottom: 0 !important; padding-left: 0 !important; font-size: 22px; font-family: 'ralewaybold', sans-serif; color: #f8f8f8 !important } .vps-padding .popular .sub-heading { font-family: 'raleway', sans-serif; color: #f8f8f8 !important } .popular p { color: #000 } .rwd-table .sub-heading, .popular .sub-heading { font-family: 'ralewaybold', sans-serif; margin-top: 5px; color: #a7a7a7 !important } .rwd-table td.tick:before { content: url("../img/tick.png"); position: absolute; top: 20px; left: 10px; display: inline } .rwd-table td.cross:before { content: url("../img/cross.png"); position: absolute; top: 20px; left: 10px; display: inline } .rwd-table td.optional:before { content: url("../img/optional.png"); position: absolute; top: 20px; left: 10px; display: inline } td.video { border: 0 !important; padding: 20px !important } td.video iframe { width: 100% } td.learn-more { padding: 0 !important } td.learn-more a { text-align: center; display: block; background: #5d91ca; color: #fff; padding: 20px 45px !important; font-size: 20px; text-transform: uppercase; top: 0 !important; line-height: normal; border: 1px solid #5d91ca } td.learn-more.orange a { background: #f36339; border: 1px solid #f36339 } td.learn-more a:hover, td.learn-more.hover a { opacity: .8 } tr.pricing { background-color: #dee8f2 !important; border-bottom: 2px solid #fff } tr.pricing * { font-family: 'ralewaybold', sans-serif; text-align: center } tr.discount { background-color: #c44848 !important; border-bottom: 2px solid #fff } tr.discount * { color: #fff; font-family: 'ralewaybold', sans-serif; text-align: center } tr.discount .hoverText { color: black; font-family: 'ralewayregular', sans-serif } .tabs-content { background: #e9e9e9; padding: 30px 140px } .tabs dd>a, .tabs .tab-title>a, .tabs .tab-title>a:hover, .accordion .accordion-navigation>a, .accordion dd>a { background: 0; padding: 0 0 10px; float: left; width: 100% } .tabs .tab-title>a:hover { background: #e6e7e8 !important } .tabs .tab-title { padding: 0 0 10px; margin-bottom: 20px !important } .tab-title .post-image { height: 49px; margin-top: 17px; background-size: cover; background-position: center top } .tab-title.active .post-image { background-position: center bottom } .tab-title h3, .accordion-navigation h3 { font-size: 20px; font-family: 'ralewaysemibold', sans-serif; padding-top: 10px } .accordion-navigation h3 { padding-top: 50px } .tab-title.active h3 { color: #688ebf } .tab-title.active.google-apps h3 { color: #5e94ff !important } .google-apps .full-circle-full { background-color: #5e94ff !important } .tab-title.active.web h3 { color: #c64949 !important } .web-hosting .full-circle-full { background-color: #c64949 !important } .web-hosting .red-link { color: #c64949 !important; margin-bottom: 30px; margin-top: 20px; display: block; font-size: 16px } .reseller-hosting .full-circle-full { background-color: #45b996 !important } .reseller-hosting .green-link { color: #45b996 !important; margin-bottom: 30px; margin-top: 20px; display: block; font-size: 16px } .tab-title.active.reseller h3 { color: #45b996 !important } .accordion-navigation.active a.active h3 { color: #688ebf !important } .color-code { padding: 10px; border-right: 1px solid #fff; margin-bottom: 10px; color: white; font-family: 'ralewaysemibold', sans-serif; font-size: 20px; height: 0 } .color-code img { position: relative; top: -5px; max-width: 20px; float: right; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: -webkit-transform 1s ease-in; -moz-transition: -moz-transform 1s ease-in; -o-transition: -o-transform 1s ease-in; transition: transform 1s ease-in } .accordion-navigation.active a.active .color-code img { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -o-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -webkit-transition: -webkit-transform 1s ease-in; -moz-transition: -moz-transform 1s ease-in; -o-transition: -o-transform 1s ease-in; transition: transform 1s ease-in } .accordion-navigation .content { padding: 0 !important; background: none !important } .accordion-navigation .post-image { min-height: 150px; background-size: contain } .content .options { padding-top: 70px; margin-top: 0; display: none } .content-box { padding-bottom: 30px } .content-box .blue-link { margin-bottom: 30px; margin-top: 20px; display: block; font-size: 16px } .content-box h2 { margin-top: 0; line-height: 1; margin-bottom: 20px } .content-box p.sub-heading { font-size: 20px; margin-bottom: 25px } .content-box .button.orange, .content-box .button.orange:hover { top: 0 } .view-plans { max-width: 250px } p.min-price { display: inline-block; padding-left: 20px; font-size: 24px } .price-dropdown, .price-dropdown:hover, .price-dropdown:focus { background-image: url("../img/icons/bottom-arrow.png"); background-repeat: no-repeat; background-repeat: no-repeat; background-position: 90% 20px; background-size: 20px } .content-box hr { border-color: #909090 } .info-section p { display: inline-block } .info-section .button { font-size: 20px !important; font-family: 'ralewaymedium', sans-serif !important; margin: 0 0 1.25rem !important } .accordion { padding: 0 10px } .content-box .row .row { width: 100% !important; margin: 0 !important } .stats h2 { font-family: 'ralewayregular', sans-serif; font-size: 70px; color: #000 !important } .stats p { font-family: 'ralewaymedium', sans-serif; color: #000 !important; font-size: 30px } .stats .websites h2, .stats .websites p { color: #e6e7e9 !important } .stats .websites p { font-family: 'ralewaylight', sans-serif } .awards .award-logo { min-height: 220px; float: left !important; margin-bottom: 30px } .awards h4 { font-family: 'ralewaysemibold', sans-serif; line-height: 1 } .awards hr { border-color: black !important } .employee-image img { margin-top: 30px } .employee-desc .content-box { padding: 30px 40px } .employee-desc .content-box .title { font-size: 24px; font-family: 'ralewaymedium', sans-serif; margin-bottom: 0 } .employee-desc .content-box .sub-heading { font-size: 18px; font-family: 'ralewaymedium', sans-serif; margin-top: 0; margin-bottom: 30px } .linkedIn { text-indent: -9999em; display: inline-block; background: url("../img/linkedin.png") no-repeat center center; background-size: contain; width: 30px; height: 30px } .employee-box { margin-bottom: 20px; position: relative } .employee-box .staff-name { font-size: 25px; font-family: 'ralewaymedium', sans-serif } .employee-box .department { font-size: 16px; font-family: 'ralewaymedium', sans-serif; text-transform: uppercase } .employee-box .hidden-text { position: absolute; bottom: 20px; padding: 20px; width: 100%; left: 50%; margin-left: -50%; text-align: center } .employee-box .hidden-text h3, .employee-box .hidden-text h4 { margin-bottom: 0; margin-top: 0 } .employee-box:hover .hidden-text { display: block } .employee-box:hover img { opacity: .4 } .helper-padding-bot { padding-bottom: 30px } .commission table th:first-child { width: 60% } .commission table th:last-child { width: 60% } .commission table, .commission table thead, .commission table tr.even, .commission table tr.alt, .commission table tr:nth-of-type(even), .commission table tr.odd, .commission table tr.alt, .commission table tr:nth-of-type(odd) { background: 0; border: 0 } .commission h3 { font-size: 25px; font-family: 'ralewaysemibold', sans-serif } .commission h3 span, .commission p span { font-size: 12px; font-family: 'ralewaymedium', sans-serif; display: block } .commission table tr { border-bottom: 2px solid #d5d5d5 !important } .commission th:last-child, .commission td:last-child { float: right } .commission td, .commission th { padding: 22px 20px 0 0 } .partner-feature { padding-left: 50px !important } .partner-feature li { line-height: 1.5 } .partner-feature a { margin-top: 30px } .partner { padding: 0 50px } .partner img { margin-bottom: 30px } .partner h3 { color: #fff; font-family: 'ralewaybold', sans-serif; margin-bottom: 0; line-height: 1; margin-top: 0; font-size: 22px } .partner p { font-size: 17px; margin-top: 30px; color: #fff; font-family: 'ralewaymedium', sans-serif } .referred .rounded-input { background-image: none !important } .referred .arrow-button { position: absolute; top: -2px; right: 10px } .blog-articles-widget article { width: 25%; float: left; padding: 0 10px; margin-bottom: 50px; margin-top: 50px } .blog-articles-widget article .article__header { position: relative; box-shadow: none; z-index: 0 } .blog-articles-widget article .article__featured-image { padding-top: 0 !important; margin-bottom: 20px; min-height: 200px; background-size: cover; background-repeat: no-repeat } .blog-articles-widget article .article__featured-image a { display: block; min-height: 200px } .blog-articles-widget article .article__featured-image img { display: none } .blog-articles-widget article .article__featured-image .article__featured-image-meta { display: none } .blog-articles-widget .article__header .nav.article__categories { list-style-type: none; margin-left: 0; margin-bottom: 0 } .blog-articles-widget .article__header .nav.article__categories li a { font-family: 'ralewaymedium', sans-serif; text-transform: uppercase; font-size: 12px; color: #b3b5b5 } .blog-articles-widget .article__header .article__title a { font-family: 'ralewaysemibold', sans-serif; font-size: 20px; line-height: 1, 2; display: block; color: #000; margin-bottom: 10px } .blog-articles-widget .article__content p, .blog-articles-widget .article__content a { color: #919191; font-size: 15px; font-family: 'ralewaymedium', sans-serif } .blog-articles-widget .article__meta .meta-text abbr { color: #919191; text-transform: uppercase; font-family: 'ralewayregular', sans-serif } .blog-articles-widget .article__meta .meta-box.article__likes { margin-left: 25px; position: relative; top: 2px; font-size: 14px } .blog-articles-widget .article__meta .meta-box.article__date { position: relative; top: 2px; font-size: 14px } .link-arrow { position: relative; font-family: 'ralewaybold', sans-serif; font-size: 21px } .link-arrow:after, .link-arrow:hover:after { right: -20px; top: 10px; background-size: 75% } .link-arrow:hover:after { background-image: url("/resources/assets/frontend/img/crucial/nav-arrow.png") !important } .rwd-table.custom-table th, .rwd-table.custom-table td { width: auto } .rwd-table.custom-table th { background-color: #dee8f2 !important; color: #000 !important; text-align: left } .rwd-table.custom-table tr:nth-of-type(even) { background-color: #f8f8f8 !important } .rwd-table.custom-table .heading img { max-width: 40px } .google-apps-logo { max-width: 400px; width: 100%; margin-top: 25px } .google-icon { padding: 0 20px; margin-bottom: 30px } .google-icon img { max-height: 48px; margin-bottom: 10px; margin-top: 20px } .has-tip { font-family: 'ralewaylight', sans-serif; font-weight: normal; border-bottom: none !important; display: inline-block } .has-tip p { margin-bottom: 0 !important } .has-tip.custom-text-location p { position: relative; right: 5px } .has-tip.custom-text-location.mail p { right: 15px } .tooltip { margin-top: 5px; background: white; color: #000 } .tooltip>.nub { top: -20px; left: 10px; border: solid 10px; border-color: transparent transparent #fff transparent; color: white }