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, menu, 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-color: 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: 0.67em 0; } mark { background: #ff0; color: #000000; } 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 #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } legend { border: 0; padding: 0; } textarea { overflow: auto; } optgroup { font-weight: bold; } table { border-collapse: collapse; border-spacing: 0; } td, th { padding: 0; } @charset "UTF-8"; .animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .animated.infinite { -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } .animated.hinge { -webkit-animation-duration: 2s; animation-duration: 2s; } .animated.bounceIn, .animated.bounceOut, .animated.flipOutX, .animated.flipOutY { -webkit-animation-duration: .75s; animation-duration: 0.75s; } @-webkit-keyframes bounce { 0%, 20%, 53%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transform: translateZ(0); transform: translateZ(0); } 40%, 43% { -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0); } 40%, 43%, 70% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); } 70% { -webkit-transform: translate3d(0, -15px, 0); transform: translate3d(0, -15px, 0); } 90% { -webkit-transform: translate3d(0, -4px, 0); transform: translate3d(0, -4px, 0); } } @keyframes bounce { 0%, 20%, 53%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transform: translateZ(0); transform: translateZ(0); } 40%, 43% { -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0); } 40%, 43%, 70% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); } 70% { -webkit-transform: translate3d(0, -15px, 0); transform: translate3d(0, -15px, 0); } 90% { -webkit-transform: translate3d(0, -4px, 0); transform: translate3d(0, -4px, 0); } } .bounce { -webkit-animation-name: bounce; animation-name: bounce; -webkit-transform-origin: center bottom; transform-origin: center bottom; } @-webkit-keyframes flash { 0%, 50%, to { opacity: 1; } 25%, 75% { opacity: 0; } } @keyframes flash { 0%, 50%, to { opacity: 1; } 25%, 75% { opacity: 0; } } .flash { -webkit-animation-name: flash; animation-name: flash; } @-webkit-keyframes pulse { 0% { -webkit-transform: scaleX(1); transform: scaleX(1); } 50% { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); } to { -webkit-transform: scaleX(1); transform: scaleX(1); } } @keyframes pulse { 0% { -webkit-transform: scaleX(1); transform: scaleX(1); } 50% { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); } to { -webkit-transform: scaleX(1); transform: scaleX(1); } } .pulse { -webkit-animation-name: pulse; animation-name: pulse; } @-webkit-keyframes rubberBand { 0% { -webkit-transform: scaleX(1); transform: scaleX(1); } 30% { -webkit-transform: scale3d(1.25, 0.75, 1); transform: scale3d(1.25, 0.75, 1); } 40% { -webkit-transform: scale3d(0.75, 1.25, 1); transform: scale3d(0.75, 1.25, 1); } 50% { -webkit-transform: scale3d(1.15, 0.85, 1); transform: scale3d(1.15, 0.85, 1); } 65% { -webkit-transform: scale3d(0.95, 1.05, 1); transform: scale3d(0.95, 1.05, 1); } 75% { -webkit-transform: scale3d(1.05, 0.95, 1); transform: scale3d(1.05, 0.95, 1); } to { -webkit-transform: scaleX(1); transform: scaleX(1); } } @keyframes rubberBand { 0% { -webkit-transform: scaleX(1); transform: scaleX(1); } 30% { -webkit-transform: scale3d(1.25, 0.75, 1); transform: scale3d(1.25, 0.75, 1); } 40% { -webkit-transform: scale3d(0.75, 1.25, 1); transform: scale3d(0.75, 1.25, 1); } 50% { -webkit-transform: scale3d(1.15, 0.85, 1); transform: scale3d(1.15, 0.85, 1); } 65% { -webkit-transform: scale3d(0.95, 1.05, 1); transform: scale3d(0.95, 1.05, 1); } 75% { -webkit-transform: scale3d(1.05, 0.95, 1); transform: scale3d(1.05, 0.95, 1); } to { -webkit-transform: scaleX(1); transform: scaleX(1); } } .rubberBand { -webkit-animation-name: rubberBand; animation-name: rubberBand; } @-webkit-keyframes shake { 0%, to { -webkit-transform: translateZ(0); transform: translateZ(0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 20%, 40%, 60%, 80% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } } @keyframes shake { 0%, to { -webkit-transform: translateZ(0); transform: translateZ(0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 20%, 40%, 60%, 80% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } } .shake { -webkit-animation-name: shake; animation-name: shake; } @-webkit-keyframes headShake { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 6.5% { -webkit-transform: translateX(-6px) rotateY(-9deg); transform: translateX(-6px) rotateY(-9deg); } 18.5% { -webkit-transform: translateX(5px) rotateY(7deg); transform: translateX(5px) rotateY(7deg); } 31.5% { -webkit-transform: translateX(-3px) rotateY(-5deg); transform: translateX(-3px) rotateY(-5deg); } 43.5% { -webkit-transform: translateX(2px) rotateY(3deg); transform: translateX(2px) rotateY(3deg); } 50% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes headShake { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 6.5% { -webkit-transform: translateX(-6px) rotateY(-9deg); transform: translateX(-6px) rotateY(-9deg); } 18.5% { -webkit-transform: translateX(5px) rotateY(7deg); transform: translateX(5px) rotateY(7deg); } 31.5% { -webkit-transform: translateX(-3px) rotateY(-5deg); transform: translateX(-3px) rotateY(-5deg); } 43.5% { -webkit-transform: translateX(2px) rotateY(3deg); transform: translateX(2px) rotateY(3deg); } 50% { -webkit-transform: translateX(0); transform: translateX(0); } } .headShake { -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-name: headShake; animation-name: headShake; } @-webkit-keyframes swing { 20% { -webkit-transform: rotate(15deg); transform: rotate(15deg); } 40% { -webkit-transform: rotate(-10deg); transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); transform: rotate(-5deg); } to { -webkit-transform: rotate(0deg); transform: rotate(0deg); } } @keyframes swing { 20% { -webkit-transform: rotate(15deg); transform: rotate(15deg); } 40% { -webkit-transform: rotate(-10deg); transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); transform: rotate(-5deg); } to { -webkit-transform: rotate(0deg); transform: rotate(0deg); } } .swing { -webkit-transform-origin: top center; transform-origin: top center; -webkit-animation-name: swing; animation-name: swing; } @-webkit-keyframes tada { 0% { -webkit-transform: scaleX(1); transform: scaleX(1); } 10%, 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg); transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg); transform: scale3d(1.1, 1.1, 1.1) rotate(3deg); } 40%, 60%, 80% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg); transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg); } to { -webkit-transform: scaleX(1); transform: scaleX(1); } } @keyframes tada { 0% { -webkit-transform: scaleX(1); transform: scaleX(1); } 10%, 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg); transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg); transform: scale3d(1.1, 1.1, 1.1) rotate(3deg); } 40%, 60%, 80% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg); transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg); } to { -webkit-transform: scaleX(1); transform: scaleX(1); } } .tada { -webkit-animation-name: tada; animation-name: tada; } @-webkit-keyframes wobble { 0% { -webkit-transform: none; transform: none; } 15% { -webkit-transform: translate3d(-25%, 0, 0) rotate(-5deg); transform: translate3d(-25%, 0, 0) rotate(-5deg); } 30% { -webkit-transform: translate3d(20%, 0, 0) rotate(3deg); transform: translate3d(20%, 0, 0) rotate(3deg); } 45% { -webkit-transform: translate3d(-15%, 0, 0) rotate(-3deg); transform: translate3d(-15%, 0, 0) rotate(-3deg); } 60% { -webkit-transform: translate3d(10%, 0, 0) rotate(2deg); transform: translate3d(10%, 0, 0) rotate(2deg); } 75% { -webkit-transform: translate3d(-5%, 0, 0) rotate(-1deg); transform: translate3d(-5%, 0, 0) rotate(-1deg); } to { -webkit-transform: none; transform: none; } } @keyframes wobble { 0% { -webkit-transform: none; transform: none; } 15% { -webkit-transform: translate3d(-25%, 0, 0) rotate(-5deg); transform: translate3d(-25%, 0, 0) rotate(-5deg); } 30% { -webkit-transform: translate3d(20%, 0, 0) rotate(3deg); transform: translate3d(20%, 0, 0) rotate(3deg); } 45% { -webkit-transform: translate3d(-15%, 0, 0) rotate(-3deg); transform: translate3d(-15%, 0, 0) rotate(-3deg); } 60% { -webkit-transform: translate3d(10%, 0, 0) rotate(2deg); transform: translate3d(10%, 0, 0) rotate(2deg); } 75% { -webkit-transform: translate3d(-5%, 0, 0) rotate(-1deg); transform: translate3d(-5%, 0, 0) rotate(-1deg); } to { -webkit-transform: none; transform: none; } } .wobble { -webkit-animation-name: wobble; animation-name: wobble; } @-webkit-keyframes jello { 0%, 11.1%, to { -webkit-transform: none; transform: none; } 22.2% { -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); transform: skewX(-12.5deg) skewY(-12.5deg); } 33.3% { -webkit-transform: skewX(6.25deg) skewY(6.25deg); transform: skewX(6.25deg) skewY(6.25deg); } 44.4% { -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); transform: skewX(-3.125deg) skewY(-3.125deg); } 55.5% { -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); transform: skewX(1.5625deg) skewY(1.5625deg); } 66.6% { -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg); transform: skewX(-0.78125deg) skewY(-0.78125deg); } 77.7% { -webkit-transform: skewX(0.390625deg) skewY(0.390625deg); transform: skewX(0.390625deg) skewY(0.390625deg); } 88.8% { -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg); transform: skewX(-0.1953125deg) skewY(-0.1953125deg); } } @keyframes jello { 0%, 11.1%, to { -webkit-transform: none; transform: none; } 22.2% { -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); transform: skewX(-12.5deg) skewY(-12.5deg); } 33.3% { -webkit-transform: skewX(6.25deg) skewY(6.25deg); transform: skewX(6.25deg) skewY(6.25deg); } 44.4% { -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); transform: skewX(-3.125deg) skewY(-3.125deg); } 55.5% { -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); transform: skewX(1.5625deg) skewY(1.5625deg); } 66.6% { -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg); transform: skewX(-0.78125deg) skewY(-0.78125deg); } 77.7% { -webkit-transform: skewX(0.390625deg) skewY(0.390625deg); transform: skewX(0.390625deg) skewY(0.390625deg); } 88.8% { -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg); transform: skewX(-0.1953125deg) skewY(-0.1953125deg); } } .jello { -webkit-animation-name: jello; animation-name: jello; -webkit-transform-origin: center; transform-origin: center; } @-webkit-keyframes bounceIn { 0%, 20%, 40%, 60%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 40% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); } 80% { -webkit-transform: scale3d(0.97, 0.97, 0.97); transform: scale3d(0.97, 0.97, 0.97); } to { opacity: 1; -webkit-transform: scaleX(1); transform: scaleX(1); } } @keyframes bounceIn { 0%, 20%, 40%, 60%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 40% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); } 80% { -webkit-transform: scale3d(0.97, 0.97, 0.97); transform: scale3d(0.97, 0.97, 0.97); } to { opacity: 1; -webkit-transform: scaleX(1); transform: scaleX(1); } } .bounceIn { -webkit-animation-name: bounceIn; animation-name: bounceIn; } @-webkit-keyframes bounceInDown { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: translate3d(0, -3000px, 0); transform: translate3d(0, -3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, 25px, 0); transform: translate3d(0, 25px, 0); } 75% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 90% { -webkit-transform: translate3d(0, 5px, 0); transform: translate3d(0, 5px, 0); } to { -webkit-transform: none; transform: none; } } @keyframes bounceInDown { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: translate3d(0, -3000px, 0); transform: translate3d(0, -3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, 25px, 0); transform: translate3d(0, 25px, 0); } 75% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 90% { -webkit-transform: translate3d(0, 5px, 0); transform: translate3d(0, 5px, 0); } to { -webkit-transform: none; transform: none; } } .bounceInDown { -webkit-animation-name: bounceInDown; animation-name: bounceInDown; } @-webkit-keyframes bounceInLeft { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: translate3d(-3000px, 0, 0); transform: translate3d(-3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(25px, 0, 0); transform: translate3d(25px, 0, 0); } 75% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 90% { -webkit-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0); } to { -webkit-transform: none; transform: none; } } @keyframes bounceInLeft { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: translate3d(-3000px, 0, 0); transform: translate3d(-3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(25px, 0, 0); transform: translate3d(25px, 0, 0); } 75% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 90% { -webkit-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0); } to { -webkit-transform: none; transform: none; } } .bounceInLeft { -webkit-animation-name: bounceInLeft; animation-name: bounceInLeft; } @-webkit-keyframes bounceInRight { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: translate3d(3000px, 0, 0); transform: translate3d(3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(-25px, 0, 0); transform: translate3d(-25px, 0, 0); } 75% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } 90% { -webkit-transform: translate3d(-5px, 0, 0); transform: translate3d(-5px, 0, 0); } to { -webkit-transform: none; transform: none; } } @keyframes bounceInRight { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: translate3d(3000px, 0, 0); transform: translate3d(3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(-25px, 0, 0); transform: translate3d(-25px, 0, 0); } 75% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } 90% { -webkit-transform: translate3d(-5px, 0, 0); transform: translate3d(-5px, 0, 0); } to { -webkit-transform: none; transform: none; } } .bounceInRight { -webkit-animation-name: bounceInRight; animation-name: bounceInRight; } @-webkit-keyframes bounceInUp { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: translate3d(0, 3000px, 0); transform: translate3d(0, 3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } 75% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 90% { -webkit-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0); } to { -webkit-transform: translateZ(0); transform: translateZ(0); } } @keyframes bounceInUp { 0%, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: translate3d(0, 3000px, 0); transform: translate3d(0, 3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } 75% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 90% { -webkit-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0); } to { -webkit-transform: translateZ(0); transform: translateZ(0); } } .bounceInUp { -webkit-animation-name: bounceInUp; animation-name: bounceInUp; } @-webkit-keyframes bounceOut { 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 50%, 55% { opacity: 1; -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } to { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } } @keyframes bounceOut { 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 50%, 55% { opacity: 1; -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } to { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } } .bounceOut { -webkit-animation-name: bounceOut; animation-name: bounceOut; } @-webkit-keyframes bounceOutDown { 20% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } @keyframes bounceOutDown { 20% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } .bounceOutDown { -webkit-animation-name: bounceOutDown; animation-name: bounceOutDown; } @-webkit-keyframes bounceOutLeft { 20% { opacity: 1; -webkit-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0); } to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } @keyframes bounceOutLeft { 20% { opacity: 1; -webkit-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0); } to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } .bounceOutLeft { -webkit-animation-name: bounceOutLeft; animation-name: bounceOutLeft; } @-webkit-keyframes bounceOutRight { 20% { opacity: 1; -webkit-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0); } to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } @keyframes bounceOutRight { 20% { opacity: 1; -webkit-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0); } to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } .bounceOutRight { -webkit-animation-name: bounceOutRight; animation-name: bounceOutRight; } @-webkit-keyframes bounceOutUp { 20% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } @keyframes bounceOutUp { 20% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } .bounceOutUp { -webkit-animation-name: bounceOutUp; animation-name: bounceOutUp; } @-webkit-keyframes fadeIn { 0% { opacity: 0; } to { opacity: 1; } } @keyframes fadeIn { 0% { opacity: 0; } to { opacity: 1; } } .fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn; } @-webkit-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown; } @-webkit-keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInDownBig { -webkit-animation-name: fadeInDownBig; animation-name: fadeInDownBig; } @-webkit-keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; } @-webkit-keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig; } @-webkit-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInRight { -webkit-animation-name: fadeInRight; animation-name: fadeInRight; } @-webkit-keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInRightBig { -webkit-animation-name: fadeInRightBig; animation-name: fadeInRightBig; } @-webkit-keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } @-webkit-keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInUpBig { -webkit-animation-name: fadeInUpBig; animation-name: fadeInUpBig; } @-webkit-keyframes fadeOut { 0% { opacity: 1; } to { opacity: 0; } } @keyframes fadeOut { 0% { opacity: 1; } to { opacity: 0; } } .fadeOut { -webkit-animation-name: fadeOut; animation-name: fadeOut; } @-webkit-keyframes fadeOutDown { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } } @keyframes fadeOutDown { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } } .fadeOutDown { -webkit-animation-name: fadeOutDown; animation-name: fadeOutDown; } @-webkit-keyframes fadeOutDownBig { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } @keyframes fadeOutDownBig { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } .fadeOutDownBig { -webkit-animation-name: fadeOutDownBig; animation-name: fadeOutDownBig; } @-webkit-keyframes fadeOutLeft { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } @keyframes fadeOutLeft { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } .fadeOutLeft { -webkit-animation-name: fadeOutLeft; animation-name: fadeOutLeft; } @-webkit-keyframes fadeOutLeftBig { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } @keyframes fadeOutLeftBig { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } .fadeOutLeftBig { -webkit-animation-name: fadeOutLeftBig; animation-name: fadeOutLeftBig; } @-webkit-keyframes fadeOutRight { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } @keyframes fadeOutRight { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } .fadeOutRight { -webkit-animation-name: fadeOutRight; animation-name: fadeOutRight; } @-webkit-keyframes fadeOutRightBig { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } @keyframes fadeOutRightBig { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } .fadeOutRightBig { -webkit-animation-name: fadeOutRightBig; animation-name: fadeOutRightBig; } @-webkit-keyframes fadeOutUp { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } @keyframes fadeOutUp { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } .fadeOutUp { -webkit-animation-name: fadeOutUp; animation-name: fadeOutUp; } @-webkit-keyframes fadeOutUpBig { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } @keyframes fadeOutUpBig { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } .fadeOutUpBig { -webkit-animation-name: fadeOutUpBig; animation-name: fadeOutUpBig; } @-webkit-keyframes flip { 0% { -webkit-transform: perspective(400px) rotateY(-1turn); transform: perspective(400px) rotateY(-1turn); } 0%, 40% { -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(-190deg); transform: perspective(400px) translateZ(150px) rotateY(-190deg); } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(-170deg); transform: perspective(400px) translateZ(150px) rotateY(-170deg); } 50%, 80% { -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95); transform: perspective(400px) scale3d(0.95, 0.95, 0.95); } to { -webkit-transform: perspective(400px); transform: perspective(400px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @keyframes flip { 0% { -webkit-transform: perspective(400px) rotateY(-1turn); transform: perspective(400px) rotateY(-1turn); } 0%, 40% { -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(-190deg); transform: perspective(400px) translateZ(150px) rotateY(-190deg); } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(-170deg); transform: perspective(400px) translateZ(150px) rotateY(-170deg); } 50%, 80% { -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95); transform: perspective(400px) scale3d(0.95, 0.95, 0.95); } to { -webkit-transform: perspective(400px); transform: perspective(400px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } .animated.flip { -webkit-backface-visibility: visible; backface-visibility: visible; -webkit-animation-name: flip; animation-name: flip; } @-webkit-keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } 0%, 40% { -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 40% { -webkit-transform: perspective(400px) rotateX(-20deg); transform: perspective(400px) rotateX(-20deg); } 60% { -webkit-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotateX(-5deg); transform: perspective(400px) rotateX(-5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } } @keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } 0%, 40% { -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 40% { -webkit-transform: perspective(400px) rotateX(-20deg); transform: perspective(400px) rotateX(-20deg); } 60% { -webkit-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotateX(-5deg); transform: perspective(400px) rotateX(-5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } } .flipInX { -webkit-backface-visibility: visible!important; backface-visibility: visible!important; -webkit-animation-name: flipInX; animation-name: flipInX; } @-webkit-keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } 0%, 40% { -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 40% { -webkit-transform: perspective(400px) rotateY(-20deg); transform: perspective(400px) rotateY(-20deg); } 60% { -webkit-transform: perspective(400px) rotateY(10deg); transform: perspective(400px) rotateY(10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotateY(-5deg); transform: perspective(400px) rotateY(-5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } } @keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } 0%, 40% { -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 40% { -webkit-transform: perspective(400px) rotateY(-20deg); transform: perspective(400px) rotateY(-20deg); } 60% { -webkit-transform: perspective(400px) rotateY(10deg); transform: perspective(400px) rotateY(10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotateY(-5deg); transform: perspective(400px) rotateY(-5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } } .flipInY { -webkit-backface-visibility: visible!important; backface-visibility: visible!important; -webkit-animation-name: flipInY; animation-name: flipInY; } @-webkit-keyframes flipOutX { 0% { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotateX(-20deg); transform: perspective(400px) rotateX(-20deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } } @keyframes flipOutX { 0% { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotateX(-20deg); transform: perspective(400px) rotateX(-20deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } } .flipOutX { -webkit-animation-name: flipOutX; animation-name: flipOutX; -webkit-backface-visibility: visible!important; backface-visibility: visible !important; } @-webkit-keyframes flipOutY { 0% { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotateY(-15deg); transform: perspective(400px) rotateY(-15deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } } @keyframes flipOutY { 0% { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotateY(-15deg); transform: perspective(400px) rotateY(-15deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } } .flipOutY { -webkit-backface-visibility: visible!important; backface-visibility: visible!important; -webkit-animation-name: flipOutY; animation-name: flipOutY; } @-webkit-keyframes lightSpeedIn { 0% { -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); transform: translate3d(100%, 0, 0) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: skewX(20deg); transform: skewX(20deg); } 60%, 80% { opacity: 1; } 80% { -webkit-transform: skewX(-5deg); transform: skewX(-5deg); } to { -webkit-transform: none; transform: none; opacity: 1; } } @keyframes lightSpeedIn { 0% { -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); transform: translate3d(100%, 0, 0) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: skewX(20deg); transform: skewX(20deg); } 60%, 80% { opacity: 1; } 80% { -webkit-transform: skewX(-5deg); transform: skewX(-5deg); } to { -webkit-transform: none; transform: none; opacity: 1; } } .lightSpeedIn { -webkit-animation-name: lightSpeedIn; animation-name: lightSpeedIn; -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } @-webkit-keyframes lightSpeedOut { 0% { opacity: 1; } to { -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); transform: translate3d(100%, 0, 0) skewX(30deg); opacity: 0; } } @keyframes lightSpeedOut { 0% { opacity: 1; } to { -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); transform: translate3d(100%, 0, 0) skewX(30deg); opacity: 0; } } .lightSpeedOut { -webkit-animation-name: lightSpeedOut; animation-name: lightSpeedOut; -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } @-webkit-keyframes rotateIn { 0% { transform-origin: center; -webkit-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } 0%, to { -webkit-transform-origin: center; } to { transform-origin: center; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateIn { 0% { transform-origin: center; -webkit-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } 0%, to { -webkit-transform-origin: center; } to { transform-origin: center; -webkit-transform: none; transform: none; opacity: 1; } } .rotateIn { -webkit-animation-name: rotateIn; animation-name: rotateIn; } @-webkit-keyframes rotateInDownLeft { 0% { transform-origin: left bottom; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); opacity: 0; } 0%, to { -webkit-transform-origin: left bottom; } to { transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInDownLeft { 0% { transform-origin: left bottom; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); opacity: 0; } 0%, to { -webkit-transform-origin: left bottom; } to { transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInDownLeft { -webkit-animation-name: rotateInDownLeft; animation-name: rotateInDownLeft; } @-webkit-keyframes rotateInDownRight { 0% { transform-origin: right bottom; -webkit-transform: rotate(45deg); transform: rotate(45deg); opacity: 0; } 0%, to { -webkit-transform-origin: right bottom; } to { transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInDownRight { 0% { transform-origin: right bottom; -webkit-transform: rotate(45deg); transform: rotate(45deg); opacity: 0; } 0%, to { -webkit-transform-origin: right bottom; } to { transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInDownRight { -webkit-animation-name: rotateInDownRight; animation-name: rotateInDownRight; } @-webkit-keyframes rotateInUpLeft { 0% { transform-origin: left bottom; -webkit-transform: rotate(45deg); transform: rotate(45deg); opacity: 0; } 0%, to { -webkit-transform-origin: left bottom; } to { transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInUpLeft { 0% { transform-origin: left bottom; -webkit-transform: rotate(45deg); transform: rotate(45deg); opacity: 0; } 0%, to { -webkit-transform-origin: left bottom; } to { transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInUpLeft { -webkit-animation-name: rotateInUpLeft; animation-name: rotateInUpLeft; } @-webkit-keyframes rotateInUpRight { 0% { transform-origin: right bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } 0%, to { -webkit-transform-origin: right bottom; } to { transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInUpRight { 0% { transform-origin: right bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } 0%, to { -webkit-transform-origin: right bottom; } to { transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInUpRight { -webkit-animation-name: rotateInUpRight; animation-name: rotateInUpRight; } @-webkit-keyframes rotateOut { 0% { transform-origin: center; opacity: 1; } 0%, to { -webkit-transform-origin: center; } to { transform-origin: center; -webkit-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } } @keyframes rotateOut { 0% { transform-origin: center; opacity: 1; } 0%, to { -webkit-transform-origin: center; } to { transform-origin: center; -webkit-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } } .rotateOut { -webkit-animation-name: rotateOut; animation-name: rotateOut; } @-webkit-keyframes rotateOutDownLeft { 0% { transform-origin: left bottom; opacity: 1; } 0%, to { -webkit-transform-origin: left bottom; } to { transform-origin: left bottom; -webkit-transform: rotate(45deg); transform: rotate(45deg); opacity: 0; } } @keyframes rotateOutDownLeft { 0% { transform-origin: left bottom; opacity: 1; } 0%, to { -webkit-transform-origin: left bottom; } to { transform-origin: left bottom; -webkit-transform: rotate(45deg); transform: rotate(45deg); opacity: 0; } } .rotateOutDownLeft { -webkit-animation-name: rotateOutDownLeft; animation-name: rotateOutDownLeft; } @-webkit-keyframes rotateOutDownRight { 0% { transform-origin: right bottom; opacity: 1; } 0%, to { -webkit-transform-origin: right bottom; } to { transform-origin: right bottom; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); opacity: 0; } } @keyframes rotateOutDownRight { 0% { transform-origin: right bottom; opacity: 1; } 0%, to { -webkit-transform-origin: right bottom; } to { transform-origin: right bottom; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); opacity: 0; } } .rotateOutDownRight { -webkit-animation-name: rotateOutDownRight; animation-name: rotateOutDownRight; } @-webkit-keyframes rotateOutUpLeft { 0% { transform-origin: left bottom; opacity: 1; } 0%, to { -webkit-transform-origin: left bottom; } to { transform-origin: left bottom; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); opacity: 0; } } @keyframes rotateOutUpLeft { 0% { transform-origin: left bottom; opacity: 1; } 0%, to { -webkit-transform-origin: left bottom; } to { transform-origin: left bottom; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); opacity: 0; } } .rotateOutUpLeft { -webkit-animation-name: rotateOutUpLeft; animation-name: rotateOutUpLeft; } @-webkit-keyframes rotateOutUpRight { 0% { transform-origin: right bottom; opacity: 1; } 0%, to { -webkit-transform-origin: right bottom; } to { transform-origin: right bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } } @keyframes rotateOutUpRight { 0% { transform-origin: right bottom; opacity: 1; } 0%, to { -webkit-transform-origin: right bottom; } to { transform-origin: right bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } } .rotateOutUpRight { -webkit-animation-name: rotateOutUpRight; animation-name: rotateOutUpRight; } @-webkit-keyframes hinge { 0% { transform-origin: top left; } 0%, 20%, 60% { -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate(80deg); transform: rotate(80deg); transform-origin: top left; } 40%, 80% { -webkit-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; opacity: 1; } to { -webkit-transform: translate3d(0, 700px, 0); transform: translate3d(0, 700px, 0); opacity: 0; } } @keyframes hinge { 0% { transform-origin: top left; } 0%, 20%, 60% { -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate(80deg); transform: rotate(80deg); transform-origin: top left; } 40%, 80% { -webkit-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; opacity: 1; } to { -webkit-transform: translate3d(0, 700px, 0); transform: translate3d(0, 700px, 0); opacity: 0; } } .hinge { -webkit-animation-name: hinge; animation-name: hinge; } @-webkit-keyframes rollIn { 0% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0) rotate(-120deg); transform: translate3d(-100%, 0, 0) rotate(-120deg); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes rollIn { 0% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0) rotate(-120deg); transform: translate3d(-100%, 0, 0) rotate(-120deg); } to { opacity: 1; -webkit-transform: none; transform: none; } } .rollIn { -webkit-animation-name: rollIn; animation-name: rollIn; } @-webkit-keyframes rollOut { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0) rotate(120deg); transform: translate3d(100%, 0, 0) rotate(120deg); } } @keyframes rollOut { 0% { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0) rotate(120deg); transform: translate3d(100%, 0, 0) rotate(120deg); } } .rollOut { -webkit-animation-name: rollOut; animation-name: rollOut; } @-webkit-keyframes zoomIn { 0% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 50% { opacity: 1; } } @keyframes zoomIn { 0% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 50% { opacity: 1; } } .zoomIn { -webkit-animation-name: zoomIn; animation-name: zoomIn; } @-webkit-keyframes zoomInDown { 0% { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomInDown { 0% { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } .zoomInDown { -webkit-animation-name: zoomInDown; animation-name: zoomInDown; } @-webkit-keyframes zoomInLeft { 0% { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomInLeft { 0% { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } .zoomInLeft { -webkit-animation-name: zoomInLeft; animation-name: zoomInLeft; } @-webkit-keyframes zoomInRight { 0% { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomInRight { 0% { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } .zoomInRight { -webkit-animation-name: zoomInRight; animation-name: zoomInRight; } @-webkit-keyframes zoomInUp { 0% { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomInUp { 0% { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } 60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } .zoomInUp { -webkit-animation-name: zoomInUp; animation-name: zoomInUp; } @-webkit-keyframes zoomOut { 0% { opacity: 1; } 50% { -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 50%, to { opacity: 0; } } @keyframes zoomOut { 0% { opacity: 1; } 50% { -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 50%, to { opacity: 0; } } .zoomOut { -webkit-animation-name: zoomOut; animation-name: zoomOut; } @-webkit-keyframes zoomOutDown { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } to { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomOutDown { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } to { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } .zoomOutDown { -webkit-animation-name: zoomOutDown; animation-name: zoomOutDown; } @-webkit-keyframes zoomOutLeft { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0); transform: scale(0.1) translate3d(-2000px, 0, 0); -webkit-transform-origin: left center; transform-origin: left center; } } @keyframes zoomOutLeft { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0); transform: scale(0.1) translate3d(-2000px, 0, 0); -webkit-transform-origin: left center; transform-origin: left center; } } .zoomOutLeft { -webkit-animation-name: zoomOutLeft; animation-name: zoomOutLeft; } @-webkit-keyframes zoomOutRight { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(0.1) translate3d(2000px, 0, 0); transform: scale(0.1) translate3d(2000px, 0, 0); -webkit-transform-origin: right center; transform-origin: right center; } } @keyframes zoomOutRight { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(0.1) translate3d(2000px, 0, 0); transform: scale(0.1) translate3d(2000px, 0, 0); -webkit-transform-origin: right center; transform-origin: right center; } } .zoomOutRight { -webkit-animation-name: zoomOutRight; animation-name: zoomOutRight; } @-webkit-keyframes zoomOutUp { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } to { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } @keyframes zoomOutUp { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } to { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } } .zoomOutUp { -webkit-animation-name: zoomOutUp; animation-name: zoomOutUp; } @-webkit-keyframes slideInDown { 0% { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); visibility: visible; } to { -webkit-transform: translateZ(0); transform: translateZ(0); } } @keyframes slideInDown { 0% { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); visibility: visible; } to { -webkit-transform: translateZ(0); transform: translateZ(0); } } .slideInDown { -webkit-animation-name: slideInDown; animation-name: slideInDown; } @-webkit-keyframes slideInLeft { 0% { -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); visibility: visible; } to { -webkit-transform: translateZ(0); transform: translateZ(0); } } @keyframes slideInLeft { 0% { -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); visibility: visible; } to { -webkit-transform: translateZ(0); transform: translateZ(0); } } .slideInLeft { -webkit-animation-name: slideInLeft; animation-name: slideInLeft; } @-webkit-keyframes slideInRight { 0% { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); visibility: visible; } to { -webkit-transform: translateZ(0); transform: translateZ(0); } } @keyframes slideInRight { 0% { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); visibility: visible; } to { -webkit-transform: translateZ(0); transform: translateZ(0); } } .slideInRight { -webkit-animation-name: slideInRight; animation-name: slideInRight; } @-webkit-keyframes slideInUp { 0% { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); visibility: visible; } to { -webkit-transform: translateZ(0); transform: translateZ(0); } } @keyframes slideInUp { 0% { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); visibility: visible; } to { -webkit-transform: translateZ(0); transform: translateZ(0); } } .slideInUp { -webkit-animation-name: slideInUp; animation-name: slideInUp; } @-webkit-keyframes slideOutDown { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); } to { visibility: hidden; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } } @keyframes slideOutDown { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); } to { visibility: hidden; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } } .slideOutDown { -webkit-animation-name: slideOutDown; animation-name: slideOutDown; } @-webkit-keyframes slideOutLeft { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); } to { visibility: hidden; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } @keyframes slideOutLeft { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); } to { visibility: hidden; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } .slideOutLeft { -webkit-animation-name: slideOutLeft; animation-name: slideOutLeft; } @-webkit-keyframes slideOutRight { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); } to { visibility: hidden; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } @keyframes slideOutRight { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); } to { visibility: hidden; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } .slideOutRight { -webkit-animation-name: slideOutRight; animation-name: slideOutRight; } @-webkit-keyframes slideOutUp { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); } to { visibility: hidden; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } @keyframes slideOutUp { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); } to { visibility: hidden; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } .slideOutUp { -webkit-animation-name: slideOutUp; animation-name: slideOutUp; } * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } html { font-size: 16px; line-height: 1; margin: 0; padding: 0; height: 100%; font-family: 'OpenSans', Helvetica, Arial, sans-serif; font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; font-size: 1rem; text-rendering: optimizelegibility; background-color: transparent !important; } body { color: #000000; background-color: #ffffff; height: 100%; margin: 0; padding: 0; } img { margin: 0; padding: 0; } a { color: #2261a0; } a:hover { color: #000000; } .grid { width: 100%; max-width: 1200px; margin: 0 auto; } .grid_full { width: 100%; max-width: 100%; margin: 0 auto; } .grid_1 { width: 6.5%; } .grid_2 { width: 15%; } .grid_3 { width: 23.5%; } .grid_4 { width: 32%; } .grid_5 { width: 40.5%; } .grid_6 { width: 49%; } .grid_7 { width: 57.5%; } .grid_8 { width: 66%; } .grid_9 { width: 74.5%; } .grid_10 { width: 83%; } .grid_11 { width: 91.5%; } .grid_12 { width: 100%; } *[class*="grid_"] { margin-right: 2%; float: left; } .last { margin-right: 0; } *[class*="push_"], *[class*="pull_"] { position: relative; } .grid_half { width: 49%; } .grid_third { width: 32%; } .grid_quarter { width: 23.5%; } .grid_full { width: 100%; margin-right: 0; } .push_1 { left: 8.5%; } .push_2 { left: 17%; } .push_3 { left: 25.5%; } .push_4 { left: 34%; } .push_5 { left: 42.5%; } .push_6 { left: 51%; } .push_7 { left: 59.5%; } .push_8 { left: 68%; } .push_9 { left: 76.5%; } .push_10 { left: 85%; } .push_11 { left: 93.5%; } .push_12 { left: 102%; } .pull_1 { right: 8.5%; } .pull_2 { right: 17%; } .pull_3 { right: 25.5%; } .pull_4 { right: 34%; } .pull_5 { right: 42.5%; } .pull_6 { right: 51%; } .pull_7 { right: 59.5%; } .pull_8 { right: 68%; } .pull_9 { right: 76.5%; } .pull_10 { right: 85%; } .pull_11 { right: 93.5%; } .pull_12 { right: 102%; } .pre_1 { margin-left: 8.5%; } .pre_2 { margin-left: 17%; } .pre_3 { margin-left: 25.5%; } .pre_4 { margin-left: 34%; } .pre_5 { margin-left: 42.5%; } .pre_6 { margin-left: 51%; } .pre_7 { margin-left: 59.5%; } .pre_8 { margin-left: 68%; } .pre_9 { margin-left: 76.5%; } .pre_10 { margin-left: 85%; } .pre_11 { margin-left: 93.5%; } .pre_12 { margin-left: 102%; } .post_1 { margin-right: 10.5%; } .post_2 { margin-right: 19%; } .post_3 { margin-right: 27.5%; } .post_4 { margin-right: 36%; } .post_5 { margin-right: 44.5%; } .post_6 { margin-right: 53%; } .post_7 { margin-right: 61.5%; } .post_8 { margin-right: 70%; } .post_9 { margin-right: 78.5%; } .post_10 { margin-right: 87%; } .post_11 { margin-right: 95.5%; } .post_12 { margin-right: 104%; } .floatLeft { float: left; } .floatRight { float: right; } .floatL { float: left; } .floatR { float: right; } .clear { clear: both; } .hidden { display: none; } .breatheRight { margin-right: .5rem; } .breatheLeft { margin-left: .5rem; } .uppercase { text-transform: uppercase; } .mobilePadding { padding-left: 1rem; padding-right: 1rem; } .ieflexfix { min-height: 1px; } .bgCover { -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .bgContain { -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain; } .textshadow { text-shadow: 6px 6px 10px rgba(0, 0, 0, 0.4); } .vertC { display: flex; align-items: center; } .nailthumb-container { width: auto; height: auto; margin: 0 0 0 0; padding: 0px; overflow: hidden; position: relative; text-align: left; } .nailthumb-container img.nailthumb-image { margin: 0px; padding: 0px; max-width: none; text-align: left; float: left; } .nailthumb-container span.nailthumb-title { background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5); bottom: 0; color: White; display: block; font-size: 9px; height: 20px; left: 0; margin-top: 2px; line-height: 20px; position: relative; text-align: center; width: 100%; overflow: hidden; float: left; } .nailthumb-container span.nailthumb-title .nailthumb-title-scroller { padding-left: 2px; } .nailthumb-container img { max-width: none; text-align: left; } .square-thumb { width: 80px; height: 80px; } @font-face { font-family: 'OpenSansLight'; src: url('../fonts/OpenSans-Light-webfont.eot'); src: url('../fonts/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/OpenSans-Light-webfont.ttf') format('truetype'), url('../fonts/OpenSans-Light-webfont.svg#OpenSansLight') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'OpenSansLightItalic'; src: url('../fonts/OpenSans-LightItalic-webfont.eot'); src: url('../fonts/OpenSans-LightItalic-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/OpenSans-LightItalic-webfont.ttf') format('truetype'), url('../fonts/OpenSans-LightItalic-webfont.svg#OpenSansLightItalic') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'OpenSans'; src: url('../fonts/OpenSans-Regular-webfont.eot'); src: url('../fonts/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/OpenSans-Regular-webfont.ttf') format('truetype'), url('../fonts/OpenSans-Regular-webfont.svg#OpenSansRegular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'OpenSansItalic'; src: url('../fonts/OpenSans-Italic-webfont.eot'); src: url('../fonts/OpenSans-Italic-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/OpenSans-Italic-webfont.ttf') format('truetype'), url('../fonts/OpenSans-Italic-webfont.svg#OpenSansItalic') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'OpenSansBold'; src: url('../fonts/OpenSans-Bold-webfont.eot'); src: url('../fonts/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/OpenSans-Bold-webfont.ttf') format('truetype'), url('../fonts/OpenSans-Bold-webfont.svg#OpenSansBold') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'OpenSansBoldItalic'; src: url('../fonts/OpenSans-BoldItalic-webfont.eot'); src: url('../fonts/OpenSans-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/OpenSans-BoldItalic-webfont.ttf') format('truetype'), url('../fonts/OpenSans-BoldItalic-webfont.svg#OpenSansBoldItalic') format('svg'); font-weight: normal; font-style: normal; } .fontR { font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; } em, i, .fontI { font-family: 'OpenSansItalic', Arial, sans-serif; font-weight: normal; font-style: normal; } .fontB, b, strong { font-family: 'OpenSansBold', Arial, sans-serif; font-weight: normal; font-style: normal; } .fontBI { font-family: 'OpenSansBoldItalic', Arial, sans-serif; font-weight: normal; font-style: normal; } .fontL { font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; } .fontLI { font-family: 'OpenSansLightItalic', Arial, sans-serif; font-weight: normal; font-style: normal; } .baseFont { font-family: 'OpenSans', Helvetica, Arial, sans-serif; font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; font-size: 1rem; color: #333333; text-rendering: optimizelegibility; } .font-tiny { font-size: 0.75rem; } .font-small { font-size: 0.9rem; } .font-normal { font-size: 1rem; } .font-large { font-size: 1.3rem; } .font-huge { font-size: 1.75rem; } .font-giant { font-size: 2rem; } .font-epic { font-size: 3rem; } .textL { text-align: left; } .textR { text-align: right; } .textC { text-align: center; } p, ul, ol { line-height: 1.6; margin-bottom: 1.25rem; } li { margin-bottom: 0.5rem; } h1 { color: #333333; font-size: 2rem; font-family: 'OpenSansBold', Arial, sans-serif; font-weight: normal; font-style: normal; margin: 0; padding: 2rem 0 .5rem 0; } h2 { color: #333333; font-size: 1.3rem; padding: 1.5rem 0 0rem 0; margin: 0; } h3 { font-size: 1.3rem; font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; color: #333333; margin: 0; padding: 1.5rem 0 0rem 0; } .majorHeading { font-size: 2rem; color: #333333; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; } .minorHeading { font-size: 1.75rem; color: #000000; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; } .subHeading { font-size: 1.3rem; color: #333333; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; } .quietHeading { font-size: 1.3rem; color: #777777; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; } .bodytext { font-size: 1rem; color: #333333; font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; } .cleanHeading { color: #000000; font-size: 2rem; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; padding: 1rem 0; } .hero { margin: 0; font-size: 1.3rem; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; } .article h2 { color: #000000; font-size: 2rem; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; padding: 1rem 0; margin-top: 2rem; padding: 0 0 .5rem 0; line-height: 1.2; } .article h2:first-of-type { margin-top: 2rem; } .article h1 + h2 { margin-top: .5rem !important; } .article p, .article ul, .article ol { font-size: 1rem; color: #333333; font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; } p.feature { font-size: 1.3rem; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; } .article h1 { line-height: 1.4; } .componentPage h1 { margin: 1.5rem 0 2rem 0; padding-top: 0; } #printlogo { display: none; } .bulleted li:before { content: "\00BB\2002"; margin-left: -25px; } .bulleted li { padding-left: 25px; } .bulleted.bullets-do li:before { content: "\2714\0020"; margin-left: -25px; margin-right: 8px; color: green; } .bulleted.bullets-do li { margin-bottom: .6rem; } .bulleted.bullets-donot li:before { content: "\2718\0020"; margin-left: -25px; margin-right: 8px; color: red; } .bulleted.bullets-donot li { margin-bottom: .6rem; } .flatButton { background-color: #2261a0; color: #ffffff; padding: .7rem 1rem; margin: 0.5rem 0; display: inline-block; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .flatButton:hover { background-color: #102e4c; cursor: pointer; } .flatButton-reverse { background-color: #102e4c; color: #ffffff; padding: .7rem 1rem; margin: 0.5rem 0; display: inline-block; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .flatButton-reverse:hover { background-color: #ffffff; color: #000000; cursor: pointer; } .downloadButton { background-color: transparent; font-size: .9rem; color: #333333; border: 1px solid #777777; padding: .7rem 1rem; margin: 0.6rem 0; display: inline-block; font-size: 1.3rem; padding: 1rem 1rem; margin-top: 0; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; width: 100%; } .downloadButton:hover { background-color: #000000; color: #ffffff; border: 1px solid #000000; cursor: pointer; } .downloadButton span { float: right; } .quietButton { background-color: transparent; font-size: .9rem; color: #333333; border: 1px solid #777777; padding: .7rem 1rem; margin: 0.6rem 0; display: inline-block; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .quietButton:hover { background-color: #000000; color: #ffffff; border: 1px solid #000000; cursor: pointer; } .quietButton-reverse { background-color: transparent; font-size: .9rem; color: #ffffff; border: 1px solid #ffffff; padding: .5rem .8rem; margin: 0.6rem 0; display: inline-block; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .quietButton-reverse:hover { background-color: #ffffff; color: #000000; border: 1px solid #ffffff; cursor: pointer; } .ghostButton { background-color: #e6e6e6; font-size: .9rem; color: #333333; border: 1px solid #e6e6e6; padding: .7rem 1.5rem; margin: 0.6rem 0; display: inline-block; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .ghostButton:hover { background-color: #000000; color: #ffffff; border: 1px solid #000000; cursor: pointer; } .returntotop { position: fixed; bottom: 2rem; right: 2rem; display: none; border: 1px solid #777777; color: #000000; background-color: #e6e6e6; font-size: 0.9rem; text-decoration: none; padding: .7rem .75rem .75rem .75rem; z-index: 100; } .fade .returntotop:hover { background-color: #000000; color: #ffffff; border: 1px solid #000000; } #mobileHome { display: none; } #home-nav { -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; padding: 0rem 2rem 1rem 2rem; letter-spacing: 0.05em; z-index: 10000; position: fixed; width: 100%; transition: all 1s ease; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: fadeInDown; animation-name: fadeInDown; background: rgba(0, 0, 0, 0); background: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.4) 100%); background: -webkit-gradient(left bottom, left top, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 0.4))); background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.4) 100%); background: -o-linear-gradient(bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.4) 100%); background: -ms-linear-gradient(bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.4) 100%); background: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.4) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#000000', GradientType=0); } #home-nav .mainLogo { padding: 1rem 0; } #home-nav .mainLogo img { max-height: 60px; max-width: 420px; -webkit-filter: drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.8)); filter: drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.8)); -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } #home-nav ul { text-align: right; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; padding: 0; list-style: none; margin: 0 0 0 0; display: block; } #home-nav ul li { -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; letter-spacing: 0.05em; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; text-transform: uppercase; font-size: 1.3rem; line-height: 1; padding: 0 0 0 3.5rem; display: inline-block; vertical-align: middle; margin: 0; color: #ffffff; text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.8); } #home-nav ul li.homepageTollFree, #home-nav ul li.homepage911, #home-nav ul li.homepageOnlineReporting { font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; text-align: center; font-size: 1rem; line-height: 1.25; } #home-nav ul li.homepageTollFree span, #home-nav ul li.homepage911 span, #home-nav ul li.homepageOnlineReporting span { font-size: 1.3rem; font-family: 'OpenSansBold', Arial, sans-serif; font-weight: normal; font-style: normal; } #home-nav ul li.homepageOnlineReporting { font-size: 1.15rem; } #home-nav ul li.homepageOnlineReporting a { color: #ffcc33; } #home-nav ul a { -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; color: #ffffff; text-decoration: none; } #home-nav ul a:hover { color: #ffcc33; } #home-nav.small { background-color: rgba(0, 0, 0, 0.8); -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; -webkit-box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); -moz-box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); padding: 0rem 2rem 0 2rem; } #home-nav.small img { -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; max-height: 40px; max-width: 250px; } #home-nav.small ul { -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; padding: .65rem 0 .5rem 0; } #home-nav.small ul li { -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; padding: 0 0 0 3rem; } #aboveFold { margin: 0; padding: 0; min-height: 80vh; z-index: -2; } .fader div { background-repeat: no-repeat; background-position: center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; margin: 0; padding: 0; position: absolute; top: 0; left: 0; right: 0; bottom: 20vh; } .fader div.fader1 { background-image: url('../templates/home/images/fader1-large.jpg'); } .fader div.fader2 { background-image: url('../templates/home/images/fader2-large.jpg'); } .fader div.fader3 { background-image: url('../templates/home/images/fader3-large.jpg'); } .fader div.fader4 { background-image: url('../templates/home/images/fader4-large.jpg'); } .fader div.fader5 { background-image: url('../templates/home/images/fader5-large.jpg'); } .fader div.fader6 { background-image: url('../templates/home/images/fader6-large.jpg'); } .fader div.fader7 { background-image: url('../templates/home/images/fader7-large.jpg'); } #belowFold { width: 100%; margin: 0; padding: 0; background-color: #ffffff; } .homepageCore { position: relative; padding-left: 2rem; padding-top: 5vh; min-width: 550px; max-width: 700px !important; height: 75vh; z-index: 105; } .homepageCore .homepageMission { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: fadeIn; animation-name: fadeIn; -webkit-animation-delay: 0.5s; animation-delay: 0.5s; -webkit-animation-duration: 1.5s; /* Chrome, Safari, Opera */ animation-duration: 1.5s; font-size: 1.75rem; line-height: 1.1; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; color: #ffffff; letter-spacing: -0.03rem; text-shadow: 0px 0px 15px rgba(0, 0, 0, 0.8); } .homepageCore #homepageSearch { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: fadeIn; animation-name: fadeIn; -webkit-animation-delay: 0.5s; animation-delay: 0.5s; -webkit-animation-duration: 1.5s; /* Chrome, Safari, Opera */ animation-duration: 1.5s; margin: 1rem 0 0 0; background-color: #ffffff; -webkit-box-shadow: 6px 6px 10px 0 rgba(0, 0, 0, 0.4); -moz-box-shadow: 6px 6px 10px 0 rgba(0, 0, 0, 0.4); box-shadow: 6px 6px 10px 0 rgba(0, 0, 0, 0.4); } .homepageCore #homepageSearch .searchButton { padding: 0; margin: 0; text-align: right; } .homepageCore #homepageSearch .searchButton img { margin: .1rem .7rem 0 0; opacity: 0.5; width: 2rem; height: 2rem; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .homepageCore #homepageSearch .searchButton:hover { cursor: pointer; } .homepageCore #homepageSearch .searchButton:hover img { opacity: 1; } .homepageCore #homepageSearch .clearButton { padding: 0; margin: 0; text-align: right; } .homepageCore #homepageSearch .clearButton img { margin: .1rem .7rem 0 0; opacity: 1; width: 2.5rem; height: 2.5rem; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .homepageCore #homepageSearch .clearButton:hover { cursor: pointer; } .homepageCore #homepageSearch input { margin: 0; padding: .75rem 1rem; width: 85%; color: #000000; font-size: 1.15rem; border: none; font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; background-color: none; } .homepageCore #homepageSearch input:focus { outline-width: 0; } .homepageCore #homepagePopular { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: fadeIn; animation-name: fadeIn; -webkit-animation-delay: 0.5s; animation-delay: 0.5s; -webkit-animation-duration: 1.5s; /* Chrome, Safari, Opera */ animation-duration: 1.5s; margin: 1.5rem 0 0 0; padding: 1rem; opacity: 0; background-color: rgba(0, 0, 0, 0.9); } .homepageCore #homepagePopular h2 { font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; font-size: 1.3rem; line-height: 1; padding: 0 0 .5rem 0; display: block; margin: 0 0 0 0; color: #ffcc33; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .homepageCore #homepagePopular ul { display: block; padding: 0; list-style: none; margin: 0; } .homepageCore #homepagePopular ul li:before { content: "\00BB\2002"; margin-left: -25px; } .homepageCore #homepagePopular ul li { padding-left: 25px; } .homepageCore #homepagePopular ul.bullets-do li:before { content: "\2714\0020"; margin-left: -25px; margin-right: 8px; color: green; } .homepageCore #homepagePopular ul.bullets-do li { margin-bottom: .6rem; } .homepageCore #homepagePopular ul.bullets-donot li:before { content: "\2718\0020"; margin-left: -25px; margin-right: 8px; color: red; } .homepageCore #homepagePopular ul.bullets-donot li { margin-bottom: .6rem; } .homepageCore #homepagePopular ul a { color: #ffffff; text-decoration: none; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .homepageCore #homepagePopular ul a:hover { color: #ffcc33; } .homepageCore #homepagePopular ul li { font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; font-size: 1rem; line-height: 1.5; padding: 0 0 0 0.5rem; display: block; margin: 0 0 0 1rem; color: #ffcc33; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } #homepageNews { padding: 3rem 5rem; background-color: #ffffff; } #homepageNews h2 { font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; font-size: 2rem; margin-top: 0; padding-top: 0; margin-bottom: 2rem; } .homepageNews-featured { padding: 0; } .homepageNews-featured h3 { color: #000000; font-size: 1.75rem; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; line-height: 1.3; margin-top: 0; padding-top: 0; } .homepageNews-featured-pic img { width: 100%; padding-bottom: 1.5rem; } #searchResults { min-height: 10rem; color: #000000; background-color: #ffffff; padding: 1rem; border-top: 2px solid #e6e6e6; -webkit-box-shadow: 6px 6px 10px 0 rgba(0, 0, 0, 0.4); -moz-box-shadow: 6px 6px 10px 0 rgba(0, 0, 0, 0.4); box-shadow: 6px 6px 10px 0 rgba(0, 0, 0, 0.4); -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } #searchResults h3 { font-size: 1.75rem; color: #000000; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; padding: 0; font-size: 1.3rem; } #searchResults a { text-decoration: none; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } #searchResults a:hover { text-decoration: underline; color: #2261a0; } #searchResults ul { list-style: none; padding: 0; } #searchResults ul li:before { content: "\00BB\2002"; margin-left: -25px; } #searchResults ul li { padding-left: 25px; } #searchResults ul.bullets-do li:before { content: "\2714\0020"; margin-left: -25px; margin-right: 8px; color: green; } #searchResults ul.bullets-do li { margin-bottom: .6rem; } #searchResults ul.bullets-donot li:before { content: "\2718\0020"; margin-left: -25px; margin-right: 8px; color: red; } #searchResults ul.bullets-donot li { margin-bottom: .6rem; } #searchResults li { padding: 0; margin: 0; font-size: 0.9rem; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } #searchResults span { margin: 0; } .four-oh-four #searchResults { color: #000000; background-color: transparent; padding: 0; border-top: 0px solid #e6e6e6; box-shadow: none; } .four-oh-four #searchResults h3 { padding: 0 0 .75rem 0; } .four-oh-four #searchResults li { font-size: 1rem; } #homepageScroll { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: fadeIn; animation-name: fadeIn; -webkit-animation-delay: 2s; animation-delay: 2s; -webkit-animation-duration: 2s; /* Chrome, Safari, Opera */ animation-duration: 2s; z-index: 100; color: #ffffff; opacity: 0; position: absolute; bottom: 0; width: 100%; margin-right: 0; margin: 0; padding: 4rem 0 2rem 2rem; background: rgba(0, 0, 0, 0); background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 0.6))); background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%); background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%); background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%); background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#000000', GradientType=0); } #homepageScroll img { width: 2rem; vertical-align: middle; } #homepageScroll a { text-decoration: none; } #homepageScroll a span { font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; font-size: 1.3rem; text-transform: uppercase; letter-spacing: 0.1rem; color: #ffffff; text-decoration: none; vertical-align: middle; padding: 0 0 0 1.5rem; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } #homepageScroll a span:hover { color: #ffcc33; } #homepageScroll a:hover { text-decoration: none; } #homepageScroll.amberInEffect { bottom: 15%; } #home-nav .languageToggle { color: #333333; border: 1px solid #777777; padding: 0.5rem .75rem; font-size: 0.75rem; display: inline-block; text-transform: capitalize; color: #ffffff; border: 1px solid #ffffff; font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } #home-nav .languageToggle:hover { border: 1px solid #000000; background-color: #000000; color: #ffcc33; } #home-nav .languageToggle:hover { border: 1px solid #ffffff; background-color: #ffffff; color: #000000; } #home-nav.small .languageToggle { color: #777777; border: 1px solid #777777; } .languageToggle { color: #333333; border: 1px solid #777777; padding: 0.5rem .75rem; font-size: 0.75rem; display: inline-block; text-transform: capitalize; font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .languageToggle:hover { border: 1px solid #000000; background-color: #000000; color: #ffcc33; } #aboveFold.amberInEffect { min-height: 85%; } #amberContent { display: none; } #amberContent .band-block { max-width: 100%; padding: 0; } #amberContent h2 { font-size: 2rem; font-family: 'OpenSansBold', Arial, sans-serif; font-weight: normal; font-style: normal; color: #000000; } #amberContent p { font-size: 1.3rem; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; margin-top: 0; } #amberContent h1 { display: block; background-color: #ffcc33; width: 100%; margin: 1rem 0; padding: 1.5rem 0; font-size: 2.3rem; font-family: 'OpenSansBold', Arial, sans-serif; font-weight: normal; font-style: normal; text-align: center; color: #000000 !important; text-decoration: none !important; } #amberContent h1:hover { color: #000000 !important; text-decoration: none !important; } #amberContent a.amberNotice { display: block; background-color: #ffcc33; width: 100%; padding: 1.5rem 0; font-size: 2.3rem; font-family: 'OpenSansBold', Arial, sans-serif; font-weight: normal; font-style: normal; z-index: 9999; text-align: center; color: #000000 !important; text-decoration: none !important; } #amberContent a.amberNotice:hover { color: #000000 !important; text-decoration: none !important; } #amberContent .amberHome { padding: 2rem; border-bottom: 2px solid #000000; } #amberContent.amberInEffect { display: block; } #homepageNewsBar { padding: 0; background-color: #ffffff; } .homepageNewsBar--featuredstory { margin: 0; background-color: #ffffff; min-height: 500px; } .homepageNewsBar--featuredstory a:hover { text-decoration: none; } .homepageNewsBar--featuredstory-pic { background: #ffffff url('') center center no-repeat; background-size: cover; margin: 0; min-height: 500px; } .homepageNewsBar--featuredstory-meta { color: #333333; text-transform: uppercase; letter-spacing: 0.05em; display: block; } .homepageNewsBar--featuredstory-content { padding: 3rem 5rem; align-items: stretch; } .homepageNewsBar--featuredstory-content h2 { font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; font-size: 2rem; padding: 1.5rem 0 .5rem 0; margin: 0; color: #000000; line-height: 1.35; } .homepageNewsBar--featuredstory-content p { color: #333333; } .moreNewsLink { margin-left: 16px; text-decoration: none; float: right; margin-top: 1.25rem; } .band-header { width: 100%; height: 300px; overflow: hidden; margin: 0; padding: 0; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-color: #333333; } .band-header h2 { color: #ffffff; font-size: 3rem; margin-top: 7.5rem; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.6); } .band, .band-alt { padding: 3.5rem 0; background-color: #ffffff; } .band h2, .band-alt h2 { color: #000000; font-size: 2rem; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; padding: 1rem 0; width: 100%; max-width: 1200px; margin: 0 auto; } .band h3, .band-alt h3 { font-size: 1.3rem; color: #333333; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; padding: 0.5rem 0 1rem 0; } .band ul, .band-alt ul { list-style: none; margin: 0; padding: 0; } .band ul li, .band-alt ul li { margin-bottom: .25rem; } .band ul li span, .band-alt ul li span { color: #777777; padding-right: .5rem; } .band .slats a, .band-alt .slats a { color: #333333; text-decoration: none; } .band .slats ul, .band-alt .slats ul { margin: 1rem 0; } .band .slats ul li, .band-alt .slats ul li { padding: .5rem 0; border-top: 1px solid #e6e6e6; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; display: flex; align-items: center; } .band .slats ul li .slatsDate, .band-alt .slats ul li .slatsDate { padding: .4rem 0; color: #333333; font-size: .85rem; background-color: #e6e6e6; margin-right: 1rem; margin-bottom: 0; float: left; width: 25%; min-width: 100px; text-align: center; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .band .slats ul li .slatsText, .band-alt .slats ul li .slatsText { margin-right: 0; padding: 0 .5rem 0 0; float: left; width: 70%; } .band .slats ul li:hover .slatsDate, .band-alt .slats ul li:hover .slatsDate { background-color: #ffcc33; } .band-alt { background-color: #e6e6e6; box-shadow: inset 0 20px 35px -20px rgba(0, 0, 0, 0.25); } .band-alt .slats ul { margin: 0 0 1rem 0; } .band-alt .slats ul li { padding: .5rem .5rem .5rem 0; border-top: 1px solid #b3b3b3; } .band-alt .slats ul li .slatsDate { padding: .4rem 0; color: #333333; font-size: .85rem; background-color: #ffffff; margin-right: 1rem; margin-bottom: 0; float: left; width: 20%; min-width: 100px; text-align: center; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .band-alt .slats ul li .slatsText { padding: 0 .5rem 0 0; width: 80%; } .band-alt .slats ul li:hover .slatsDate { background-color: #ffcc33; } .band-block { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0; } .band-block h2 { padding: 0 0 1.5rem 0; } .band-spacer .band-block { margin-top: 4.5rem; } .callout { background-color: #ffffff; padding: 1.5rem; -webkit-box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); -moz-box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); } .callout a { text-decoration: none; } .callout span { font-size: 1.3rem; font-family: 'OpenSansBold', Arial, sans-serif; font-weight: normal; font-style: normal; display: block; padding: 0 0 1.5rem 0; line-height: 1.5; } .callout table { width: 100%; margin: 0; } .callout table td { border: 0px solid #b3b3b3; line-height: 1.5; padding: 0 0 .5rem 0; } .callout table td.label { font-family: 'OpenSansBold', Arial, sans-serif; font-weight: normal; font-style: normal; width: 25%; vertical-align: top; } .subFeatureL { padding-right: 3rem; } .subFeatureR { padding-left: 3rem; } .subFeatureL p.feature:first-of-type, .subFeatureR p.feature:first-of-type { margin-top: 0; } .social { position: relative; font-size: 1rem; color: #333333; font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; } .social .socialRow { border-top: 1px solid #cdcdcd; padding: .5rem .5rem; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .social .socialRow:hover { background-color: #ffffff; } .social a { text-decoration: none; color: #333333; } .social .socialIcon { margin-right: 1rem; vertical-align: middle; width: 24px; } .social .socialAccount { color: #000000; font-family: 'OpenSansBold', Arial, sans-serif; font-weight: normal; font-style: normal; margin-right: 1rem; display: block; } .social .socialDescription { color: #000000; display: block; margin-right: 1rem; } .homepage { background-color: #000000; } .homepage .band { padding: 0; background-color: transparent; } .homepage h1 { display: none; color: #ffffff; } .homepage .showcase { padding: 3rem 5rem; min-height: 500px; background-color: #ffffff; } .homepage .showcase h2 { padding: 0 0 0.5rem 0; } .homepage .showcaseImg { padding: 3rem 0; background-position: center center; background-repeat: no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; box-shadow: inset 0px 0px 20px rgba(0, 0, 0, 0.5); } .homepage .showcaseImg.who { background-image: url('../templates/home/images/home-who.jpg'); } .homepage .showcaseImg.what { background-image: url('../templates/home/images/home-what.jpg'); } .homepage .showcaseImg.contact { background-image: url('../templates/home/images/home-contact.jpg'); } .homepage .showcaseImg.careers { background-image: url('../templates/home/images/home-careers.jpg'); } .homepage .showcaseImg.news { background-image: url('../templates/home/images/home-news.jpg'); } .homepage .showcaseImg.scam { background-image: url('../templates/home/images/home-scam.jpg'); } .homepage .showcaseImg.playground { background-image: url('../templates/home/images/home-playground.jpg'); } .homepage .showcaseImg.violence { background-image: url('../templates/home/images/home-violence.jpg'); } .featuredInvest { margin-bottom: 1rem; } .featuredInvest .frame { margin-bottom: 1rem; } .featuredInvest .frame img { width: 100%; } .featuredInvest span.name { font-size: 1.3rem; font-family: 'OpenSansBold', Arial, sans-serif; font-weight: normal; font-style: normal; display: block; } .featuredInvest p { margin: 0.5rem 0; } .featuredInvest.featuredMissing { padding: .5rem; background-color: #ffffff; box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2); -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .missingThumb { width: 100%; height: 180px; } .currentInvest { width: 23.1%; display: inline-block; margin-right: 2%; padding: .5rem; margin-bottom: 1rem; background-color: #ffffff; box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2); -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; vertical-align: top; } .currentInvest:nth-of-type(4n+4) { margin-right: 0; } .currentInvest a { color: #333333; text-decoration: none; } .currentInvest span.name { display: block; padding: 0.75rem 0 .25rem 0; text-align: center; line-height: 1.3; min-height: 3.7rem; } .wantedRow { color: #333333; padding: .5rem; border-top: 1px solid #e6e6e6; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; display: flex; align-items: center; } .wantedRow:hover { background-color: #ffcc33; cursor: pointer; } .wantedRow a { color: #333333; text-decoration: none; display: flex; align-items: center; } .wantedRow .wantedInfo { font-size: 1.5rem; line-height: 1.3; padding-left: 1rem; display: inline-block; font-family: 'OpenSansBold', Arial, sans-serif; font-weight: normal; font-style: normal; width: auto; } .wantedRow .wantedInfo span { display: block; padding: 0 0 .5rem 0; font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; font-size: 1rem; } .wantedThumb { width: 80px; height: 80px; } .rewardsRow { color: #333333; padding: .5rem; border-top: 1px solid #e6e6e6; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; display: flex; align-items: center; width: 48.5%; margin-right: 2%; display: inline-block; vertical-align: top; } .rewardsRow:hover { background-color: #ffcc33; cursor: pointer; } .rewardsRow a { color: #333333; text-decoration: none; display: flex; align-items: center; } .rewardsRow:nth-of-type(even) { margin-right: 0; } .rewardsRow .rewardsInfo { font-size: 1rem; padding-left: 1rem; display: inline-block; width: auto; font-family: 'OpenSansBold', Arial, sans-serif; font-weight: normal; font-style: normal; line-height: 1.5; } .rewardsThumb { width: 60px; height: 60px; } .articlePage .summary, .resourcePage .summary, .circularPage .summary, .componentPage .summary { padding: 1.5rem 0 1.5rem 0; background-color: rgba(0, 0, 0, 0.8); bottom: 0; position: absolute; width: 100%; z-index: 100; text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); } .articlePage .summary h1, .resourcePage .summary h1, .circularPage .summary h1, .componentPage .summary h1 { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 0 0.75rem 0; color: #ffffff; } .articlePage .summary p, .resourcePage .summary p, .circularPage .summary p, .componentPage .summary p { font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; font-size: 1.3rem; color: #ffffff; width: 100%; max-width: 1200px; margin: 0 auto; } .articlePage .articleFeatImg, .resourcePage .articleFeatImg, .circularPage .articleFeatImg, .componentPage .articleFeatImg { height: 65vh; max-height: 65vh; background: #e6e6e6 no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; position: relative; margin-bottom: 0; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .articlePage .articleFeatImg.expanded, .resourcePage .articleFeatImg.expanded, .circularPage .articleFeatImg.expanded, .componentPage .articleFeatImg.expanded { height: 650px; max-height: 650px; } .article { width: 66%; } .article table { width: 100%; margin: 2rem 0 1rem 0; } .article table td { border: 1px solid #e6e6e6; padding: .75rem; font-size: 1rem; color: #333333; font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; line-height: 1.5; } .article table td.label { font-family: 'OpenSansBold', Arial, sans-serif; font-weight: normal; font-style: normal; width: 25%; vertical-align: top; } .breadcrumb { padding: .75rem 0 0 0; font-size: 0.75rem; width: 100%; max-width: 1200px; margin: 0 auto; color: #333333; } .breadcrumb a { color: #333333; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .breadcrumb a:hover { color: #2261a0; } .insidePage { margin-top: 3rem; min-height: 750px; } .pageTopNav { background-color: #ffffff; padding: .25rem 1rem; letter-spacing: 0.05em; z-index: 10000; position: fixed; width: 100%; -webkit-box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); -moz-box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); } .pageTopNav img { width: 280px; height: 50px; vertical-align: middle; } .pageTopNav ul { padding: .65rem 0 .5rem 0; list-style: none; margin: 0; display: block; text-align: right; } .pageTopNav ul li { letter-spacing: 0em; color: #000000; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; padding: 0 0 0 1.3rem; font-size: 1.1rem; line-height: 1; display: inline-block; margin: 0; vertical-align: middle; } .pageTopNav ul img { padding: 0 0 0 0; width: auto; } .pageTopNav ul a { color: #000000; text-decoration: none; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .pageTopNav ul a:hover { color: #2261a0 !important; } .pageTopNavSmall { background-color: #ffffff; letter-spacing: 0.05em; z-index: 10000; position: fixed; width: 100%; -webkit-box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); -moz-box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); padding: .25rem 1rem; } .pageTopNavSmall img { width: 280px; height: 50px; vertical-align: middle; } .pageTopNavSmall ul { padding: .65rem 0 .5rem 0; list-style: none; margin: 0; display: block; text-align: right; } .pageTopNavSmall ul li { letter-spacing: 0em; color: #000000; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; padding: 0 0 0 1.3rem; font-size: 1.1rem; line-height: 1; display: inline-block; margin: 0; vertical-align: middle; } .pageTopNavSmall ul img { padding: 0 0 0 0; width: auto; } .pageTopNavSmall ul a { color: #000000; text-decoration: none; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .pageTopNavSmall ul a:hover { color: #2261a0 !important; } .topNavSearch input { padding: 0; background-color: #ffffff; border: none; border-top: 2px solid #ffffff; border-bottom: 2px solid #aaaaaa; width: 0; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .topNavSearch input:focus { border-top-color: #ffffff; border-bottom-color: #aaaaaa; outline-width: 0; } .topNavSearch input.expanded { -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; width: 15rem; } .topNavSearch img { height: 24px; cursor: pointer; margin-top: -2px; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } #inPageMenu { width: 23.5%; margin-right: 0; float: right; padding: 0; } #inPageMenu .block { padding: 0; margin-bottom: 3rem; } #inPageMenu h2 { font-size: 1.3rem; color: #777777; font-family: 'OpenSansLight', Arial, sans-serif; font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; margin: 0 0 .75rem 0; padding: 0 0 .5rem 0; color: #333333; border-bottom: 1px solid #e6e6e6; } #inPageMenu ul { padding: 0; margin: 0; list-style: none; } #inPageMenu ul li { font-size: 0.9rem; color: #aaa; padding: 0; margin: 0 0 .6rem 0; line-height: 1.3; } #inPageMenu ul li a { text-decoration: none; color: #2261a0; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } #inPageMenu ul li a:hover { color: #000000; } #inPageMenu .toc ul { list-style: none; margin: 0 0 0 0; } #inPageMenu .toc ul li:before { content: "\00BB\2002"; margin-left: -15px; } #inPageMenu .toc ul li { padding-left: 15px; } p.excerpt { font-size: 1.3rem; } .notes { font-size: 0.9rem; } .resourcePage .breadcrumb, .circularPage .breadcrumb, .componentPage .breadcrumb { padding-top: 6rem; } .resourcePage #inPageMenu, .circularPage #inPageMenu, .componentPage #inPageMenu { margin-top: 2rem; } .resourcePage .downloadBlock, .circularPage .downloadBlock, .componentPage .downloadBlock { border: 1px solid #777777; padding: 1rem; margin-bottom: 3rem; } .resourcePage .insidePage, .circularPage .insidePage, .componentPage .insidePage { margin-top: 1rem; } .resourceIcon { width: 24px; margin-right: 1rem; vertical-align: middle; } .sidebarPhoto { margin-bottom: 3rem; } .sidebarPhoto figure { display: block; margin: 0; padding: 0; } .sidebarPhoto figure img { width: 100%; padding: 0 0 .75rem 0; margin: 0; } .sidebarPhoto figcaption { margin: 0; display: block; padding: 0; color: #333333; font-family: 'OpenSansItalic', Arial, sans-serif; font-weight: normal; font-style: normal; } img.fitPic { width: 100%; } .topicIndex input { padding: 1rem; border: 2px solid #2261a0; width: 75%; line-height: 1.5; font-size: 1.1rem; margin: 1rem 2% 1rem 0; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .topicIndex input:focus { border-color: #ffcc33; } .topicIndex a { display: block; padding: 0 0 .75rem 0; text-decoration: none; color: #333333; } .topicIndex span { line-height: 1.5; background-color: #2261a0; color: #ffffff; padding: .7rem 1rem; margin: 0.5rem 0; display: inline-block; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; text-align: center; font-size: 1.1rem; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; width: 20%; padding: 1.1rem; margin: 0; } .topicIndex span:hover { background-color: #102e4c; cursor: pointer; } .topicIndex span:hover { background-color: #000000; } .topicIndex .tmscontainer span { font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; background-color: transparent; font-size: .9rem; color: #333333; border: 1px solid #777777; padding: .7rem 1rem; margin: 0.6rem 0; display: inline-block; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; width: auto; } .topicIndex .tmscontainer span:hover { background-color: #000000; color: #ffffff; border: 1px solid #000000; cursor: pointer; } .topicIndex .tmscontainer { padding-top: 1rem; margin-bottom: 2rem; } .topicIndex .tmscontainer a { color: #2261a0; padding: 0; text-decoration: none; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .topicIndex .tmscontainer a:hover { color: #000000; } .topicIndex .tmscontainer ul { margin-bottom: 1.5rem; } .topicIndex .tmscontainer ul li:before { content: "\00BB\2002"; margin-left: -25px; } .topicIndex .tmscontainer ul li { padding-left: 25px; } .topicIndex .tmscontainer ul.bullets-do li:before { content: "\2714\0020"; margin-left: -25px; margin-right: 8px; color: green; } .topicIndex .tmscontainer ul.bullets-do li { margin-bottom: .6rem; } .topicIndex .tmscontainer ul.bullets-donot li:before { content: "\2718\0020"; margin-left: -25px; margin-right: 8px; color: red; } .topicIndex .tmscontainer ul.bullets-donot li { margin-bottom: .6rem; } .featured .frame { background: #cdcdcd no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; margin: 0; padding: 0; height: 180px; overflow: hidden; margin-bottom: 1rem; } .featured .frame img { width: 100%; } .featured h3 { padding: 0; line-height: 1.5; } .featured p { padding: 0; } #helpful { border: 1px solid #777777; padding: 1rem; color: #777777; font-size: 0.9rem; margin-bottom: 2rem; border-color: #e6e6e6; } #helpful h2 { color: #777777; padding: 0; font-size: 1.3rem; display: inline-block; vertical-align: middle; padding: 0.5rem 0; margin-top: 0; line-height: 1; } #helpful p { font-size: 0.9rem; font-family: 'OpenSansItalic', Arial, sans-serif; font-weight: normal; font-style: normal; } #helpful .helpfulChoices { float: right; } #helpful span { background-color: #e6e6e6; font-size: .9rem; color: #333333; border: 1px solid #e6e6e6; padding: .7rem 1.5rem; margin: 0.6rem 0; display: inline-block; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; margin: 0 0 0 0.5rem; } #helpful span:hover { background-color: #000000; color: #ffffff; border: 1px solid #000000; cursor: pointer; } #helpful textarea { padding: .5rem; margin: .5rem 0 1rem 0; width: 100%; display: block; border: 2px solid #e6e6e6; } #helpful textarea:focus { border: 2px solid #ffcc33; outline-width: 0; } #helpful #helpfulYes, #helpful #helpfulNo { display: none; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } #helpful .helpfulNoSubmit { float: right; } .lastUpdated { font-size: 0.75rem; color: #333333; margin: 3rem 0 3rem 0; font-family: 'OpenSansItalic', Arial, sans-serif; font-weight: normal; font-style: normal; } footer { border-top: 3px solid #333333; width: 100%; background-color: #161616; display: block; padding: 2rem 0 0 0; color: #e6e6e6; margin: 0; line-height: 1; } footer .footerNav { padding: 0 2rem 0 2rem; } footer h2 { font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; font-size: 1.5rem; color: #ffcc33; margin: 0 0 1.5rem 0; padding: 0; } footer a { color: #e6e6e6; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; text-decoration: none; } footer a:hover { color: #ffcc33; cursor: pointer; } footer ul { list-style: none; margin: 0; padding: 0; line-height: 1; } footer ul li { display: block; padding: 0 0 .1rem 0; margin: 0; color: #5e5e5e; text-align: left; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; line-height: 1.5; } footer ul a { color: #e6e6e6; } footer .subfooter { color: #777777; padding: 1rem 2rem 1.5rem 2rem; margin-top: 1.5rem; font-size: 0.9rem; background-color: #000000; } footer .subfooter .copyright { text-align: right; } .detDetails img { width: 100%; margin-bottom: 1rem; } .detDetails h2 { font-size: 1.75rem; color: #000000; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; margin: .5rem 0 1.5rem 0; padding-top: 0; } .detDetails table { width: 100%; } .detDetails table tr { border-top: 1px solid #e6e6e6; } .detDetails table td { padding: .5rem 0 .5rem 0; vertical-align: top; line-height: 1.5; font-family: 'OpenSansBold', Arial, sans-serif; font-weight: normal; font-style: normal; } .detDetails table td.details { width: 60%; margin: 0; color: #000000; font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; } #detachmentMap { width: 100%; height: 600px; overflow: hidden; } .finderSearch { background-color: #ffffff; padding: 1rem; border: 1px solid #e6e6e6; margin-bottom: 1rem; color: #333333; } .finderSearch p { margin: 0; } .finderSearch h2 { font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; padding: 0 0 1rem 0; } .finderSearch input { border: 2px solid #e6e6e6; padding: .5rem; margin-right: .5rem; margin-bottom: 1rem; width: 100%; display: inline-block; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .finderSearch input:focus { border-color: #ffcc33; } .finderSearch button { background-color: transparent; font-size: .9rem; color: #333333; border: 1px solid #777777; margin: 0.6rem 0; display: inline-block; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; float: right; font-size: 1rem; padding: .7rem 1rem; margin: 0; } .finderSearch button:hover { background-color: #000000; color: #ffffff; border: 1px solid #000000; cursor: pointer; } .finderResults { padding: 0; } .finderResults h2 { font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; padding: 0 0 1rem 0; } .finderDetachment { padding: .5rem .75rem; border-bottom: 1px solid #e6e6e6; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; line-height: 1.5; } .finderDetachment:hover { cursor: pointer; background-color: #e6e6e6; } .finderDetachment.highlighted { background-color: #ffffff; border: 3px solid #ffcc33; } .finderDetachment.highlighted:hover { cursor: default; } .finderDetachment p { margin: 0; } #drivdirec { line-height: 1.2; font-size: 0.9rem; } #drivdirec button { line-height: 1; } .finderList { margin-top: 3rem; } .finderList a { text-decoration: none; color: #000000; } .finderList ul { list-style: none; padding: 0; } .finderList li { padding: .4rem .6rem; border-bottom: 1px solid #e6e6e6; margin: 0; font-size: 0.9rem; text-transform: uppercase; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .finderList li:hover { background-color: #ffcc33; cursor: pointer; } .finderList h2 { font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; padding: 0 0 1rem 0; font-size: 1.75rem; } .panel { border: 1px solid #777777; padding: 1rem; } .gallery-cell { height: 300px; text-align: center; overflow: hidden; } .gallery-cell img { height: 100%; width: auto; } .galleryThumb img { width: 100%; margin-bottom: 1rem; } #orgAbout h3 { font-size: 1.8rem; padding: 1rem 0 0 0; } #orgAbout h3:first-of-type { padding-top: 0rem; } #orgAbout img { width: 100%; } #orgAbout .orgVision { padding: 0 0 0 3rem; } #orgAbout .orgVision h2 { font-size: 1.8rem; padding: 1rem 0 0 0; } #orgAbout .orgVision h2:first-of-type { padding-top: 0rem; } #orgChart .command span, #orgChart .commissioner span { display: block; padding: .5rem .5rem .75rem 0; line-height: 1.3; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; font-size: 1.5rem; vertical-align: bottom; } #orgChart .command h3, #orgChart .commissioner h3 { font-size: 1.5rem; padding: 1rem 0 .5rem 0; } #orgChart .command p, #orgChart .commissioner p { margin: 0 0 1rem 0; } #orgChart .command img, #orgChart .commissioner img { width: 100%; } #orgChart .command a, #orgChart .commissioner a { text-decoration: none; color: #000000; } #orgChart .command li, #orgChart .commissioner li { border: 1px solid #a6a6a6; padding: .5rem .75rem; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } #orgChart .command a li:hover, #orgChart .commissioner a li:hover { background-color: #ffffff; } #orgChart .commissioner { margin-bottom: 2rem; } #orgChart .commissioner h3 { font-size: 1.75rem; } #whatExplore h3, #whatStats h3, #whatPrograms h3, #whatInvestigations h3, #contactEmergency h3 { font-size: 1.8rem; padding: 1rem 0 0 0; } #whatExplore h2:first-of-type, #whatStats h2:first-of-type, #whatPrograms h2:first-of-type, #whatInvestigations h2:first-of-type, #contactEmergency h2:first-of-type { padding: 0 0 1.5rem 0; } #whatExplore ul li:before, #whatStats ul li:before, #whatPrograms ul li:before, #whatInvestigations ul li:before, #contactEmergency ul li:before { content: "\00BB\2002"; margin-left: -25px; } #whatExplore ul li, #whatStats ul li, #whatPrograms ul li, #whatInvestigations ul li, #contactEmergency ul li { padding-left: 25px; } #whatExplore ul.bullets-do li:before, #whatStats ul.bullets-do li:before, #whatPrograms ul.bullets-do li:before, #whatInvestigations ul.bullets-do li:before, #contactEmergency ul.bullets-do li:before { content: "\2714\0020"; margin-left: -25px; margin-right: 8px; color: green; } #whatExplore ul.bullets-do li, #whatStats ul.bullets-do li, #whatPrograms ul.bullets-do li, #whatInvestigations ul.bullets-do li, #contactEmergency ul.bullets-do li { margin-bottom: .6rem; } #whatExplore ul.bullets-donot li:before, #whatStats ul.bullets-donot li:before, #whatPrograms ul.bullets-donot li:before, #whatInvestigations ul.bullets-donot li:before, #contactEmergency ul.bullets-donot li:before { content: "\2718\0020"; margin-left: -25px; margin-right: 8px; color: red; } #whatExplore ul.bullets-donot li, #whatStats ul.bullets-donot li, #whatPrograms ul.bullets-donot li, #whatInvestigations ul.bullets-donot li, #contactEmergency ul.bullets-donot li { margin-bottom: .6rem; } #whatExplore ul a, #whatStats ul a, #whatPrograms ul a, #whatInvestigations ul a, #contactEmergency ul a { text-decoration: none; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } #whatExplore img, #whatStats img, #whatPrograms img, #whatInvestigations img, #contactEmergency img { width: 100%; margin-bottom: 1rem; } .stats { display: block; padding: .5rem 2rem 1.5rem 0rem; line-height: 1.5; color: #333333; } .stats span { padding: .25rem 0 0 0; font-size: 3rem; color: #2261a0; display: block; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; } #non-emergency, #emergency { text-align: center; border: 0.5rem solid #e6e6e6; padding: 2rem; } #non-emergency h2, #emergency h2 { font-family: 'OpenSansBold', Arial, sans-serif; font-weight: normal; font-style: normal; font-size: 1.9rem; margin-top: 0; line-height: 1.5; } #non-emergency p.feature, #emergency p.feature { font-size: 1.7rem; margin-top: 0; } .contactGeneral p.feature { margin-top: 0; } .contactPanel { margin-top: 1rem; padding-right: 1rem; } .contactPanel h3 { padding-bottom: 0.25rem; font-family: 'OpenSansBold', Arial, sans-serif; font-weight: normal; font-style: normal; } .loader { width: 2rem; height: 2rem; border-radius: 100%; margin: 0 auto; border: 4px solid rgba(0, 0, 0, 0.25); border-bottom-color: #2261a0; -webkit-animation: rotate 1s linear 0s infinite; animation: rotate 1s linear 0s infinite; } .loaderWrap { position: absolute; top: 20rem; right: 0; left: 0; } @keyframes rotate { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } #csrYes, #csrNo { padding: 1.5rem; background-color: #ffffff; border: 0px solid #777777; -webkit-box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); -moz-box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); } #csrYes h2, #csrNo h2 { font-family: 'OpenSansBold', Arial, sans-serif; font-weight: normal; font-style: normal; font-size: 1.9rem; margin-top: 0; line-height: 1; padding: .5rem 0 1.5rem 0; } #csrYes p.feature, #csrNo p.feature { font-size: 1.7rem; margin-top: 0; } #csrYes { border-top: 5px solid green; } #csrNo { border-top: 5px solid red; } #map-canvas { width: 100%; min-height: 600px; color: #000000; } #map-canvas p, #map-canvas a { color: #000000; font-size: 1rem; } #map-canvas a:hover { color: #2261a0; text-decoration: underline; } #pac-input { border: 2px solid #e6e6e6; padding: .5rem; width: 70%; margin-right: .5rem; margin-bottom: 1rem; display: inline-block; } input.help, textarea.help, #country, #regarding, #wantresponse { border: 2px solid #cdcdcd; padding: .5rem; width: 100%; margin-right: .25rem; margin-bottom: 1rem; display: block; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } input.help:focus, textarea.help:focus, #country:focus, #regarding:focus, #wantresponse:focus { border: 2px solid #2261a0; } #wantresponse { width: 20%; } label { color: #000000; font-family: 'OpenSansBold', Arial, sans-serif; font-weight: normal; font-style: normal; margin-bottom: .5rem; display: block; } #csrFeedback { display: none; } .csrTrouble { margin-top: 1rem; border: 1px solid #333333; padding: 1rem; } .csrTrouble p { margin: 0; font-size: 1.3rem; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; } .csrTrouble span { float: right; } .qa { padding: 1.5rem; border: 1px solid #e6e6e6; margin-bottom: 1rem; box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1); } .question { font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; font-size: 1.5rem; margin: 0 0 1rem 0; color: #2261a0; } .answer { border-left: 0px solid #e6e6e6; } .answer p { font-size: 1rem; color: #333333; font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; margin: 0; } .qaIndex input { padding: 1rem; border: 2px solid #2261a0; width: 100%; margin-bottom: 2rem; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .qaIndex input:focus { border-color: #ffcc33; } .qaIndex a { text-decoration: none; } .four-oh-four .notes { color: #777777; font-family: 'OpenSansItalic', Arial, sans-serif; font-weight: normal; font-style: normal; font-size: 0.75rem; margin-bottom: 1rem; display: block; } .four-oh-four .band-block { margin-top: 4.5rem; } .four-oh-four p { font-size: 1rem; color: #333333; font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; } .four-oh-four h1 { line-height: 1.5; } .four-oh-four input { border: 2px solid #2261a0; font-size: 1.1rem; line-height: 1.5; margin: 2rem 2% 2rem 0; padding: 1rem; transition: all 350ms ease-out 0s; width: 75%; } .four-oh-four span.search-404 { background-color: #2261a0; color: #ffffff; display: inline-block; font-family: "OpenSansLight", Arial, sans-serif; font-size: 1.1rem; font-style: normal; font-weight: normal; line-height: 1.5; margin: 0; padding: 1.1rem; text-align: center; transition: all 350ms ease-out 0s; width: 20%; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .four-oh-four span.search-404:hover { background-color: #000000; cursor: pointer; } .yt-video-container { position: relative; padding-bottom: 56.5%; padding-top: 0; height: 0; overflow: hidden; } .yt-video-container iframe, .yt-video-container object, .yt-video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .systembox { top: 150px !important; width: 145px !important; height: 45px !important; -webkit-box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); -moz-box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); position: fixed !important; padding: 5px !important; border: 1px solid black !important; border-left: 0px solid black !important; background-color: yellowgreen !important; z-index: 99999999; } .grid:after { content: ''; display: block; clear: both; } .grid-sizer, .grid-item { width: 19.61%; } .gutter-sizer { width: .5%; } .grid-item { float: left; margin-bottom: .5%; } .grid-item img { display: block; max-width: 100%; min-width: 100%; cursor: pointer; } .featherlight .featherlight-content { padding: 0; border: 0; margin-left: 5%; margin-right: 5%; max-height: 95%; background: transparent; cursor: auto; white-space: normal; } .featherlight .featherlight-close-icon { position: absolute; z-index: 9999; top: 10px; right: 10px; border-radius: 100px; font-weight: bold; font-size: 24px; line-height: 36px; width: 36px; cursor: pointer; text-align: center; font-family: Arial, sans-serif; background: rgba(0, 0, 0, 0.7); color: white; border: 0; padding: 0; } .featherlight .featherlight-close-icon:hover { background: #000000; } .featherlight-next { top: 0; right: 0; left: auto; bottom: 0; width: 100px; background: rgba(0, 0, 0, 0); transition: all 0.2s linear; } .featherlight-previous { top: 0; left: 0; bottom: 0; width: 100px; background: rgba(0, 0, 0, 0); transition: all 0.2s linear; } .featherlight-next:hover, .featherlight-previous:hover { background: rgba(0, 0, 0, 0.5); } .featherlight-previous span { display: none; position: absolute; top: 50%; left: 0; width: 100%; text-align: center; font-size: 70px; line-height: 70px; margin-top: -40px; text-shadow: none; color: #fff; font-style: normal; font-weight: 400; } .featherlight-next span { display: none; position: absolute; top: 50%; left: 0; width: 100%; text-align: center; font-size: 80px; line-height: 80px; margin-top: -40px; text-shadow: none; color: #fff; font-style: normal; font-weight: 400; } img.mediasupport-featured { width: 100%; } .mediasupport-thumb { float: left; width: 100px; margin-right: 20px; display: inline-block; vertical-align: middle; } .mediasupport-thumb img { max-width: 50px; } .mediasupport-filename { vertical-align: middle; float: left; line-height: 1.5; color: #777777; } @media only screen and (max-width: 599px) { .mb-hide { display: none; height: 0; } .mb-block { display: block; width: 100%; margin-bottom: 1rem; } .menuExpander-tablet, .menuExpander-mobile { cursor: pointer; } .menuExpander-tablet img, .menuExpander-mobile img { height: 32px !important; cursor: pointer; margin-top: -2px; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } p.feature { font-size: 1.1rem; } #onthispage { display: none; } .insidePage { padding-left: 1rem; padding-right: 1rem; float: none; display: table; width: 100%; margin-top: .5rem; } .article { display: table-row-group; width: 100%; } .articlePage .summary, .resourcePage .summary { padding-left: 1rem; padding-right: 1rem; } .articlePage .summary h1, .resourcePage .summary h1 { font-size: 1.5rem; } .articlePage .summary p, .resourcePage .summary p { font-size: 1.1rem; } .articlePage .articleFeatImg, .resourcePage .articleFeatImg, .circularPage .articleFeatImg, .componentPage .articleFeatImg { height: 450px; max-height: 450px; } .breadcrumb { padding-left: 1rem; padding-right: 1rem; } #inPageMenu { float: none; width: 100%; display: table-footer-group; } #inPageMenu ul li { line-height: 1; } #inPageMenu ul li a { color: #2261a0; } .articlePage article, .resourcePage article { float: none; width: 100%; } .pageTopNavSmall { background-color: #ffffff; padding: .25rem 1rem; letter-spacing: 0.05em; z-index: 10000; position: fixed; width: 100%; -webkit-box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); -moz-box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); } .pageTopNavSmall img { width: 280px; height: 50px; vertical-align: middle; } .pageTopNavSmall ul { padding: .65rem 0 .5rem 0; list-style: none; margin: 0; display: block; text-align: right; } .pageTopNavSmall ul li { letter-spacing: 0em; color: #000000; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; padding: 0 0 0 1.3rem; font-size: 1.1rem; line-height: 1; display: inline-block; margin: 0; vertical-align: middle; } .pageTopNavSmall ul img { padding: 0 0 0 0; width: auto; } .pageTopNavSmall ul a { color: #000000; text-decoration: none; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .pageTopNavSmall ul a:hover { color: #2261a0 !important; } .pageTopNavSmall ul li { padding: 0 0 0 1.5rem; } .pageTopNavSmall li.menuExpander-tablet, .pageTopNavSmall li.topNavSearch { display: none; } .submenu-mobile { display: block; margin-top: -100vh; position: fixed; width: 100%; background-color: #ffffff; padding: 1rem 1rem; -webkit-box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); -moz-box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); height: 100vh; z-index: 999; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .submenu-mobile a { text-decoration: none; color: #ffffff; } .submenu-mobile .mobileMenu-button { padding: 1rem; background-color: #2261a0; font-size: 1.3rem; text-align: center; color: #ffffff; margin-bottom: .3rem; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .submenu-mobile .mobileMenu-button:hover { background-color: #000000; } .submenu-mobile div.mobile-input { margin-bottom: 2rem; margin-top: 1rem; } .submenu-mobile div.mobile-input input { padding: .3rem .7rem; line-height: 1.3; border: 2px solid #2261a0; border-right: 0px solid #2261a0; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; font-size: 1.3rem; } .submenu-mobile div.mobile-input input:focus { border: 2px solid #2261a0; border-right: 0px solid #2261a0; } .submenu-mobile div.mobile-input button { font-size: 1.3rem; background-color: #2261a0; border: 2px solid #2261a0; color: #ffffff; line-height: 1.4; padding: .8rem .7rem .5rem .7rem; margin: 0; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .submenu-mobile div.mobile-input button:hover { background-color: #000000; border: 2px solid #000000; } .submenu-mobile div.mobile-input button img { width: 24px; height: 24px; } .submenu-mobile.expanded { display: block; margin-top: 54px; } .band-block { padding-left: 1rem; padding-right: 1rem; float: none; } .band, .band-alt { padding: 2rem 0; } .socialRow { padding: .5rem 0; font-size: 85%; } #orgAbout .orgVision { padding: 0 0 1rem 0; } #orgChart .command span, #orgChart .commissioner span, #orgChart .command h3 { font-size: 1.3rem; } #orgChart .commissioner { margin-bottom: 1rem; } .commissioner .grid_4 img { max-width: 350px; } .command .commandName { margin-top: 1.5rem; } .command img { max-width: 350px; } #history .grid_6 { display: block; width: 100%; } #whatStats .grid_4 { width: 100%; display: block; } #whatStats .stats { padding: 0rem 0rem 1rem 0rem; } .subFeatureL { padding-right: 0; } .subFeatureR { padding-left: 0; } .fitPic { width: 100%; } .band h2, .band-alt h2 { font-size: 1.75rem; } .stats span { font-size: 2rem; } .hero { font-size: 1.1rem; } .slats ul { margin: .5rem 0 .5rem 0; } #non-emergency, #emergency { text-align: center; border: 0.5rem solid #e6e6e6; padding: 1rem; margin-bottom: 1rem; } #non-emergency h2, #emergency h2 { font-family: 'OpenSansBold', Arial, sans-serif; font-weight: normal; font-style: normal; font-size: 1.5rem; margin-top: 0; line-height: 1.5; } #non-emergency p.feature, #emergency p.feature { font-size: 1.1rem; margin-top: 0; font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; } .question { font-size: 1.3rem; } footer { width: 100%; padding: 1.5rem 0 0 0; margin: 0; text-align: center; } footer .subfooter { text-align: center; } footer .subfooter .copyright { text-align: center; } .currentInvest { width: 32%; } .currentInvest:nth-of-type(4n+4) { margin-right: 2%; } .currentInvest:nth-of-type(3n+3) { margin-right: 0; } .mobileLogo { width: 45px; } .mobileLogo img { width: 100%; } #mobileHome { display: block; } #aboveFold-mobile { margin: 0 0 0 0; padding: 1px 0 0 0; min-height: 40vh; z-index: -2; } .fader div { background-repeat: no-repeat; background-position: center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; margin: 0; padding: 0; position: absolute; top: 0; left: 0; right: 0; bottom: 60vh; } .fader div.fader1 { background-image: url('../templates/home/images/fader1-phone.jpg'); } .fader div.fader2 { background-image: url('../templates/home/images/fader2-phone.jpg'); } .fader div.fader3 { background-image: url('../templates/home/images/fader3-phone.jpg'); } .fader div.fader4 { background-image: url('../templates/home/images/fader4-phone.jpg'); } .fader div.fader5 { background-image: url('../templates/home/images/fader5-phone.jpg'); } .fader div.fader6 { background-image: url('../templates/home/images/fader6-phone.jpg'); } .fader div.fader7 { background-image: url('../templates/home/images/fader7-phone.jpg'); } ul.homeContact { padding: .75rem 2rem; background-color: #ffcc33; text-align: center; list-style: none; margin: 0; display: block; } ul.homeContact li { -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; letter-spacing: 0.0em; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; text-transform: uppercase; font-size: 1.1rem; line-height: 1.5; padding: 0; display: inline-block; margin: 0; color: #000000; } ul.homeContact li.homepage911 { font-family: 'OpenSansBold', Arial, sans-serif; font-weight: normal; font-style: normal; padding-right: 1rem; } ul.homeContact li a { text-decoration: underline; color: #000000; } #home-nav { display: none !important; } #home-nav.small { display: none !important; } #aboveFold { display: none; } .homepageMission { -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: fadeIn; animation-name: fadeIn; -webkit-animation-delay: 0.5s; animation-delay: 0.5s; -webkit-animation-duration: 1s; /* Chrome, Safari, Opera */ animation-duration: 1s; margin-top: 80px; font-size: 1.6rem; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; letter-spacing: 0rem; color: #ffffff; padding-left: 1rem; line-height: 1.3; } .homepage .showcase { padding: 2rem 2rem; min-height: 200px; width: 100%; display: block; text-align: center; } .homepage .showcase p.feature { font-size: 1.1rem; } .homepage .showcaseImg { width: 100%; display: block; padding: 2rem 0; max-height: 330px; min-height: 230px; } .homepage .showcaseImg.who { background-image: url('../templates/home/images/home-who-tablet.jpg'); } .homepage .showcaseImg.what { background-image: url('../templates/home/images/home-what-tablet.jpg'); } .homepage .showcaseImg.contact { background-image: url('../templates/home/images/home-contact-tablet.jpg'); } .homepage .showcaseImg.careers { background-image: url('../templates/home/images/home-careers-tablet.jpg'); } .homepage .showcaseImg.news { background-image: url('../templates/home/images/home-news-tablet.jpg'); } .homepage .showcaseImg.scam { background-image: url('../templates/home/images/home-scam-tablet.jpg'); } .homepage .showcaseImg.playground { background-image: url('../templates/home/images/home-playground-tablet.jpg'); } .homepage .showcaseImg.violence { background-image: url('../templates/home/images/home-violence-tablet.jpg'); } .homepage .band-alt .showcaseImg { width: 100%; display: block; padding: 2rem 0; } #csrYes, #csrNo { height: auto !important; } #map-canvas { height: 400px; min-height: 400px; } #map { height: 400px !important; } #detachmentMap { height: 350px !important; } #amberContent .band-block { max-width: 100%; padding: 2rem; } #amberContent p { font-size: 1rem; } #pac-input { width: 100% !important; display: block; } .homepageMission { display: none !important; } .four-oh-four .notes { font-size: 0.9rem; } .four-oh-four input { width: 65%; } .four-oh-four span.search-404 { width: 30%; } .homepageNewsBar--featuredstory-content { padding: 2rem 2rem; min-height: 200px; width: 100%; display: block; text-align: center; } .homepageNewsBar--featuredstory-content p.feature { font-size: 1.1rem; } .homepageNewsBar--featuredstory-pic { min-height: 250px !important; } .homepageNewsBar--featuredstory-meta { font-size: 0.9rem; } #homepagePopular-mobile { margin: 0; padding: 1rem 1.5rem; opacity: 1; background-color: #e6e6e6; } #homepagePopular-mobile h2 { font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; font-size: 1.3rem; line-height: 1; padding: 0 0 .6rem 0; display: block; margin: 0 0 .5rem 0; color: #000000; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } #homepagePopular-mobile ul { padding: 0; list-style: none; width: 48.5%; float: left; margin: 0; } #homepagePopular-mobile ul li:before { content: "\00BB\2002"; margin-left: -25px; } #homepagePopular-mobile ul li { padding-left: 25px; } #homepagePopular-mobile ul.bullets-do li:before { content: "\2714\0020"; margin-left: -25px; margin-right: 8px; color: green; } #homepagePopular-mobile ul.bullets-do li { margin-bottom: .6rem; } #homepagePopular-mobile ul.bullets-donot li:before { content: "\2718\0020"; margin-left: -25px; margin-right: 8px; color: red; } #homepagePopular-mobile ul.bullets-donot li { margin-bottom: .6rem; } #homepagePopular-mobile ul a { color: #000000; text-decoration: none; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } #homepagePopular-mobile ul a:hover { color: #000000; } #homepagePopular-mobile ul li { font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; font-size: 1rem; line-height: 1.5; padding: 0 0 0rem 0; display: block; margin: 0 0 0 1rem; color: #777777; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } #homepagePopular-mobile ul.last { width: 48.5%; float: right; } .moreNewsLink { margin-left: 0; float: none; display: block; } .grid-sizer, .grid-item { width: 48%; } .gutter-sizer { width: 2%; } .grid-item { margin-bottom: 2%; } } @media only screen and (max-width: 450px) { html { font-size: 14px; } #aboveFold-mobile { min-height: 40vh; } .summary p { font-size: 1rem; line-height: 1.5rem; } .topicIndex input { font-size: 1rem; width: 73%; } .topicIndex span { font-size: 1rem; width: 25%; } #whatPrograms .grid_7 { display: block; width: 100%; } #whatPrograms .grid_5 { display: none; } #whatInvestigations .grid_7 { display: block; width: 100%; } #whatInvestigations .grid_4 { display: block; width: 100%; padding-top: 1rem; } .currentInvest { width: 49%; } .currentInvest:nth-of-type(4n+4) { margin-right: 2%; } .currentInvest:nth-of-type(3n+3) { margin-right: 2%; } .currentInvest:nth-of-type(2n+2) { margin-right: 0; } .rewardsRow { display: block; width: 100%; } .article h1 { font-size: 1.5rem; line-height: 1.5; } .article h2 { font-size: 1.5rem; line-height: 1.5; } .breadcrumb { line-height: 1.3rem; } .homepage .showcaseImg { max-height: 180px; } } @media only screen and (min-width: 600px) and (max-width: 1279px) { .tb-hide { display: none; height: 0; } .tb-block { display: block; width: 100%; margin-bottom: 1rem; } .menuExpander-tablet, .menuExpander-mobile { cursor: pointer; } .menuExpander-tablet img, .menuExpander-mobile img { height: 32px !important; cursor: pointer; margin-top: -2px; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } p.feature { font-size: 1.1rem; } .insidePage { padding-left: 1rem; padding-right: 1rem; float: none; margin-top: .5rem; } .article { width: 100%; display: table-row-group; } .articlePage .summary, .resourcePage .summary { padding-left: 1rem; padding-right: 1rem; } .articlePage .summary h1, .resourcePage .summary h1 { font-size: 1.5rem; } .articlePage .summary p, .resourcePage .summary p { font-size: 1.1rem; } .articlePage .articleFeatImg, .resourcePage .articleFeatImg, .circularPage .articleFeatImg, .componentPage .articleFeatImg { height: 500px; max-height: 500px; } footer .grid, .subfooter .grid { padding-left: 1rem; padding-right: 1rem; float: none; width: 100%; } .breadcrumb { padding-left: 1rem; padding-right: 1rem; } #inPageMenu { float: none; width: 100%; display: table-footer-group; } #inPageMenu ul li { line-height: 1; } #inPageMenu ul li a { color: #2261a0; } #onthispage { display: none; } .articlePage article, .resourcePage article { float: none; width: 100%; } .pageTopNavSmall ul li { padding: 0 0 0 1.5rem; } .submenu-tablet { display: block; margin-top: -100px; position: fixed; width: 100%; background-color: #ffffff; padding: .5rem 2rem; -webkit-box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); -moz-box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.4); height: 60px; z-index: 999; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .submenu-tablet ul { padding: .65rem 0 .5rem 0; list-style: none; margin: 0; display: block; float: right; } .submenu-tablet ul li { color: #000000; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; padding: .3rem 0 0 1rem; font-size: 1; line-height: 1; display: inline-block; margin: 0; } .submenu-tablet ul a { color: #000000; text-decoration: none; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .submenu-tablet ul a:hover { color: #2261a0; } .submenu-tablet.expanded { display: block; margin-top: 54px; } .band-block { padding-left: 1rem; padding-right: 1rem; float: none; } .band, .band-alt { padding: 2rem 0; } #orgAbout .orgVision { padding-left: 1.5rem; } #orgChart .command span, #orgChart .commissioner span, #orgChart .command h3 { font-size: 1.2rem; } .band h2, .band-alt h2 { font-size: 1.75rem; } .stats span { font-size: 2rem; } .hero { font-size: 1.1rem; } .homepage .showcase { padding: 2rem 2rem; min-height: 200px; } .homepage .showcase h2 { line-height: 1.3; } .homepage .showcase p.feature { font-size: 1.1rem; } .homepage .showcaseImg { padding: 2rem 0; } .homepage .showcaseImg.who { background-image: url('../templates/home/images/home-who-tablet.jpg'); } .homepage .showcaseImg.what { background-image: url('../templates/home/images/home-what-tablet.jpg'); } .homepage .showcaseImg.contact { background-image: url('../templates/home/images/home-contact-tablet.jpg'); } .homepage .showcaseImg.careers { background-image: url('../templates/home/images/home-careers-tablet.jpg'); } .homepage .showcaseImg.news { background-image: url('../templates/home/images/home-news-tablet.jpg'); } .homepage .showcaseImg.scam { background-image: url('../templates/home/images/home-scam-tablet.jpg'); } .homepage .showcaseImg.playground { background-image: url('../templates/home/images/home-playground-tablet.jpg'); } .homepage .showcaseImg.violence { background-image: url('../templates/home/images/home-violence-tablet.jpg'); } .homepage .band-alt .showcaseImg { padding: 2rem 0; } .slats ul { margin: .5rem 0 .5rem 0; } #non-emergency, #emergency { text-align: center; border: 0.5rem solid #e6e6e6; padding: 1rem; } #non-emergency h2, #emergency h2 { font-family: 'OpenSansBold', Arial, sans-serif; font-weight: normal; font-style: normal; font-size: 1.5rem; margin-top: 0; line-height: 1.5; } #non-emergency p.feature, #emergency p.feature { font-size: 1.1rem; margin-top: 0; font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; } .question { font-size: 1.3rem; } footer { width: 100%; padding: 1.5rem 0 0 0; margin: 0; } footer .bigBlock { width: 100%; margin-bottom: 2rem; } footer .bigBlock h2 { display: none; } footer .bigBlock b { color: #ffcc33; font-size: 1.3rem; } footer .bigBlock ul { display: block; float: right; width: 23.5%; } footer .bigBlock .contact { float: left; width: 70%; text-align: left; } footer .bigBlock p { margin: 0; } footer .smallBlock { display: inline-block; width: 23.5%; vertical-align: top; margin-right: 2%; } footer .smallBlock.last { margin-right: 0; } #home-nav img { width: auto; vertical-align: middle; } #home-nav img.mainLogo { height: 60px; } #home-nav ul { list-style: none; max-width: 50%; } #home-nav ul li { letter-spacing: 0.03em; font-size: 1.2rem; line-height: 1; padding: 0; display: block; text-align: right; } #home-nav ul li.homepageTollFree { font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; text-align: right; line-height: 1.5; font-size: 1.1rem; } #home-nav ul li.homepageTollFree span { font-size: 1rem; } #home-nav ul li.homepage911 { text-align: right; line-height: 1.5; margin-top: 2rem; } #home-nav ul li.homepage911 span { font-size: 1rem; } #home-nav ul li.homepageOnlineReporting { text-align: right; line-height: 1.5; padding-bottom: .5rem; } #home-nav ul li.homepageOnlineReporting a { color: #ffcc33; } #home-nav ul li.homepageOnlineReporting span { font-size: 1rem; } #home-nav.small { -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } #home-nav.small img { width: auto; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } #home-nav.small ul { padding: .65rem 0 .5rem 0; } #home-nav.small ul li { padding: 0 0 0 1.9rem; font-size: 1.1rem; } #home-nav.small ul li.homepageTollFree, #home-nav.small ul li.homepage911 { display: none; } #home-nav.small #languageToggle { margin-top: 0; } .homepageCore { width: 40.5%; min-width: 400px; } .homepageCore .homepageMission { font-size: 1.7rem; font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; letter-spacing: 0.03rem; } .homepageCore #homepageSearch { margin: 1rem 0 0 0; } .homepageCore #homepageSearch .searchButton img { opacity: 1; width: 2rem; height: 2rem; } .homepageCore #homepageSearch .clearButton img { opacity: 1; width: 2rem; height: 2rem; } .homepageCore #homepageSearch input { margin: 0; padding: .75rem; font-size: 1.15rem; } .homepageCore #homepagePopular { -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: fadeIn; animation-name: fadeIn; -webkit-animation-delay: 1.5s; animation-delay: 1.5s; -webkit-animation-duration: 1s; /* Chrome, Safari, Opera */ animation-duration: 1s; margin: 1.5rem 0 0 0; padding: 1rem; opacity: 0; background-color: rgba(0, 0, 0, 0.9); } .homepageCore #homepagePopular h2 { font-family: 'OpenSansLight', Arial, sans-serif; font-weight: normal; font-style: normal; font-size: 1.3rem; line-height: 1; padding: 0 0 .5rem 0; display: block; margin: 0 0 0 0; color: #ffcc33; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .homepageCore #homepagePopular ul { padding: 0; list-style: none; width: 48.5%; float: left; margin: 0; } .homepageCore #homepagePopular ul li:before { content: "\00BB\2002"; margin-left: -25px; } .homepageCore #homepagePopular ul li { padding-left: 25px; } .homepageCore #homepagePopular ul.bullets-do li:before { content: "\2714\0020"; margin-left: -25px; margin-right: 8px; color: green; } .homepageCore #homepagePopular ul.bullets-do li { margin-bottom: .6rem; } .homepageCore #homepagePopular ul.bullets-donot li:before { content: "\2718\0020"; margin-left: -25px; margin-right: 8px; color: red; } .homepageCore #homepagePopular ul.bullets-donot li { margin-bottom: .6rem; } .homepageCore #homepagePopular ul a { color: #ffffff; text-decoration: none; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .homepageCore #homepagePopular ul a:hover { color: #ffcc33; } .homepageCore #homepagePopular ul li { font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; font-size: 1rem; line-height: 1.4; padding: 0 0 0 .5rem; display: block; margin: 0 0 0 1rem; color: #ffcc33; -webkit-transition: all 350ms ease-out; -moz-transition: all 350ms ease-out; -o-transition: all 350ms ease-out; transition: all 350ms ease-out; } .homepageCore #homepagePopular ul.last { width: 48.5%; float: right; } #searchResults ul { margin: 0; } #searchResults h3 { font-size: 1rem; font-family: 'OpenSans', Arial, sans-serif; font-weight: normal; font-style: normal; margin-bottom: 0.3rem; } #homepageScroll { padding: 2rem 0 1rem 2rem; } .currentInvest { width: 32%; } .currentInvest:nth-of-type(4n+4) { margin-right: 2%; } .currentInvest:nth-of-type(3n+3) { margin-right: 0; } .socialRow { padding: .5rem 0; font-size: 85%; } .sidebarPhoto figure img, .downloadBlock { max-width: 400px; } #map-canvas { height: 400px; min-height: 400px; } #amberContent .band-block { max-width: 100%; padding: 2rem; } .grid-sizer, .grid-item { width: 32.5%; } .gutter-sizer { width: 1%; } .grid-item { margin-bottom: 1%; } .homepageNewsBar--featuredstory { min-height: 200px; } .homepageNewsBar--featuredstory-pic { min-height: 200px; } .homepageNewsBar--featuredstory-meta { font-size: 0.9rem; } .homepageNewsBar--featuredstory-content { color: #000000; padding: 2rem; } .homepageNewsBar--featuredstory-content h2 { font-size: 1.75rem; padding: 1rem 0 .5rem 0; } .homepageNewsBar--featuredstory-content p { margin-top: 0; } }