/*STYLE.CSS*/
/*-------------------------------------------------------------------------------------------------------------------------------*/
/*This is main CSS file that contains custom style rules used in this template*/
/*-------------------------------------------------------------------------------------------------------------------------------*/
/* Template Name: KEEN.*/
/* Version: 1.0 Initial Release*/
/* Build Date: 04-05-2015*/
/* Author: Unbranded.*/
/* Website: http://moonart.net.ua/
/* Copyright: (C) 2015 */
/*-------------------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------*/
/* TABLE OF CONTENTS: */
/*--------------------------------------------------------*/
/* 01 - LAYOUT INITIALIZATION & COLOR PRESETS */
/* 02 - HOME */
/* 03 - ABOUT */
/* 04 - CONTACT */
/* 05 - WORK */
/* 06 - BLOG */
/*-------------------------------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------------------------------*/
/* 01 - LAYOUT INITIALIZATION & COLOR PRESETS */
/*-------------------------------------------------------------------------------------------------------------------------------*/

@import url(https://fonts.googleapis.com/css?family=Roboto:400,100,300,500,700,900);

html {margin:0px; padding:0px; height:100%;}
body {margin:0px; padding:0px; font-size:100%; height:100%; width:100%; font-family: 'Roboto', sans-serif; color:#000; background-color: #fff; overflow-x: hidden;}
a {text-decoration:none; outline:none; transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;}
a:hover {text-decoration: none;}
a img{border: 0px none;}
a:hover {outline: none;}
a:active {outline: none; text-decoration: none;}
a:focus {outline: none; outline-offset: 0px; text-decoration: none; color:#fff;}
.clear{clear:both; overflow:hidden; height:0px; font-size:0px;}
.clear_l{clear:both;}
ul {padding:0px; margin:0px; list-style:none;}
input:focus, select:focus, textarea:focus, button:focus{outline:none; box-shadow:none;}
::-webkit-input-placeholder {color:#cacaca; opacity: 1;}
::-moz-placeholder          {color:#cacaca; opacity: 1;}
:-moz-placeholder           {color:#cacaca; opacity: 1;}
:-ms-input-placeholder      {color:#cacaca; opacity: 1;}
h1, h2, h3, h4, h5, h6, p{margin:0px; padding:0px;}
article, section, footer, header, figure, aside, hgroup, nav{display:block;}
header,nav,article,footer,section,aside,figure,figcaption{display:block}
button {outline: none; border: none; box-shadow: none;}

/*------------------------------------------------------*/
/*----------------------BACKGROUND----------------------*/

.bg {position:absolute; left:0px; top:0px; width:100%; height:100%; overflow:hidden;}
.bg img{position:absolute; top: 0px; width: 100%; height: 100%;}
.bg video{position:absolute;}
.bg-bg {background-position: 50% 0px; background-repeat: no-repeat;-webkit-background-size: cover;-moz-background-size: cover; -o-background-size: cover; background-size: cover; }
.bg-bg-bag {background-attachment: scroll;background-origin: initial;background-clip: initial;background-size: cover;background-repeat:no-repeat;background-position:50% 0;position:relative;}
.bg-bg-chrome{background-position: 50% 0px; background-repeat: no-repeat; background-attachment: scroll; -webkit-background-size: cover;-moz-background-size: cover; -o-background-size: cover;-ms-background-size: cover; background-size: cover; position:fixed;}
.bg-bg-chrome.act{position: absolute;}
.clip{clip: rect(auto, auto, auto, auto); height: 100%; position: absolute; width: 100%;}

.full-width {position:relative; float:left; width:100%;}
.full-height {height:100%; position:relative; float:left;}
.vertical-center {-webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); top: 50%;}
.vertical-align {-webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); top:50%; position: absolute; text-align: center; width: 100%;}
.center_img{position: absolute;}
.swiper-container{margin:0 auto;position:relative;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-o-backface-visibility:hidden;backface-visibility:hidden; overflow: hidden;}.swiper-wrapper{position:relative;width:100%; -webkit-transition-property:-webkit-transform,left,top;-webkit-transition-duration:0s;-webkit-transform:translate3d(0px,0,0);-webkit-transition-timing-function:ease;-moz-transition-property:-moz-transform,left,top;-moz-transition-duration:0s;-moz-transform:translate3d(0px,0,0);-moz-transition-timing-function:ease;-o-transition-property:-o-transform,left,top;-o-transition-duration:0s;-o-transform:translate3d(0px,0,0);-o-transition-timing-function:ease;-o-transform:translate(0px,0px);-ms-transition-property:-ms-transform,left,top;-ms-transition-duration:0s;-ms-transform:translate3d(0px,0,0);-ms-transition-timing-function:ease;transition-property:transform,left,top;transition-duration:0s;transform:translate3d(0px,0,0);transition-timing-function:ease;}.swiper-free-mode>.swiper-wrapper{-webkit-transition-timing-function:ease-out;-moz-transition-timing-function:ease-out;-ms-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out;margin:0 auto;}.swiper-wp8-horizontal{-ms-touch-action:pan-y;}.swiper-wp8-vertical{-ms-touch-action:pan-x;}
.swiper-container{height:100%; width: 100%;}
.swiper-slide{position:relative; float:left; overflow:hidden;}

h1 {font-size: 72px; font-weight: 800; line-height: 80px; color: #000;}
h2 {font-size: 26px; line-height: 30px; font-weight: 400; text-transform: uppercase;}
h3 {font-size: 24px; line-height: 22px; font-weight: 100; text-transform: uppercase;}
h4 { font-size: 18px; line-height: 22px; font-weight: 400;}
h5 {font-size: 14px; line-height: 22px; font-weight: 400;}
h6 {font-size: 13px; line-height: 16px;}
p {font-size: 14px; line-height: 24px; font-weight: 300;}
ul {position: relative; float: left;}
ul li a:hover {text-decoration: none; transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;}
input, select {font-size: 14px; border: none; background: none;transition: all 0.35s ease-out; -moz-transition: all 0.35s ease-out;-o-transition: all 0.35s ease-out;-webkit-transition: all 0.35s ease-out;-ms-transition: all 0.35s ease-out;}
textarea {font-size: 13px; line-height: 26px; border: none; border-bottom: 1px solid #ccc; color: #aaa;text-transform: uppercase; padding-left: 5px; padding-bottom: 10px; background: none;}
iframe {border: none;}
q {font-size: 24px; line-height: 50px; color: #000; font-style: italic;}
i { font-size: 18px;}
.text-left {text-align: left;}
.text-right {text-align: right;}
.text-center {text-align: center;}
.bg-white {background: #fff;}
.bg-dark {background: #000;}

/*--------------------------------------------------*/
/*----------------------HEADER----------------------*/

header {position: fixed; left: 0px; top: 0px; width: 100%; height:70px; z-index: 10;}
nav {position: relative; float: right; height:70px; padding-top: 15px; padding-right: 80px; background: #fff; width: 100%; transform: translateX(120%);-webkit-transform: translateX(120%);-moz-transform: translateX(120%);-ms-transform: translateX(120%);transition: all 0.45s ease-out; -moz-transition: all 0.45s ease-out;-o-transition: all 0.45s ease-out;-webkit-transition: all 0.45s ease-out;-ms-transition: all 0.45s ease-out;}
.navigation {position: relative; float: right;}
nav.slide-menu {transform: translateX(0px);-webkit-transform: translateX(0px);-moz-transform: translateX(0px);-ms-transform: translateX(0px);}
nav a {position: relative; float: left;}
nav a span {position: relative; float: left; display: inline-block; padding: 10px 20px; margin: 0px 20px; font-size: 14px; text-transform: uppercase; line-height: 18px; font-weight: 400; text-align: left; color: #000; overflow: hidden;transition: all 0.45s ease-out; -moz-transition: all 0.45s ease-out;-o-transition: all 0.45s ease-out;-webkit-transition: all 0.45s ease-out;-ms-transition: all 0.45s ease-out;}
nav a span:hover {color: #999;}
nav a span.active-link {color: #000; font-weight: 700;}
.logo {position: absolute; left: 30px; top: 18px; z-index: 102; display: none; background: rgba(255,255,255,0.5); border-radius: 0 10px 10px 10px; background: none;  }
.logo img { max-width: 100px; }
.logo2 { position: absolute; left: 50%; top: 5px; z-index: 0; margin-left: -20px; }

.mobile-icon {position: absolute; right: 30px; top: 25px; z-index: 101; display: none;}
.nav-menu-icon a {display: inline-block;width:24px;height:24px;cursor: pointer;text-decoration: none;}
.nav-menu-icon a i {position: relative;display: inline-block;width: 24px;height: 3px;color:#262626;font:bold 14px/.4 Helvetica;text-transform: uppercase;text-indent:-55px;background: #262626;transition:all .2s ease-out;}
.nav-menu-icon a i::before, a i::after {content:'';width: 24px;height: 3px;background: #262626;position: absolute;left:0;transition:all .2s ease-out;}
.nav-menu-icon a i::before {top: -7px;}
.nav-menu-icon a i::after {bottom: -7px;}
.nav-menu-icon a:hover i::before {top: -10px;}
.nav-menu-icon a:hover i::after {bottom: -10px;}
.nav-menu-icon a.active i {background: none;}
.nav-menu-icon a.active i::before {
  top:0;
  -webkit-transform: rotateZ(90deg);
     -moz-transform: rotateZ(90deg);
      -ms-transform: rotateZ(90deg);
       -o-transform: rotateZ(90deg);
          transform: rotateZ(90deg);
}
.nav-menu-icon a.active i::after {
  bottom:0;
  -webkit-transform: rotateZ(-180deg);
     -moz-transform: rotateZ(-180deg);
      -ms-transform: rotateZ(-180deg);
       -o-transform: rotateZ(-180deg);
          transform: rotateZ(-180deg);
}

/*-------------------------------------------------------------------------------------------------------------------------------*/
/* 02 - HOME */
/*-------------------------------------------------------------------------------------------------------------------------------*/

.pagination {position: absolute;right: 37px; text-align: center; top: 50%; z-index: 5;}
.swiper-pagination-switch {cursor: pointer; width: 15px; height: 4px; background: #999; overflow: hidden; position: relative;  display:block; margin: 20px auto; transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;} 
.swiper-pagination-switch:before {content: ''; width: 15px; height: 4px; background: #000; position: absolute; left: 0px; top: 0px; transform: translateX(-100%);-webkit-transform: translateX(-100%);-moz-transform: translateX(-100%);-ms-transform: translateX(-100%); transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;}
.swiper-active-switch.swiper-pagination-switch:before  {transform: translateX(0%);-webkit-transform: translateX(0%);-moz-transform: translateX(0%);-ms-transform: translateX(0%);}
.animsition-loading {background: url(../img/loading.gif) no-repeat;}
.top-baner {position: relative; float: left; width: 100%; height: 100vh;}
.top-baner .swiper-container {padding-top: 0px; height: 100vh;}
.top-baner .swiper-slide {height: 100vh!important; background: rgba(0,51,127,1); }
.main-title {position: absolute; top: 50%; overflow: hidden;  left: 0px; z-index: 5000;}
.main-title h1 {text-transform: uppercase;margin-left: 30px; z-index: 8; transition: all 0.3s ease-in;-webkit-transition: all 0.3s ease-in;-moz-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;}
.title-wrap h1:before {content: attr(data-text); position: absolute; transform: translateY(-102%); left: 30px; top: 0px; background: #fff; color: #000; padding: 3px 8px;  z-index: -1; transition: all 0.4s ease-in;-webkit-transition: all 0.4s ease-in;-moz-transition: all 0.4s ease-in;-o-transition: all 0.4s ease-in;-ms-transition: all 0.4s ease-in;}
.title-wrap.active h1 {color: #ccc; z-index: 5;}
.title-wrap.active h1:before {transform: translateY(0%);-webkit-transform: translateY(0%);-moz-transform: translateY(0%);-ms-transform: translateY(0%);}
.title-wrap.active-out h1:before {transform: translateY(200%);-moz-transform: translateY(200%);-webkit-transform: translateY(200%);-ms-transform: translateY(200%);}
.title-wrap h2 {margin-left: 70px; color: #111; padding: 5px 8px; z-index: 5; overflow: hidden; margin-top: 15px; transform: scale(4);-webkit-transform: scale(4);-moz-transform: scale(4);-ms-transform: scale(4); opacity: 0; transition: all 0.45s ease-in;-webkit-transition: all 0.45s ease-in;-moz-transition: all 0.45s ease-in;-o-transition: all 0.45s ease-in;-ms-transition: all 0.45s ease-in;}
.title-wrap h2:after {content: ''; position: absolute; opacity: 0; left: 0px; background: #fff; width: 100%; height: 100%; z-index: -1; transform: translateY(150%);transition: all 0.35s ease-in;-webkit-transition: all 0.35s ease-in;-moz-transition: all 0.35s ease-in;-o-transition: all 0.35s ease-in;-ms-transition: all 0.35s ease-in;}
.title-wrap.slide h2 {color: #555; transform: scale(1);-webkit-transform: scale(1);-moz-transform: scale(1);-ms-transform: scale(1); opacity: 1;}
.title-wrap.slide h2:after {transform: translateY(0);-webkit-transform: translateY(0);-moz-transform: translateY(0);-ms-transform: translateY(0); opacity: 1;}
.title-wrap {position: relative; float: left; overflow: hidden;}

/*-------------------------------------------------------------------------------------------------------------------------------*/
/* 03 - ABOUT */
/*-------------------------------------------------------------------------------------------------------------------------------*/

.about-page {position: relative; float: left; width: 100%; margin-top: 70px;}
.about-bg {height: 100vmin; position: relative; float: left; width: 100%;}
.team-title {position: relative; float: left; width: 100%;}
.team-title h4 {padding-top: 20px;}
.team-title h6 {padding-top: 10px;}
.about-desc {position: absolute; height: 100%; background: #fff; top: 0%; right: 0px; width: 50%; padding: 15px 15px 50px 50px; overflow: hidden;}
.about-desc .swiper-slide {padding: 0px 15px;}
.about-desc .swiper-slide img {width: 100%; height: auto;}
.about-desc #about-slider {margin-left: -15px; float: left; position: relative; height: 100%; padding-bottom: 40px;}
.about-desc .pagination {display: none;}
.about-desc h2 {padding-bottom: 10px;}
.about-desc p {color: #000; width: 100%; position: relative; float: left; padding-bottom: 40px;}
.about-desc a {font-size: 16px; color: #000; padding-top: 35px; position: absolute; bottom: 30px; left: 50px;}
.about-desc a img {width: 37px; height: 23px; position: relative; float: right; margin-left: 15px; transform: rotate(180deg);-webkit-transform: rotate(180deg);-moz-transform: rotate(180deg);-ms-transform: rotate(180deg);}
.about-desc a:hover {color: #999;}


/*-------------------------------------------------------------------------------------------------------------------------------*/
/* 04 - CONTACT */
/*-------------------------------------------------------------------------------------------------------------------------------*/

.contact-page {position: relative; float: left; width: 100%; margin-top: 70px;}
.contact-page .map {margin-right: 50%;}
.map-canvas {height: 100vmin; position: relative; float: left; width: 100%;}
.contact-desc {position: absolute; width: 100%; height: 100%; background: #fff; top: 0px; right: 0px; width: 50%; padding: 50px;}
.contact-text-block {position: absolute;background: #fff; right: 0px;top: 0%; width: 50%; height: 100%;}
.contact-adress {position: relative; float: left; width: 100%; background: #fff; padding: 15px 30px 40px 30px;}
.contact-adress p {padding: 10px 0px;}
.adress-block {position: relative; float: left; width: 100%; text-align: center; padding-top: 40px;}
.adress-block span {font-size: 50px; color: #000; padding-bottom: 20px;}
.adress-block h4 {padding-bottom: 15px;}
.adress-block a {font-size: 14px; color: #000;}
.adress-block ul {position: relative; float: left; width: 100%;}
.adress-block ul li {font-size: 14px; line-height: 18px; color: #000; width: 100%; padding: 0px 5px;}

.contact-form {position: relative; float: left; width: 100%; padding-top: 15px;}
.contact-form form {padding-top: 20px;}
.contact-form input, .contact-form select {width: 100%; height: 50px; border: 1px solid #999; padding-left: 15px; margin-bottom: 15px; text-transform: uppercase;}
.contact-form textarea {height: 140px; border: 1px solid #999; width: 100%; margin-bottom: 30px; padding: 15px; font-size: 14px;}
.contact-form input[type="submit"] {width: auto; padding: 0px 12px; color: #000;}
.contact-form input[type="submit"]:hover {background: #000; color: #fff;}

/*-------------------------------------------------------------------------------------------------------------------------------*/
/* 05 - WORK */
/*-------------------------------------------------------------------------------------------------------------------------------*/

.copyright {position: relative; float: left; width: 100%; padding: 100px 0px 30px; text-align: center;}
.footer-folow {position: relative; float: left; width: 100%; padding-bottom: 40px;}
.footer-folow a span {font-size: 24px; margin: 0px 12px; color: #000; transition: all 0.35s ease-in;-webkit-transition: all 0.35s ease-in;-moz-transition: all 0.35s ease-in;-ms-transition: all 0.35s ease-in;}
.footer-folow a span:hover {color: #999;}
.copyright span {font-size: 14px; color: #000; text-transform: none; color: #555;}
.home-slider {position: relative; float: left; width: 100%; padding-top: 120px; height: 100vmin;}
.grid-sizer {width: 33.333%;}
.item {position: relative;float: left;overflow: hidden;margin: 0px;width: 31%;text-align: center;cursor: pointer; padding: 0px; margin: 0px 1.1% 2.2%;}
.item img {width: 100%; height: auto; display: block; transform: scale(1.02);-webkit-transform: scale(1.02);-moz-transform: scale(1.02);-ms-transform: scale(1.02); transition: all 0.35s ease-in;-webkit-transition: all 0.35s ease-in;-moz-transition: all 0.35s ease-in;-ms-transition: all 0.35s ease-in;}
.layer {position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background: rgba(255,255,255,0.65); backface-visibility: hidden; z-index: 4;transition: all 0.35s ease-in;-webkit-transition: all 0.35s ease-in;-moz-transition: all 0.35s ease-in;-ms-transition: all 0.35s ease-in;}
.item h2 {text-align: left; font-size: 32px; font-weight: 400; padding-top: 50%; z-index: 5;color: #000; position: absolute; width: 100%; bottom: 25px; padding-left: 30px; font-weight: bold;}
.fillters {position: absolute; width: 100%; height: 100%; background: #fff; left: 0px; top: 0px; padding: 20px 15px 30px; border: 3px solid #000;}
.fillters p {text-align: left; padding-bottom: 35px;}
.fillters button {position: relative; float: left; width: 100%; background: none;}
.fillters button span {font-size: 15px; text-transform: uppercase; position: relative; float: left; padding: 5px 0px; margin: 0px; color: #000; background: none; text-align: left; font-weight: 600;transition: all 0.35s ease-in;-webkit-transition: all 0.35s ease-in;-moz-transition: all 0.35s ease-in;-ms-transition: all 0.35s ease-in;}
.item .fillters h2 {position: relative; float: left; width: 100%; padding: 0px 0px 10px; font-size: 26px; text-align: left; left: 0px; top: 0px; font-weight: 400;}
.fillters button img {position: relative; float: left; margin-left: 25px; width: 37px; height: 23px; transform: rotate(180deg) scale(1);-webkit-transform: rotate(180deg) scale(1);-ms-transform: rotate(180deg) scale(1);-moz-transform: rotate(180deg) scale(1);transition: all 0.35s ease-in;-webkit-transition: all 0.35s ease-in;-moz-transition: all 0.35s ease-in;-ms-transition: all 0.35s ease-in;}
.fillters button.active-button {color: #999;}
.fillters button.active-button img {margin-left: 35px;}
.fillters button:hover span {color: #999;}
.fillters button:hover img {margin-left: 35px;}
.gallery .first-block {height: 380px;}

.fixed.item:hover img {transform: rotate(180deg) scale(1);-webkit-transform: rotate(180deg) scale(1);-ms-transform: rotate(180deg) scale(1);-moz-transform: rotate(180deg) scale(1);}
.item:hover img {transform: scale(1);-webkit-transform: scale(1);-moz-transform: scale(1);-ms-transform: scale(1);}
.item:hover .layer {opacity: 0;}
#main-slider .bg {height: 100vh!important;}
.allbum {position: relative; float: left; width: 100%; padding-top: 70px;}
.work {position: relative; float: left; width: 100%; margin-top: 100px;}
.popup-gallery {position: relative; float: left; width: 100%;}

/*-------------------------------------------------------------------------------------------------------------------------------*/
/* 06 - BLOG */
/*-------------------------------------------------------------------------------------------------------------------------------*/

.gallery .item {width: 33.333%; margin: 0px; padding: 0px;}
.gallery .grid-sizer {width: 33.333%;}

.gallery.gallery2 .item.w_50 {width: 64.666%;}
.gallery.gallery2 .item {width: 31.333%; margin: 0px 1% 2% 1%;}
.gallery.gallery2 .grid-sizer {width: 0px;}
.gallery.gallery3 .item {width: 48%; margin: 0px 1% 2% 1%;}
.gallery.gallery3 .grid-sizer {width: 1%;}

.my-simple-gallery .item img {opacity: 0.65;}
.my-simple-gallery .item img:hover {opacity: 1;}
.gallery-title {position: absolute; top: 0px; width: 100%; left: 0px; padding-left: 30px; padding-right: 50px; text-align: left;}
.gallery-title h2 {color: #000; padding-bottom: 35px; text-transform: uppercase; font-weight: 400; position: relative; padding-top: 50px; padding-left: 0px;}
.gallery-title p {color: #000; position: relative; float: left; width: 100%;}
.gallery-title a {font-size: 16px; color: #000; padding-top: 35px; position: relative; float: left;}
.gallery-title a img {width: 37px; height: 23px; position: relative; float: left; margin-right: 15px; margin-top: -2px;}
.gallery-title a:hover {color: #999;}
.blog-page {position: relative; float: left; width: 100%; padding-top: 70px;}
.blog-page h2 {padding-bottom: 40px; padding-left: 10px;}
.blog-page .item {width: 100%;}
.post-block {position: relative; float: left; width: 100%; overflow: hidden;}
.post-block img {width: 100%; height: auto;}
.post-img {position: relative; float: left; width: 100%; overflow: hidden; height: 340px;}
.post-text {position: absolute; left: 0px; padding-left: 30px; bottom: 0px; width: 100%; text-align: left; z-index: 7;}
.post-text h4 a {color: #000; padding-bottom: 15px; position: relative; float: left; width: 100%; text-transform: uppercase; font-size: 26px; line-height: 32px;}
.post-text span {padding-bottom: 25px; position: relative; float: left; width: 100%; color: #000; font-size: 16px;}
.post-layer {position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 6; background: rgba(255,255,255,0.65); opacity: 1;transition: all 0.35s ease-in;-webkit-transition: all 0.35s ease-in;-moz-transition: all 0.35s ease-in;-ms-transition: all 0.35s ease-in;}
.post-block:hover .post-layer {opacity: 0;}
.post-block a {position: absolute; left: 0px; top: 0px; width: 100%; height: 100%;}

.post-page {position: relative; float: left; width: 100%; padding-top: 70px;}
.post-image img {width: 100%; height: auto;}
.blog-text {position: relative; float: left; width: 100%; padding: 20px 0px 10px;}
.blog-text h2 {padding-bottom: 20px;}
.blog-text p {padding: 15px 0px;position: relative; float: left; width: 100%;}
.blog-text q {border-left: 5px solid #999; position: relative; float: left; width: 100%; padding: 0px 20px 0px 45px; font-weight: 100; line-height: 40px; margin: 15px 0px;}
.blog-tags { position: relative; float: left; width: 100%; padding: 30px 0px 0; overflow: hidden; white-space: nowrap; }
.blog-tags .insider { position: relative; display: block; white-space: nowrap; overflow-y: scroll; height: 46px; }
.blog-tags a, .blog-tags span {font-size: 16px; text-transform: uppercase; color: #000; padding: 3px 8px; margin: 0px 15px; position: relative; display: inline-block; cursor: pointer;}
.blog-tags a:first-child {margin-left: 0px;}
.blog-tags a.activ-tags, .blog-tags a:hover,
.blog-tags span.activ-tags, .blog-tags span:hover {background-color: rgba(0,51,127,1); color: #fff; border-radius: 5px;}
.big-comments {position: relative; float: left; width: 100%; padding: 50px 0px;}
.big-comments h3 {position: relative; float: left; width: 100%; padding-bottom: 40px; font-size: 22px; font-weight: 400;}
.comm-img-big {position: absolute; left: 0px; top: 120px;}
.comm-img-big img {width: 120px; height: 120px;}
.comm-text-big {position: relative; float: left; padding-left: 160px;}
.comm-text-big span {position: absolute; right:  0px; top: 0px; font-size: 13px; color: #999;}
.comm-text-big h4 {padding-bottom: 20px;}
.comm-text-big p {padding-bottom: 33px;}
.comm-follow {position: absolute; bottom: 0px; left: 160px; padding-top: 20px;}
.comm-follow a span {position: relative; float: left; margin: 0px 8px; font-size: 16px; color: #000;transition: all 0.35s ease-in;-webkit-transition: all 0.35s ease-in;-moz-transition: all 0.35s ease-in;-ms-transition: all 0.35s ease-in;}
.comm-follow a span:hover {color: #999;}
.comments {position: relative; float: left; width: 100%; padding: 80px 0px 50px;}
.comments h3 {font-size: 22px; font-weight: 400;}
.com-block {position: relative; float: left; width: 100%; padding-top: 40px;}
.com-img {position: absolute; left: 0px; top: 40px;}
.com-txt {position: relative; float: left; padding-left: 100px;}
.com-txt a {text-transform: uppercase; font-size: 13px; color: #000; position: absolute; right: 0px; top: 0px; font-weight: 700;}
.com-txt span {position: relative; float: left; font-size: 14px; font-weight: 400; color: #999; padding-left: 25px;}
.com-txt h5 {position: relative; float: left; font-size: 16px;}
.com-txt p {position: relative; float: left; width: 100%; padding-top: 15px;}
.com-block:nth-child(3) {padding-left: 100px;}
.com-block:nth-child(3) .com-img {left: 100px;}
.blog-form {position: relative; float: left; width: 100%; padding: 70px 0px 20px;}
.blog-form 	h3 {font-size: 22px; font-weight: 400; padding-bottom: 20px;}


body.inicio footer { display: none !important; }
body.seguro .post-image { background-repeat: no-repeat; background-size: 100% auto; background-position: left 20%; height: 120px; }
h2.notrans { display: block; }
.notrans { text-transform: none !important; }
.padT0 { padding-top: 0px !important; }
.pad0 { padding-top: 0 !important; padding-bottom: 0 !important;  }
.pad10 { padding: 10px 0 !important; }
.padT10 { padding-top: 10px !important; }
.padT20 { padding-top: 20px !important; }
.padT30 { padding-top: 30px !important; }
.padT40 { padding-top: 40px !important; }
.padB0 { padding-bottom: 0px !important; }
.padB10 { padding-bottom: 10px !important; }
.padB20 { padding-bottom: 20px !important; }
.tcenter { text-align: center !important; }
ul.carac { margin-left: 30px; font-size: 13px; line-height: 23px; }
ul.carac li { list-style: disc; padding-bottom: 8px; }
ul.carac.car2 { margin-left: 20px; line-height: 15px; float: left; width: 50%; }
ul.carac.car2.wd100 { width: 100%; box-sizing: border-box; padding-right: 20px; }
ul.carac.car2 li { list-style: circle; }
.lh100 { line-height: 1.4em !important; }

.comm-text-big .botom { position: relative; float: left; display: inline-block; width: 40%; padding-left: 15px; font-size: 13px; text-align: center; }
.comm-text-big .botom a { display: block; }

.botones a { position: relative; display: inline-block; width: 48%; border-radius: 10px; height: 40px; box-shadow: 2px 1px 0 #000; line-height: 40px; text-align: center; font-size: 18px; box-sizing: border-box; margin: 0 1%; color: #fff; }
.botones .vermas { background-color: rgba(0,51,127,1); }
.botones .cotizar { background-color: rgba(251,108,6,1); }
.red { color: red !important; }
.blue, .bloqueFo.blue label { color: rgba(0,51,127,1); }
.orange { color: #cf5906; }
.green { color: green; }
.white { color: white; }
.noflo { float: none !important; }


.tabimg img { width: 100%; height: auto; max-width: 500px; }
.linkto { opacity: 1; transition: 0.5s ease all; }
.linkto.fade { opacity: 0; }
.nodis { display: none!important; }
.seguro p.itali, .itali { font-style: italic; font-size: 15px !important; }

.bloqueFoM { display: block; text-transform: uppercase; font-size: 22px; }
.bloqueFoM span { border-top: 1px solid #00337f; border-bottom: 1px solid #00337f; display: inline-block; padding: 5px 25px; }
.bloqueFoM.orange span { border-color: #cf5906; }
.bloqueFoM.green span { border-color: green; }

input[type=button], input[type=submit], input[type=reset] { color: #fff !important; background: #00337f; border-radius: 5px; box-shadow: 1px 1px 1px #999; border:none; }
.mismoq { display: block; font-size: 16px; text-decoration: underline; cursor: pointer; }

@media screen and (max-width: 1380px) {
    .fillters p {padding-bottom: 10px;}
	.fillters button span {font-size: 12px;}
}
@media screen and (max-width: 1370px) {
	.contact-page .map {margin-right: 50%;}
	.contact-text-block {width: 50%;}
	.about-desc {width: 50%;}
	.desc-block {padding-bottom: 80px;}
	.item h2 {font-size: 26px;}
	.map-canvas {height: 130vmin;}
	.about-bg {height: 130vmin;}
}
@media screen and (max-width: 1200px) {
    .fixed  {height: 320px;}
}
@media screen and (max-width: 800px) {
    .mfp-img-mobile .mfp-close {background: none;}
}
@media screen and (max-width: 1992px) {
	.mobile-icon {display: block;}
	header { background: rgba(255,255,255,0.9); }
  body.inicio header { background: none; }
	nav {position: fixed; left: 0px; text-align: center; padding-right: 0px; top: 0px; width: 100%; height: 100%; z-index: 100; background: #fff; padding-top: 80px; transform: translateY(100%);-webkit-transform: translateY(100%);-moz-transform: translateY(100%);-ms-transform: translateY(100%);}
	nav a {width: 100%; margin: 0px; text-align: center; position: relative; float: left;}
	nav.slide-menu {transform: translateY(0px);-webkit-transform: translateY(0px);-moz-transform: translateY(0px);-ms-transform: translateY(0px);}
	nav a:hover span, nav a:focus span {-webkit-transform: translateX(0%);-moz-transform: translateX(0%);-ms-transform: translateX(0%);transform: translateX(0%);opacity: 1;}
	nav a:hover {color: #999;}
	nav a span {text-align: center; width: 100%; margin: 0px;}
	nav a span.active-link {background: none; color: #000; font-weight: 700;}
	.navigation {width: 100%;}
	.item {width: 48%; margin: 0px 1% 2% 1%;}
	.grid-sizer {width: 1%;}
	.gallery-title h2 {padding-bottom: 0px;}
	.gallery.gallery2 .item.w_50 {width: 48%;}
    .gallery.gallery2 .item {width: 48%; margin: 0px 1% 2% 1%;}
	
	.contact-text-block {width: 100%; position: relative; float: left;}
	.contact-page {margin-top: 0px;}
	.contact-page .map {margin-right: 0px;}
	.map-canvas {height: 400px;}
	.contact-adress {padding-top: 50px;}
	.contact-form {padding-top: 50px;}
	.copyright {padding: 20px 0px 15px;}
	
	.about-desc {width: 100%; position: relative; float: left; top: auto; height: auto; padding-top: 50px;}
	.desc-block {position: relative; float: left; width: 100%; padding-bottom: 20px;}
	.relative-responsive {height: 400px; position: relative;}
	.about-bg {height: 100%;}
	.about-page {margin-top: 0px;}
}
@media screen and (max-width: 768px) {
    .gallery .item {width: 50%;}
}
@media screen and (min-width: 700px) {
  body.seguro .post-image {
      height: 200px;
  }
  .bloqueFo { width: 49%; display: inline-block; vertical-align: top; box-sizing: border-box; padding: 0 30px; }
  .bloqueFoM { }
}
@media screen and (max-width: 2600px) {
    .item {width: 100%; margin: 0px;}
	.grid-sizer {width: 1%;}
	.fillters {margin-left: 0px;}
	.main-title h1 {font-size: 40px;}
	.gallery.gallery2 .item.w_50 {width: 98%;}
    .gallery.gallery2 .item {width: 98%;}
	.gallery.gallery3 .item {width: 98%;}
    .gallery.gallery3 .grid-sizer {width: 1%;}
	.com-block:nth-child(3) {padding-left: 0px;}
    .com-block:nth-child(3) .com-img {left: 0px;}
	.comments {padding-top: 50px; padding-bottom: 20px;}
	.blog-tags a, .blog-tags span {font-size: 14px; margin: 10px 5px;}
	.big-comments {padding: 5px 0px; margin-top: 5px; border-top: rgba(0,51,127,1) 1px solid;}
	.comm-text-big {padding-left: 0px; width: 100%; padding-top: 15px;}
	.comm-img-big {position: relative; float: left; width: 100%; top: 0px; text-align: center;}
	.comm-text-big h4 {padding-bottom: 15px;}
	.comm-follow {left: 0px;}
	.blog-text q{font-size: 20px; line-height: 32px; padding-left: 15px;}
}
@media screen and (max-width: 400px) {
    .item h2 {font-size: 22px; padding-left: 15px;}
}
@media screen and (max-width: 480px) {
	.fillters button {font-size: 13px; margin: 0px 2px;}
	.logo {left: 15px;}
	.mobile-icon {right: 15px;}
    .gallery .item {width: 100%;}
	
	.contact-adress {padding: 50px 0px 40px;}
	.about-desc {padding: 50px 15px;}
	.about-desc .swiper-slide {padding: 0px;}
	.about-desc #about-slider {margin-left: 0px;}
	.about-desc a {left: 15px;}
}

.blog-text h2 {font-size: 20px; line-height: 24px; padding-bottom: 0px;}
.blog-text h3 {font-size: 16px; line-height: 20px; padding: 8px 0 8px 15px;}
ul.carac { margin-left: 30px; font-size: 14px; line-height: 23px; font-weight: 300; }
ul.carac li { padding-bottom: 8px; }

.seguro p { text-align: justify; }
.seguro p, ul.carac { font-size: 16px !important; line-height: 20px !important; }

.main-title h1 { line-height: 100%; color: #00337f; text-shadow: 0px 0px 10px #fff; width: 60%; }
.main-title h2 { line-height: 100%; color: #fb6c06; text-shadow: 2px 2px 1px #00337f, 2px 2px 1px #fff; margin: 0 0 30px 30px; width: 60%; font-size: 22px;  }

table.foots { width: 100%; box-sizing: border-box; padding: 5px 15px; font-size: 16px; margin-bottom: 15px;  }
td.w45 { width: 45%; }
td.w55 { width: 55%; }
@media screen and (max-width: 450px) {
  td.w45 { width: 40%; }
  td.w55 { width: 60%; }
}
table.foots a { color: #00337f; }
table.foots span { font-size: 16px; margin: 0 10px 0 0; }
table.foots span.fa-sign-out-alt { font-size: 12px; margin-left: 5px; }

.fa-phone-alt { color: green !important; }
.fa-facebook { color: #4167B2 !important; }
.fa-whatsapp, .fa-sign-out-alt { color: #01E676 !important; }

header .copyright { position: fixed; z-index: 999; bottom: -200px; transition: 0.3s ease-in all; }
nav.slide-menu + .copyright { z-index: 999; bottom: 0; }

.butAct a { position: fixed; bottom: 10px; width: 38px; height: 38px; line-height: 35px; font-size: 40px; border-radius: 50%; text-align: center; right: 5px; }
.butAct a.Iphone { font-size: 20px; border:3px solid #6755E3; color: #6755E3; bottom: 55px;  }
.butAct a.Iwhats {  }

.fontmas { color:#00337f;  }
.univNiv .resumen { padding: 10px; margin-bottom: 10px; border: 2px solid #00337f; text-align: center; }
.univNiv .resumen label { text-align: center; display: block; margin-bottom: 0; color:#00337f; font-weight: normal; }
.univNiv .resumen label span { font-size: 14px; text-decoration: underline; } 
.univNiv .resumen div { display: inline-block; text-align: center; font-size: 14px; font-weight: bold; background: #00337f; color: #fff; padding: 8px 17px; margin: 4px 0; border-radius: 10px; }
.univNiv .resumen, .univNiv .resumen .txtb  { font-size: 12px; line-height: 15px; }
.univNiv.calculos { background-image: url('../img/loading.gif'); background-position: center; background-repeat: no-repeat;  }

.insiderCal { background: #fff;  opacity: 0;  }
.insiderCal.active { opacity: 1; }


/***************************  FORMULARIO  ******************/

.helper { position: relative; display: inline-block; height: 100%; vertical-align: middle; }
.ifrform { position: fixed; background: #3e165f; top: 2%; left: 2%; width: 96%; height: 96%; z-index: 999; box-shadow: 0 0 10px black; border-radius: 10px; border: 0; overflow-x: scroll; display: none; }
.ifrform.active { display: block; }

.ifrformCl { position: absolute; width: 40px; height: 40px; background: white; color: #ea742f; text-align: center; line-height: 40px; top: 0; right: 0; font-size: 30px; border: 1px dashed #ea742f; vertical-align: middle; font-weight: bold; cursor: pointer; }
.ifrform .download-bg { position: relative; height: 100%; vertical-align: middle; text-align: center; border-radius: 10px;  }
.ifrform .w100 { box-sizing: border-box; padding: 0; }
.ifrform .row { display: block; flex-wrap: nowrap; margin: 0; }
.ifrform .ml-auto, .ifrform .mx-auto { margin-left: auto !important; }
.ifrform .mr-auto, .ifrform .mx-auto { margin-right: auto !important; }
.ifrform .marg0B { margin-bottom: 0px; }
.ifrform .marg20T { margin-top: 20px; }
.ifrform .section-title { margin-bottom: 10px; text-align: center; }
.ifrform .section-title h2 { font-size: 34px; margin-top: -4px; font-weight: 800; text-transform: uppercase; margin-bottom: 20px; text-align: center; color: white !important; }

.ifrform .numerosA { margin: 20px 0; }
.ifrform .numerosA .numbers { background: #fff; border-radius: 50%; font-weight: bold; border: 1px dashed #29B9F2; width: 40px; height: 40px; line-height: 40px; opacity: 0.5; font-size: 18px; }
.ifrform .numerosA .numbers.active { width: 50px; height: 50px; line-height: 48px; opacity: 1; font-size: 23px; }
.ifrform .smprice, .ifrform .download-buttons .button i, .ifrform .numerosA .numbers { color: #ea742f !important; border-color: #ea742f; }
.ifrform .numerosA .numbers, .ifrform .numerosA .guion { position: relative; display: inline-block; transition: all 0.5s ease; }
.ifrform .button, .ifrform .numbers { cursor: pointer; }
.ifrform .numerosA .numbers.active + span { opacity: 1; }
.ifrform .numerosA .guion { border-top: 3px solid #fff; width: 10px; top: -5px; opacity: 0.5; position: relative; display: inline-block; transition: all 0.5s ease; }

.ifrform form { display: block; margin-top: 0em; margin-bottom: 20px; }
.ifrform [role=button], .ifrform a, .ifrform area, .ifrform button, .ifrform input:not([type=range]), .ifrform label, .ifrform select, .ifrform summary, .ifrform textarea { -ms-touch-action: manipulation; touch-action: manipulation; }
.ifrform a, .ifrform button, .ifrform img, .ifrform input, .ifrform span { transition: all 0.3s ease 0s; }
.ifrform button, .ifrform input { overflow: visible; }
.ifrform button, .ifrform input, .ifrform optgroup, .ifrform select, .ifrform textarea { margin: 0; font-family: inherit; font-size: inherit; line-height: inherit; }

.ifrform .pasos { visibility: visible; opacity: 1; transition: all 1s ease; }
.ifrform .pasos h3 { position: relative; width: 100%; text-transform: none; }
.ifrform .cwhite { color: white; }
.marg30B { margin-bottom: 30px; }
.ifrform h3 { font-size: 24px; line-height: 30px; display: block; margin-block-start: 1em; margin-block-end: 1em; margin-inline-start: 0px; margin-inline-end: 0px; }
.ifrform h1, .ifrform h2, .ifrform h3, .ifrform h4, .ifrform h5, .ifrform h6 { color: #383838; font-family: "Lato", sans-serif; margin-top: 0; font-weight: 500; }
.pad0 { padding: 0 !important; }
.col-lg-12 { position: relative; width: 100%; min-height: 1px; padding-right: 15px; padding-left: 15px; }
.text-center { text-align: center!important; }

.ifrform .pasos.num1 label.button { animation-duration: 2s; animation-iteration-count: infinite; animation-name: bounce-5; animation-timing-function: ease; }
.ifrform .download-buttons .button { background: #fff none repeat scroll 0 0; border-color: #fff; color: #222; margin: 0 15px; padding: 15px 30px; position: relative; display: inline-block; border-radius: 30px; font-weight: 600; font-size: 16px; align-content: center; transition: all 0.4s ease-in-out; }
.ifrform .download-buttons .button i { font-size: 18px; color: #29B9F2; margin-right: 10px; transition: all 0.4s ease-in-out; }
.ifrform .pasos label { display: inline-block; width: 100px; height: 100px; box-sizing: border-box; margin: 0 1% 15px !important; box-shadow: 0px 2px #000; text-align: center; padding: 0 !important; vertical-align: middle; }
.ifrform .pasos label i, .ifrform .pasos label span { position: relative; display: inline-block; vertical-align: middle; }
.ifrform .pasos label span { line-height: 16px; }

.vlinh { position: relative; height: 100%; }

.ifrform .pasos label div { display: inline-block; vertical-align: middle; }
.ifrform .pasos label i, .ifrform .pasos label span { position: relative; display: inline-block; vertical-align: middle; }
.ifrform .pasos label i { margin: 0 !important; font-size: 30px !important; height: 25px; line-height: 25px; font-style: normal; }
.ifrform .pasos label span.texto { padding: 5px 10px; font-size: 12px; line-height: 14px; margin-top: 3px; }
.ifrform .pasos input[type=radio] { position: absolute; top: 0; left: 0; width: 1px; height: 1px; opacity: 0; }
.ifrform input[type=checkbox], .ifrform input[type=radio] { box-sizing: border-box; padding: 0; }
.ifrform .pasos.num1 label.button:nth-child(3) { animation-delay: 1s; }
.ifrform .pasos.novis { position: absolute; margin-top: 0; height: 1px; overflow: hidden; opacity: 0; visibility: 0; }
.ifrform .pasos h3 .embar { font-size: 0.6em; padding: 10px 50px 0; line-height: 1.2em; }
.ifrform .pasos h3 .embar, .ifrform .pasos h3 .demog { display: block; color: #ea742f; font-size: 0.7em; line-height: 1em; }
.ifrform .vida .demog { display: none !important; }
.ifrform .nodis { display: none !important; }
.ifrform .myrange { position: relative; width: 100%; display: block; }
#myRange, #myRange1 { display: inline-block; height: 100%; padding: 5px; color: white; width: 90%; overflow: visible; opacity: 1; visibility: visible; border: 1px solid #fff; margin: 0; font-family: inherit; font-size: 20px; line-height: 100%; box-sizing: border-box; -webkit-appearance: none; width: 90%; height: 25px; background: #fff; outline: none; border-radius: 20px; }
#myRange::-webkit-slider-thumb, #myRange1::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 40px; height: 40px; background: #ea742f; border-radius: 50%; cursor: pointer; }
#myRange::-moz-range-thumb, #myRange1::-moz-range-thumb { border-radius: 50%; width: 40px; height: 40px; background: #ea742f; cursor: pointer; }
html { -webkit-tap-highlight-color: #fff; }
.ifrform p { font-size: 16px; line-height: 22px; font-family: "Raleway", sans-serif; margin-top: 0; margin-bottom: 1rem; color: white; text-align: center; }

.ifrform section-title.text-black p { color: #fff; }
.ifrform .form-group { margin-bottom: 1rem; }
.marg50T { margin-top: 50px; }
.ifrform textarea { text-transform: none; }


.ifrform .hospitales { padding: 0 20px; box-sizing: border-box; }
.ifrform .hospitales label { position: relative; display: block; width: 100%; margin: 0 0 15px 0 !important; height: auto; box-sizing: border-box; padding: 15px 20px !important; border-radius: 30px 30px 0 !important; }
.ifrform .hospitales label div { text-align: left; display: inline-block; }
.ifrform .hospitales label i { position: absolute; font-size: 40px !important; right: 10px; bottom: 15px; }
.ifrform .hospitales label div span { display: block; }
.ifrform .hospitales label .tit { color: #3e165f; font-weight: bold; font-size: 22px; text-align: center; padding-bottom: 5px; }
.ifrform .hospitales label .hos { font-size: 0.8em; color: rgb(62,22,95, 0.6); padding: 5px 0; text-align: center; height: 40px; overflow: hidden; }
.ifrform .hospitales label .hos b { color: #ea742f; }
.ifrform .hospitales label .anual { font-size: 0.8em; padding: 5px 0; text-align: center; }
.ifrform .hospitales label .mensual { text-align: center; color: #ea742f; }
.ifrform .hospitales label .mensual b { font-size: 1.3em; }
.ifrform .hospitales .detalles { color: white; padding: 20px 0 10px; }



@keyframes bounce-5 {
    0%   { transform: scale(1,1)    translateY(0); }
    10%  { transform: scale(1.1,.95) translateY(0); }
    30%  { transform: scale(.95,1.1) translateY(-7px); }
    50%  { transform: scale(1,1)    translateY(0); }
    57%  { transform: scale(1,1)    translateY(-2px); }
    64%  { transform: scale(1,1)    translateY(0); }
    100% { transform: scale(1,1)    translateY(0); }
}

@keyframes ldio-tc0brrv89ql-o {
    0%    { opacity: 1; transform: translate(0 0) }
   49.99% { opacity: 1; transform: translate(56.4px,0) }
   50%    { opacity: 0; transform: translate(56.4px,0) }
  100%    { opacity: 0; transform: translate(0,0) }
}
@keyframes ldio-tc0brrv89ql {
    0% { transform: translate(0,0) }
   50% { transform: translate(56.4px,0) }
  100% { transform: translate(0,0) }
}
.ldio-tc0brrv89ql div {
  position: absolute;
  width: 56.4px;
  height: 56.4px;
  border-radius: 50%;
  top: 42.3px;
  left: 14.1px;
}
.ldio-tc0brrv89ql div:nth-child(1) {
  background: #ffffff;
  animation: ldio-tc0brrv89ql 1s linear infinite;
  animation-delay: -0.5s;
}
.ldio-tc0brrv89ql div:nth-child(2) {
  background: #ea742f;
  animation: ldio-tc0brrv89ql 1s linear infinite;
  animation-delay: 0s;
}
.ldio-tc0brrv89ql div:nth-child(3) {
  background: #ffffff;
  animation: ldio-tc0brrv89ql-o 1s linear infinite;
  animation-delay: -0.5s;
}
.loadingio-spinner-dual-ball-nmun30zolo {
  width: 141px;
  height: 141px;
  display: inline-block;
  overflow: hidden;
  background: none;
}
.ldio-tc0brrv89ql {
  width: 100%;
  height: 100%;
  position: relative;
  transform: translateZ(0) scale(1);
  backface-visibility: hidden;
  transform-origin: 0 0; /* see note above */
}
.ldio-tc0brrv89ql div { box-sizing: content-box; }
/* generated by https://loading.io/ */

.cargando { height: 50px; line-height: 50px; display: none; width: 100%; text-align: center; }
.cargando i { font-size: 45px; display: inline-block; color: white; }
.chksubm.active .cargando { display: block; } 
.chksubm.active .button { display: none; } 
.button, .numbers { cursor: pointer; }

.vidrest img { width: 80%; max-width: 80%; margin-left: auto; margin-right: auto; }

.ifrform .pasos.formul i.contac { color: #fff; font-size: 28px; width: 40px; vertical-align: middle; display: inline-block; }
.ifrform .pasos.formul input { width: 70%; }
.ifrform .form-control { border: 1px solid #ddd; border-radius: 0; padding: 12px 12px; border-radius: 5px; font-size: 18px; color: #495057; height: auto; background-color: #fff; background-image: none; background-clip: padding-box; border: 1px solid #ced4da; border-radius: .25rem; transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; }
.ifrform .contact-area-two .form-control { border-radius: 25px; padding: 12px 20px; }
.ifrform .pasos.formul i.contac, .ifrform .pasos.formul input { display: inline-block; }

.form-group .error { display: block; color: #ea742f; padding-top: 5px; font-size: 18px; }