/*!
 * ==============================================
 * LEXUS STYLING - SAFETY TECHNOLOGY (BRAND PAGE)
 * by Convertium Pte Ltd [AKH]
 * ==============================================
 */
/*** FRAMEWORK ***/
@media only screen and (min-width: 992px) { .generic-valign-center > div:first-child { width: 100%; } }

.safety-title { width: 100%; max-width: 1080px; margin: 0 auto; padding: 0 !important; }
.safety-title > .row { padding-bottom: 0; }
.safety-title h1 { letter-spacing: 1rem; line-height: 4rem; text-shadow: 0 0 60px black; }
.safety-title h1, .safety-title h1 > small { opacity: 0; -webkit-transform: translateY(40px); transform: translateY(40px); -webkit-transition: opacity 1.5s, -webkit-transform 1s; transition: opacity 1.5s, transform 1s; }
.safety-title h1 > small { letter-spacing: 1.1rem; display: inline-block; }
@media only screen and (max-width: 736px) { .safety-title { height: inherit; }
  .safety-title h1 { -webkit-transform: translateY(40px) scale(0.5, 0.5); transform: translateY(40px) scale(0.5, 0.5); -webkit-transform-origin: 0% 100%; transform-origin: 0% 100%; } }

.animated-title.animated .safety-title h1, .animated-title.animated .safety-title h1 > small { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); }
@media only screen and (max-width: 736px) { .animated-title.animated .safety-title h1 { -webkit-transform: translateY(0) scale(0.5, 0.5); transform: translateY(0) scale(0.5, 0.5); } }

.generic-introduction.no-fullwidth.safety-introduction { background-color: #1b529d; background-position: center bottom; padding-bottom: 32.5%; }
@media only screen and (max-width: 736px) { .generic-introduction.no-fullwidth.safety-introduction { padding-bottom: 32.5% !important; } }

#the-science-of-safety { background-size: cover; }
#the-science-of-safety > .row { padding: 2.4rem 0; }
@media only screen and (max-width: 736px) { #the-science-of-safety { padding: .75rem; } }

@-webkit-keyframes stopping { 0% { -webkit-transform: rotate(0deg) scale(1, 1); }
  90% { -webkit-transform: rotate(10deg) scale(0.9, 1.2); }
  100% { -webkit-transform: rotate(0deg) scale(1, 1); } }
@keyframes stopping { 0% { transform: rotate(0deg) scale(1, 1); }
  90% { transform: rotate(10deg) scale(0.9, 1.2); }
  100% { transform: rotate(0deg) scale(1, 1); } }
@-webkit-keyframes windblow { 0%, 50% { -webkit-transform: skewX(0deg); }
  90% { -webkit-transform: skewX(-15deg); }
  94% { -webkit-transform: skewX(10deg); }
  98% { -webkit-transform: skewX(-5deg); }
  100% { -webkit-transform: skewX(0deg); } }
@keyframes windblow { 0%, 50% { transform: skewX(0deg); }
  90% { transform: skewX(-15deg); }
  94% { transform: skewX(10deg); }
  98% { transform: skewX(-5deg); }
  100% { transform: skewX(0deg); } }
@-webkit-keyframes blink-1 {
    0%,
    50%,
    100% { opacity: 1; }
    25%,
    75% { opacity: 0; }
  }
  @keyframes blink-1 {
    0%,
    50%,
    100% { opacity: 1; }
    25%,
    75% { opacity: 0; }}
.safety-situation .icon-tile { text-align: center; background: white; }
.safety-situation .icon-tile .tile-img { border-bottom: 3px solid #292929; }
.safety-situation .icon-tile .tile-content { padding: 1rem 0; }
.safety-situation .icon-img { display: inline-block; }
.safety-situation .icon-img > img { width: auto; }
.safety-situation hr.dashed { background: none; border-top: 1px dashed #292929; }
.safety-situation > .row + .row { margin-top: 1.75rem; }
.safety-situation .situation-right .tile + .row { margin-top: 2rem; }
.safety-situation .situation-col { position: relative; }
.safety-situation .situation-col .tile-img { max-width: 300px; height: 88px; margin-right: auto; margin-left: auto; position: relative; overflow: hidden; }
.safety-situation .situation-col .tile-img .icon-img, .safety-situation .situation-col .tile-img .icon-moon, .safety-situation .situation-col .tile-img .icon-star { margin-left: 0; position: absolute; bottom: 0; left: 0; }
.safety-situation .situation-start .situation-col .icon-img, .safety-situation .situation-on-road .situation-col .icon-img { -webkit-transition: margin 1s; transition: margin 1s; }
.safety-situation .situation-start .situation-col .icon-img:first-child { margin-left: 0; }
.safety-situation .situation-start.animated .situation-col .icon-img:last-child { margin-left: 80px; }
.safety-situation .situation-night .situation-col .icon-img, .safety-situation .situation-night .situation-col .icon-moon, .safety-situation .situation-night .situation-col .icon-star { -webkit-transition: -webkit-transform 1s; transition: transform 1s; }
.safety-situation .situation-night .situation-col .icon-img { -webkit-transition: margin 1s; transition: margin 1s; }
.safety-situation .situation-night .situation-col .icon-star, .safety-situation .situation-night .situation-col .icon-moon { top: 0; -webkit-transform: translateX(0); transform: translateX(0); -webkit-transition: -webkit-transform 1s; transition: transform 1s; }
.safety-situation .situation-night .situation-col .icon-moon { margin-left: 245px; -webkit-transition: margin 1s; transition: margin 1s; }
.safety-situation .situation-night .situation-col .icon-star:nth-child(1) { top: 20px; margin-left: 20px; -webkit-transition: margin 1s; transition: margin 1s; }
.safety-situation .situation-night .situation-col .icon-star:nth-child(2) { margin-left: 60px; top: 18px; -webkit-transition: margin 1s; transition: margin 1s; }
.safety-situation .situation-night .situation-col .icon-star:nth-child(3) { top: 10px; margin-left: 105px; -webkit-transition: margin 1s; transition: margin 1s; }
.safety-situation .situation-night .situation-col .icon-star:nth-child(4) { top: 20px; margin-left: 150px; -webkit-transition: margin 1s; transition: margin 1s; }
.safety-situation .situation-night .situation-col .icon-star:nth-child(5) { top: 10px; margin-left: 200px; -webkit-transition: margin 1s; transition: margin 1s; }
.safety-situation .situation-night .situation-col .icon-star:nth-child(6) { top: 15px; margin-left: 235px; -webkit-transition: margin 1s; transition: margin 1s; }
.safety-situation .situation-night .situation-col .icon-star:nth-child(7) { top: 10px; margin-left: 280px; -webkit-transition: margin 1s; transition: margin 1s; }
.safety-situation .situation-night .situation-col .icon-star:nth-child(8) { top: 12px; margin-left: 310px; -webkit-transition: margin 1s; transition: margin 1s; }
.safety-situation .situation-night .situation-col .icon-star:nth-child(9) { top: 8px; margin-left: 355px; -webkit-transition: margin 1s; transition: margin 1s; }
.safety-situation .situation-night .situation-col .icon-star:nth-child(10) { top: 5px; margin-left: 400px; -webkit-transition: margin 1s; transition: margin 1s; }
.safety-situation .situation-night.animated .situation-col .icon-moon { margin-left: 60px; }
.safety-situation .situation-night.animated .situation-col .icon-star:nth-child(1) { margin-left: -190px; }
.safety-situation .situation-night.animated .situation-col .icon-star:nth-child(2) { margin-left: -170px; }
.safety-situation .situation-night.animated .situation-col .icon-star:nth-child(3) { margin-left: -105px; }
.safety-situation .situation-night.animated .situation-col .icon-star:nth-child(4) { margin-left: -40px; }
.safety-situation .situation-night.animated .situation-col .icon-star:nth-child(5) { margin-left: 25px; }
.safety-situation .situation-night.animated .situation-col .icon-star:nth-child(6) { margin-left: 90px; }
.safety-situation .situation-night.animated .situation-col .icon-star:nth-child(7) { margin-left: 150px; }
.safety-situation .situation-night.animated .situation-col .icon-star:nth-child(8) { margin-left: 210px; }
.safety-situation .situation-night.animated .situation-col .icon-star:nth-child(9) { margin-left: 255px; }
.safety-situation .situation-night.animated .situation-col .icon-star:nth-child(10) { margin-left: 290px; }
.safety-situation .situation-night.animated .situation-col .icon-star:nth-child(5) { -webkit-animation: blink-1 0.8s 1s both; animation: blink-1 0.8s 1s both; }
.safety-situation .situation-night.animated .situation-col .icon-star:nth-child(7) { -webkit-animation: blink-1 1.5s 1s both; animation: blink-1 1.5s 1s both; }
.safety-situation .situation-night.animated .situation-col .icon-star:nth-child(10) { -webkit-animation: blink-1 1.2s 1s both; animation: blink-1 1.2s 1s both; }
.safety-situation .situation-night.animated .situation-col .icon-star, .safety-situation .situation-night.animated .situation-col .icon-moon { -webkit-transform: translateX(0); transform: translateX(0); }
.safety-situation .situation-night.animated .situation-col .icon-img { margin-left: 115px; }
.safety-situation .situation-on-road .situation-col .icon-img:nth-child(1), .safety-situation .situation-on-road .situation-col .icon-img:nth-child(2), .safety-situation .situation-on-road .situation-col .icon-img:nth-child(4) { -webkit-transform: translateX(300px); transform: translateX(300px); -webkit-transition: -webkit-transform 1s; transition: transform 1s; right: 0; left: auto; }
.safety-situation .situation-on-road .situation-col .icon-img:nth-child(1) { margin-right: 15px; }
.safety-situation .situation-on-road .situation-col .icon-img:nth-child(2) { margin-right: 45px; }
.safety-situation .situation-on-road .situation-col .icon-img:nth-child(4) { margin-right: 265px; }
.safety-situation .situation-on-road.animated .situation-col .icon-img:nth-child(1), .safety-situation .situation-on-road.animated .situation-col .icon-img:nth-child(2), .safety-situation .situation-on-road.animated .situation-col .icon-img:nth-child(4) { -webkit-transform: translateX(0); transform: translateX(0); }
.safety-situation .situation-on-road.animated .situation-col .icon-img:nth-child(3) { margin-left: 115px; }
.safety-situation .situation-collision .situation-col .icon-img { -webkit-transition: margin 1s cubic-bezier(0.18, 0.89, 0.32, 1.28), -webkit-animation 0.5s; transition: margin 1s cubic-bezier(0.18, 0.89, 0.32, 1.28), animation 0.5s; }
.safety-situation .situation-collision .situation-col .icon-img:last-child { -webkit-transition-delay: 1s; transition-delay: 1s; margin-left: 215px; }
.safety-situation .situation-collision.animated .situation-col .icon-img { -webkit-animation-duration: 1s; -webkit-animation-name: stopping; animation-duration: 1s; animation-name: stopping; }
.safety-situation .situation-collision.animated .situation-col .icon-img:first-child { margin-left: 115px; }
.safety-situation .situation-destination .situation-col .icon-img { -webkit-transition: margin 1s cubic-bezier(0, 0, 0.2, 1), -webkit-animation 1s; transition: margin 1s cubic-bezier(0, 0, 0.2, 1), animation 1s; }
.safety-situation .situation-destination .situation-col .icon-img:first-child { -webkit-transition-delay: 1s; transition-delay: 1s; margin-left: 145px; }
.safety-situation .situation-destination.animated .situation-col .icon-img:first-child { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-name: windblow; animation-name: windblow; -webkit-transform-origin: left bottom; transform-origin: left bottom; }
.safety-situation .situation-destination.animated .situation-col .icon-img:last-child { margin-left: 185px; }
@media only screen and (min-width: 737px) { .safety-situation .situation > .animated { opacity: 1; -webkit-animation: none; animation: none; }
  .safety-situation .situation-col:not(.situation-last):before { width: 1px; height: 100%; content: ""; background: -webkit-linear-gradient(black 0%, rgba(0, 0, 0, 0) 100%); background: linear-gradient(black 0%, rgba(0, 0, 0, 0) 100%); position: absolute; top: 0; left: 50%; display: block; }
  .safety-situation .situation-right .tile + .row .tile .tile-content h3 { margin-top: 0; } }
@media only screen and (min-width: 993px) { .safety-situation .situation-col { padding-right: 10%; }
  .safety-situation .situation-col:not(.situation-last):before { left: 40%; } }

/*** TYPOGRAPHY ***/
.safety-situation .icon-tile h3 { font-weight: 300; }

.safety-title h1 { font-size: 6.3rem; }

.safety-title h1 > small { font-size: 2.2rem; }

@media only screen and (max-width: 736px) { .masthead.blp h3 { font-size: 1.6rem; }
  .masthead.blp .p-lead { font-size: 1.1rem; } }
@media only screen and (min-width: 737px) { .masthead.blp h3 { font-size: 2rem; }
  .filter-blp, .filter-blp [type="radio"] + label { font-size: .75rem; } }
@media only screen and (min-width: 737px) and (orientation: portrait) { .blp-quote .p-lead { font-size: 1rem; } }

/*# sourceMappingURL=safety.css.map */