
@font-face {
    font-family: 'infinity';
    src: url('../fonts/infinitibrandregular.woff2') format('woff2'),
         url('../fonts/infinitibrandregular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'roboto-light';
    src: url('../fonts/roboto/roboto-light-webfont.woff2') format('woff2'),
         url('../fonts/roboto/roboto-light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'roboto-bold';
    src: url('../fonts/roboto/roboto-bold-webfont.woff2') format('woff2'),
         url('../fonts/roboto/roboto-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

body {
	font-family: 'infinity';
	background-color: #FFFFFF;
	color: #58595b;
}

.bolder {
	font-weight: bolder;
}

.line-30 {
	line-height: 30px;
}

.roboto-regular {
	font-family: 'roboto-regular';
}

.roboto-light {
	font-family: 'roboto-light';
}

.roboto-bold {
	font-family: 'roboto-bold';
}

#wrapper {
    width: 100vw;
    background-color: #FFFFFF;
    overflow-x: hidden;
}

#header {
    position: relative;
    width: 100vw;
}

.blue-bg {
	background-color: #10216c!important;
}

.blue-bg:hover {
	background-color: #1767bd!important;
}

.text-decoration-underline {
	text-decoration: underline;
}

#content {
    position: relative;
    overflow: hidden;
    background-color: #e6e7e8;
    width: 100vw;
}

.parallax-window {
    min-height: 500px;
    background: transparent;
}

#address {
	font-size: 14px;
	color: #FFFFFF;
}

#phone {
	color: #FFFFFF;
}

#phone span {
	background-color: #ba021e;
	color: #FFFFFF;
	border-radius: 4px;
	padding: 5px;
	font-size: 1.5rem;
}

#phone span a {
	color: #FFFFFF;
}

#address a {
	color: #FFFFFF;
}

#getInTouch li a {
	color: #FFFFFF;
}

.dark {
	color: #FFFFFF;
}

.rl {
    color: #FFFFFF;
    letter-spacing: -3px;
}

#buldingSite {
	text-transform: uppercase;
	font-weight: bold;
	position: absolute;
    top: 30px;
    margin-left: auto;
	margin-right: auto;
	left: 0;
	right: 0;
    letter-spacing: 4px;
}

.relative {
	position: relative !important;
}

.t0 {
	top: 0 !important;
}

.f-20 {
	font-size: 26px;
}

.f-12 {
	font-size: 12px;
}

.inicio {
	padding: 20px;
	font-family: 'roboto-light'
}

.color-principal {
	color: #00833c;
}

.color-principalbg {
	background-color: #00833c;
}

.bg-white {
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+39,ffffff+42,212b4f+42 */
	background: rgb(255,255,255); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(255,255,255,1) 39%, rgba(255,255,255,1) 42%, rgba(33,43,79,1) 42%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 39%,rgba(255,255,255,1) 42%,rgba(33,43,79,1) 42%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(255,255,255,1) 39%,rgba(255,255,255,1) 42%,rgba(33,43,79,1) 42%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#212b4f',GradientType=0 ); /* IE6-9 */
	padding: 3rem;
}

.bg-grey {
	background-color: #f3f3f3;
	padding: 3rem;
}

.color-bienesraices {
	color: #212b4f;
}

.mt-n30 {
	margin-top: -30px;
}

.text-black {
	color: #000000;
}

.card-header {
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#10216c+48,236dbc+88,005cbf+100 */
	background: rgb(16,33,108); /* Old browsers */
	background: -moz-linear-gradient(45deg,  rgba(16,33,108,1) 48%, rgba(35,109,188,1) 88%, rgba(0,92,191,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(45deg,  rgba(16,33,108,1) 48%,rgba(35,109,188,1) 88%,rgba(0,92,191,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(45deg,  rgba(16,33,108,1) 48%,rgba(35,109,188,1) 88%,rgba(0,92,191,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#10216c', endColorstr='#005cbf',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	color: #FFFFFF;
	font-family: 'roboto-bold';
	font-size: 25px;
	border-radius: 10px 10px 0px 0px!important; 
}

.card-text {
	font-size: 12px;
	color: #000000;
	font-family: 'roboto-regular';
	min-height: 90px;
}

.card {
	border-radius: 10px 10px 0px 0px!important;
    -webkit-box-shadow: 0 1px 4px rgb(0 0 0 / 30%), 0 0 40px rgb(0 0 0 / 10%) inset;
    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    box-shadow: 0 1px 4px rgb(0 0 0 / 30%), 0 0 40px rgb(0 0 0 / 10%) inset;
}

.card-title {
    margin-bottom: .75rem;
    color: #001f3e;
}

.icon-down-header {
	font-size: 25px;
    margin-top: -10px;
    color: #001f3e;
}

.borde-medida {
	border: solid 1px #00833c;
    padding: 10px;
    display: inline-block;
}

.uso {
	background-color: #e5e7e8;
    padding: 10px;
    margin-bottom: 15px;
}

.uso h3 {
	font-size: 15px;
	color: #00833c;
}

.uso p {
	font-size: 13px;
	color: #10216c;
	margin-bottom: 0px;
}

.btn-mapa {
	background-color: #00833c;
	color: #ffffff;
	border-radius: 10px;
	width: 100%;
}

.btn-mapa:hover {
	background-color: #1767BD;
	color: #ffffff;
}

.form-control {
	border-radius: 5px;
}

.btn-form {
	background-color: #00833c;
    color: #ffffff;
    border-radius: 10px;
    width: 40%;
    float: right;
}

.bg-footer1 {
	background-color: #3e509a;
	padding: 0 50px;
}

.bg-footer2 {
	background-color: #3e509a;
}

.n-radius {
	border-radius: 0!important;
}

.img-header {
	margin-top: 15px;
}

.padding-col-footer {
	padding: 50px 0;
}

.header-bg {
	background-image: url('../img/bienes-raices-portada.jpg');
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	padding: 55px 0 50px;
}

.title-box {
	background-color: #10216c;
	align-items: center;
	text-align: center;
	padding: 20px;
	margin-top: -5px;
}

.copy {
	background-color: #00833c;
	padding: 20px;
}

.copy .fab {
	color: #ffffff;
	font-size: 20px;
	margin-right: 10px;
}

.copy .fab:hover {
	color: #10216c;
}

.copy a {
	color: #ffffff;
}

.copy a:hover {
	color: #10216c;
	text-decoration: none;
}

.copy2 {
    background-color: #00833c;
    padding: 8px;
}

.copy2 .fab {
	color: #ffffff;
	font-size: 20px;
	margin-right: 10px;
}

.copy2 .fab:hover {
	color: #10216c;
}

.copy2 a {
	color: #ffffff;
}

.copy2 a:hover {
	color: #10216c;
	text-decoration: none;
}

.coinversionistas {
	background-color: #10216c;
    color: #ffffff;
    padding: 15px 35px;
    font-size: 33px;
}

.video-fluid {
  width: 100%;
  height: auto;
  margin-top: 70px;
}

.swiper {
  width: auto;
  min-width: 300px;
  height: auto;
}

.swiper-slide-img {
  height: auto;
  width: 100%;
  border: 10px solid #E6E7E8; /* move next and prev buttons off img */
  min-height: 353px;
}

.swiper-slide-img:hover {
  cursor: pointer;
}

.gallery-thumbs .swiper-slide img:hover,
.swiper-slide img:hover {
  cursor: pointer;
}

.swiper-pagination {
  background-color: #d8d8d8;
  padding: 10px;
}

.swiper-button-prev {
  position: absolute;
  transform: translateX(-40%);
  color: white;
}

.swiper-button-prev:focus {
  outline: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.swiper-button-next {
  position: absolute;
  transform: translateX(40%);
  color: white;
  font-weight: 900;
}

.swiper-button-next:focus {
  outline: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.swiper-pagination {
  background: linear-gradient(to bottom right, #c2c2f0, #8585e0);
  border-radius: 10px;
}

/*active pagination*/
.swiper-pagination .swiper-pagination-bullet-active {
  background-color: rgb(255, 255, 255);
}

/*other pagination*/
.swiper-pagination .swiper-pagination-bullet {
  height: 15px;
  width: 15px;
}

.swiper-pagination .swiper-pagination-bullet:hover {
  transform: scale(1.2);
  transition: all 0.5s;
}

.swiper-pagination .swiper-pagination-bullet:focus {
  outline: none;
  background-color: rgb(255, 255, 255);
  -webkit-tap-highlight-color: rgb(248, 248, 248);
}

/* ................................................ thumbs .......................................................... */

.gallery-thumbs {
  padding: 0;
  margin-top: 0;
  margin-bottom: 40px;
}

.gallery-thumbs .swiper-slide {
  width: 25%;
  opacity: 0.8;
}

.gallery-thumbs .swiper-slide-thumb-active {
  opacity: 1;
}

.gallery-thumbs .swiper-slide img {
  width: 100%;
  height: 70px;
  min-height: 40px;
  object-fit: cover;
}

/* ................................................ modal .......................................................... */
.modal {
  display: none;
  position: fixed;
  z-index: 2;
  left: 0;
  top: 0;
  height: 100vh;
  width: 100vw;
}

.modal-content {
  background-color: rgb(0, 0, 0);
  padding: 0;
  height: 100%;
  width: 100%;
  min-width: 300px;
  animation-name: modalOpen;
  animation-duration: 1s;
}

.closeBtn {
  position: absolute; /* removed from normal flow of doc, positioned relative to its nearest ancestor (modal content)*/
  z-index: 4;
  color: white;
  right: 5px;
  font-size: 30px;
}

.closeBtn:hover,
.closeBtn:focus {
  color: rgb(114, 114, 114);
  text-decoration: none;
  cursor: pointer;
}

@keyframes modalOpen {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* ............................................. modal swiper gallery ....................................................... */
/* used ids higher specificity to override gallery styles */

#swiper-container-modal {
  z-index: 3;
  width: 100%;
  height: 100%;
  overflow: hidden;
  padding: 0;
  border: 0;
}

#swiper-pagination-modal {
  display: none; /* if pagination not included in modal... index.html pagination buttons dnt change (black for active slide)*/
}

#swiper-button-next-modal {
  transform: translateX(-40%);
  color: white;
}

#swiper-button-prev-modal {
  transform: translateX(40%);
  color: white;
}

.swiper-slide-modal {
  height: 100vh;
}

.swiper-lazy-modal {
  object-fit: contain;
  border: 0;
}

.swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction {
  display: none;
}

.navbar-brand {
    margin-right: auto;
    margin-left: auto;
}

.formulario-header {
	background-color: #212b4fdb;
  border-radius: 10px;
}


/* ............................................. responsiveness ....................................................... */
@media all and (max-width: 520px) {
  .swiper {
    width: calc(100vw - 20px);
  }

  .swiper-button-next:after {
    font-size: 20px !important;
    transform: translateX(60%);
  }

  .swiper-button-prev:after {
    font-size: 20px !important;
    transform: translateX(-60%);
  }

  #swiper-button-next-modal {
    font-size: 20px !important;
    transform: translateX(20%);
  }

  #swiper-button-prev-modal {
    font-size: 20px !important;
    transform: translateX(-20%);
  }

  .swiper-pagination {
    padding: 4px;
  }

  .swiper-slide-img {
    width: calc(100vw-32px);
    height: auto;
    border: 16px solid #d8d8d8; /* move next and prev buttons off img */
    min-height: calc((0.5338 * 100vw) + 48.476px);
  }

  .swiper-pagination .swiper-pagination-bullet {
    height: 12px;
    width: 12px;
  }

  .gallery-thumbs .swiper-slide img {
    height: 14vw;
  }
}

@media all and (max-width: 360px) {
  .swiper-slide-img {
    border: 1px solid #d8d8d8;
  }
}

@media (min-width: 2301px){
	#content {
		margin-top: -135px;
	}
	.content-wrap {
		padding-top: 80px;
	}
	.parallax-slider {
		transform: translate3d(0px, -40px, 0px) !important;
	}
	.parallax-window {
	    min-height: 680px;
	}
	.animation-target {
	  -webkit-animation: animation 401000ms linear both;
	  animation: animation 401000ms linear both;
	}
	.copy2 {
    margin-top: 45px!important;
	}
}

@media (min-width: 2200px) and (max-width: 2300px){
	#content {
		margin-top: -140px;
	}
	.content-wrap {
		padding-top: 80px;
	}
	.parallax-slider {
		transform: translate3d(0px, -40px, 0px) !important;
	}
	.parallax-window {
	    min-height: 625px;
	}
	.animation-target {
	  -webkit-animation: animation 401000ms linear both;
	  animation: animation 401000ms linear both;
	}

	.copy2 {
    margin-top: 45px!important;
	}
}

@media (min-width: 2100px) and (max-width: 2199px){
	#content {
		margin-top: -100px;
	}
	.content-wrap {
		padding-top: 80px;
	}
	.parallax-slider {
		transform: translate3d(0px, -30px, 0px) !important;
	}
	.parallax-window {
	    min-height: 560px;
	}
	.animation-target {
	  -webkit-animation: animation 401000ms linear both;
	  animation: animation 401000ms linear both;
	}
	.copy2 {
    margin-top: 10px!important;
	}
}

@media (max-width: 2099px) and (min-width: 1920px){
	#content {
		margin-top: -105px;
	}
	.content-wrap {
		padding-top: 80px;
	}
	.animation-target {
	  -webkit-animation: animation 401000ms linear both;
	  animation: animation 401000ms linear both;
	}
	.parallax-slider {
		transform: translate3d(0px, -20px, 0px) !important;
	}
	.parallax-window {
	    min-height: 560px;
	}
}

@media (max-width: 1919px) and (min-width: 1825px){
	#content {
		margin-top: -120px;
	}
	.content-wrap {
		padding-top: 80px;
	}
	.animation-target {
	  -webkit-animation: animation 401000ms linear both;
	  animation: animation 401000ms linear both;
	}
}

@media (max-width: 1824px) and (min-width: 1700px){
	#content {
		margin-top: -120px;
	}
	.content-wrap {
		padding-top: 80px;
	}
	.animation-target {
	  -webkit-animation: animation 401000ms linear both;
	  animation: animation 401000ms linear both;
	}
}

@media (max-width: 1699px) and (min-width: 1600px){
	#content {
		margin-top: -125px;
	}
	.content-wrap {
		padding-top: 85px;
	}
	.animation-target {
	  -webkit-animation: animation 401000ms linear both;
	  animation: animation 401000ms linear both;
	}
}

@media (max-width: 1599px) and (min-width: 1440px){
	#content {
		margin-top: -130px;
	}
	.content-wrap {
		padding-top: 80px;
	}
	.animation-target {
	  -webkit-animation: animation 401000ms linear both;
	  animation: animation 401000ms linear both;
	}

	.copy2 {
    margin-top: 40px!important;
	}
}

@media (max-width: 1439px) and (min-width: 992px){
	#content {
		margin-top: -130px;
	}
	.content-wrap {
		padding-top: 80px;
	}
	.animation-target {
	  -webkit-animation: animation 401000ms linear both;
	  animation: animation 401000ms linear both;
	}
	.img-header {
	margin-top: 50px;
	}

	.copy2 {
    margin-top: 40px!important;
	}
}

@media (max-width: 991px) and (min-width: 768px){
	#content {
		margin-top: -130px;
	}
	.content-wrap {
		padding-top: 80px;
	}
	.animation-target {
	  -webkit-animation: animation 401000ms linear both;
	  animation: animation 401000ms linear both;
	}
	.img-header {
	margin-top: 50px;
	}
	.copy2 {
    margin-top: 40px!important;
	}
}

@media (max-width: 767px) and (min-width: 600px){
	#content {
		margin-top: -75px;
	}
	.content-wrap {
	    padding-top: 70px !important;
	}
	.parallax-window {
	    min-height: 300px;
	    background: transparent;
	}
	.img-header {
	margin-top: 5px;
	}
	.copy2 {
    margin-top: 0px!important;
	}

	.bg-white {
		background-color: #FFFFFF;
		padding: 0;
	}
}

@media (max-width: 599px) and (min-width: 400px){
	#content {
		margin-top: -70px;
	}
	.content-wrap {
	    padding-top: 70px !important;
	}
	.parallax-window {
	    min-height: 300px;
	    background: transparent;
	}
	.img-header {
	margin-top: -1px;
	}
	.copy2 {
    margin-top: 0px!important;
	}

	.bg-white {
		background-color: #FFFFFF;
		padding: 0;
	}
}

@media (max-width: 399px) and (min-width: 0px){
	#content {
		margin-top: -80px;
	}
	.content-wrap {
	    padding-top: 70px !important;
	}
	.parallax-window {
	    min-height: 250px;
	    background: transparent;
	}
	#buldingSite {
		position: relative;
		top: 3px;
	}
	.hidden-xs {
		display: none;
	}
	#adquire {
		font-size: 1.3rem;
	}
	#phone span {
		font-size: 1.3rem;
	}
	#lighting {
		display: none;
	}

	.coinversionistas {
    padding: 15px;
    font-size: 25px;
	}

	.copy2 {
    margin-top: 0px!important;
	}

	.bg-white {
		background-color: #FFFFFF;
		padding: 0;
	}
}

@-webkit-keyframes animation { 
  0% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  0.4% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  0.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  2.39% { -webkit-transform: matrix3d(1, 0, 0, 0, 0.322, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0.322, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  4.28% { -webkit-transform: matrix3d(1, 0, 0, 0, 0.433, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0.433, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  6.77% { -webkit-transform: matrix3d(1, 0, 0, 0, 0.306, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0.306, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  9.26% { -webkit-transform: matrix3d(1, 0, 0, 0, 0.088, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0.088, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  11.75% { -webkit-transform: matrix3d(1, 0, 0, 0, -0.071, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, -0.071, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  14.24% { -webkit-transform: matrix3d(1, 0, 0, 0, -0.121, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, -0.121, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  19.22% { -webkit-transform: matrix3d(1, 0, 0, 0, -0.026, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, -0.026, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  24.2% { -webkit-transform: matrix3d(1, 0, 0, 0, 0.036, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0.036, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  34.16% { -webkit-transform: matrix3d(1, 0, 0, 0, -0.011, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, -0.011, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  44.12% { -webkit-transform: matrix3d(1, 0, 0, 0, 0.003, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0.003, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  54.08% { -webkit-transform: matrix3d(1, 0, 0, 0, -0.001, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, -0.001, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  64.04% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  74% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  83.96% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  93.92% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  100% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 
}

@keyframes animation { 
  0% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  0.4% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  0.5% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  2.39% { -webkit-transform: matrix3d(1, 0, 0, 0, 0.322, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0.322, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  4.28% { -webkit-transform: matrix3d(1, 0, 0, 0, 0.433, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0.433, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  6.77% { -webkit-transform: matrix3d(1, 0, 0, 0, 0.306, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0.306, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  9.26% { -webkit-transform: matrix3d(1, 0, 0, 0, 0.088, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0.088, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  11.75% { -webkit-transform: matrix3d(1, 0, 0, 0, -0.071, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, -0.071, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  14.24% { -webkit-transform: matrix3d(1, 0, 0, 0, -0.121, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, -0.121, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  19.22% { -webkit-transform: matrix3d(1, 0, 0, 0, -0.026, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, -0.026, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  24.2% { -webkit-transform: matrix3d(1, 0, 0, 0, 0.036, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0.036, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  34.16% { -webkit-transform: matrix3d(1, 0, 0, 0, -0.011, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, -0.011, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  44.12% { -webkit-transform: matrix3d(1, 0, 0, 0, 0.003, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0.003, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  54.08% { -webkit-transform: matrix3d(1, 0, 0, 0, -0.001, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, -0.001, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  64.04% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  74% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  83.96% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  93.92% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); }
  100% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 
}