/* ==========================================================================
   IMPORT GOOGLE FONTS
   ========================================================================== */
   @import url("https://fonts.googleapis.com/css?family=Rubik:400,400i,500");
   @import url("https://fonts.googleapis.com/css?family=Poppins:400,500,600");
   
   
   /* ==========================================================================
      THEME
      ========================================================================== */
      :root {       

       --color-01: #000;
       --color-02: #151948;
       --color-03: #180e29;    
       --color-04: #24153c;    
       --color-05: #25ddf5;
       --color-06: #333;
       --color-07: #3c9cfd;
       --color-08: #3c1f6e;
       --color-09: #3ecf8e;
       --color-10: #5533ff;
       --color-11: #5e629c;
       --color-12: #7fc9fb;
       --color-13: #999;
       --color-14: #a0a6ad;
       --color-15: #ccc;
       --color-16: #ddd;
       --color-17: #e33333;
       --color-18: #e3fff2;
       --color-19: #ededed;
       --color-20: #f9f9f9;
       --color-21: #ff704f;
       --color-22: #fff;
   
       --rgba-1: rgba(0, 0, 0, 0.08);    
       --rgba-2: rgba(50, 50, 93, 0.11);
       --rgba-3: rgba(51, 51, 51, 0.1);       
       --rgba-4: rgba(95, 95, 95, 0.24);           

       --body-text-color: var(--color-14);    
       --body-theme-1: var(--color-10);
       --body-theme-2: var(--color-05);
       --body-theme-3: var(--color-07);       
                         
       --imagenes-01: var(--color-09);    
       --imagenes-02: var(--color-11);
       --imagenes-03: var(--color-15);
       --imagenes-04: var(--color-16);
       --imagenes-05: var(--color-22);
       
       --sucursales-01: var(--color-02);
       --sucursales-02: var(--color-09);
       --sucursales-03: var(--color-11);    
       --sucursales-04: var(--color-15);
       --sucursales-05: var(--color-22);
       
       --showcase-01: var(--color-10);
       --showcase-02: var(--color-05);
       --showcase-03: var(--color-01);
       --showcase-04: var(--color-09);    
       --showcase-05: var(--color-22);                 
           
       --features-01: var(--color-09);    
       --features-02: var(--color-18);
       --features-03: var(--color-19);
       --features-04: var(--color-20);
       --features-05: var(--color-22);
       
       --services-01: var(--color-02);
       --services-02: var(--color-09);    
       --services-03: var(--color-16);        
       --services-04: var(--color-18);
       
       --footer-01: var(--color-03);
       --footer-02: var(--color-04);
       --footer-03: var(--color-08);
       --footer-04: var(--color-09);
       --footer-05: var(--color-16);    
       --footer-06: var(--color-18);
       --footer-07: var(--color-22);  
     }
   
   /* ==========================================================================
     GENERAL
      ========================================================================== */
      body {
       font-family: 'Rubik', sans-serif;
       color: var(--body-text-color);
       font-size: 14px;
       font-weight: 400;
       background: var(--color-22);
       overflow-x: hidden;
     }
     
     html {
       overflow-x: hidden;
       font-display: swap;
     }
     
     p {
       font-size: 14px;
       color: var(--color-11);
       line-height: 26px;
       margin-bottom: 0;
     }
     
     a:hover,
     a:focus {
       color: var(--color-01);
     }
     
     a {
       color: var(--color-01);
       transition: all 0.3s ease-in-out;
       -moz-transition: all 0.3s ease-in-out;
       -webkit-transition: all 0.3s ease-in-out;
       -o-transition: all 0.3s ease-in-out;
       -ms-transition: all 0.3s ease-in-out;
     }
     
     h1,
     h2,
     h3,
     h4,
     h5 {
       font-family: 'Poppins', sans-serif;
       font-size: 40px;
       font-weight: 400;
       color: var(--color-02);
     }
     
     ul {
       margin: 0;
       padding: 0;
     }
     
     ul li {
       list-style: none;
     }
     
     a:hover,
     a:focus {
       text-decoration: none;
       outline: none;
     }
     
     a:not([href]):not([tabindex]) {
       color: var(--color-22);
     }
     
     a:not([href]):not([tabindex]):focus,
     a:not([href]):not([tabindex]):hover {
       color: var(--color-22);
     }
     
     .bg-transparent {
       background: transparent !important;
     }
     
     .bg-defult {
       background: var(--body-theme-3) !important;
     }
   
   /* == Title == */
   
     .section {
       padding: 130px 0px;
     }
     
     .form-control:focus {
       outline: none;
       -webkit-box-shadow: none;
               box-shadow: none;
     }
     
     .section-header {
       color: var(--color-22);
       margin-bottom: 50px;
       text-align: center;
       position: relative;
     }
     
     .section-header .section-title {
       font-size: 35px;
       margin-bottom: 12px;
       font-weight: 600;
       position: relative;
       line-height: 30px;
     }
     
     .section-header .desc-text p {
       font-size: 18px;
       color: var(--color-11);
       line-height: 26px;
       margin-bottom: 0;
     }
   
   /* == Buttons == */
   
      .btn {
       font-size: 14px;
       padding: 10px 30px;
       border-radius: 4px;
       font-family: 'Rubik', sans-serif;
       letter-spacing: 1px;
       font-weight: 500;
       color: var(--color-22);
       border: none;
       text-transform: uppercase;
       transition: all 0.3s ease-in-out;
       -moz-transition: all 0.3s ease-in-out;
       -webkit-transition: all 0.3s ease-in-out;
       -o-transition: all 0.3s ease-in-out;
       -ms-transition: all 0.3s ease-in-out;
       display: inline-block;
     }
     
     .btn:focus,
     .btn:active {
       -webkit-box-shadow: none;
               box-shadow: none;
       outline: none;
     }
     
     .btn-common {
       background-color: var(--color-09);
       position: relative;
       z-index: 1;
       box-shadow: 0px 8px 9px 0px var(--rgba-4);
       -moz-box-shadow: 0px 8px 9px 0px var(--rgba-4);
       -webkit-box-shadow: 0px 8px 9px 0px var(--rgba-4);
       -o-box-shadow: 0px 8px 9px 0px var(--rgba-4);
       -ms-box-shadow: 0px 8px 9px 0px var(--rgba-4);
       width: 160px;
       height: 50px;
       padding: 14px 15px;
     }
     
     .btn-common:hover {
       color: var(--color-22);
       -webkit-transform: translateY(-2px);
               transform: translateY(-2px);
     }
     
     .btn-light-bg {
       background-color: var(--color-21);
     }
     
     .btn-border {
       border-style: solid;
       border-width: 1px;
       cursor: pointer;
       background-color: transparent;
       border-color: var(--color-09);
       color: var(--color-09);
       width: 160px;
       height: 50px;
       padding: 14px 15px;
     }
     
     .btn-border:hover {
       box-shadow: 0px 8px 9px 0px var(--rgba-4);
       -moz-box-shadow: 0px 8px 9px 0px var(--rgba-4);
       -webkit-box-shadow: 0px 8px 9px 0px var(--rgba-4);
       -o-box-shadow: 0px 8px 9px 0px var(--rgba-4);
       -ms-box-shadow: 0px 8px 9px 0px var(--rgba-4);
       transform: translateY(-2px);
       -moz-transform: translateY(-2px);
       -webkit-transform: translateY(-2px);
       -o-transform: translateY(-2px);
       -ms-transform: translateY(-2px);
     }
     .btn-border-filled:visited i {
       color: var(--color-22);
     } 
   
     .btn-border-filled:visited,
     .btn-border-filled {
       cursor: pointer;
       background-color: var(--color-09);
       border: 1px solid var(--color-09);
       color: var(--color-22);
       box-shadow: 0px 8px 9px 0px var(--rgba-4);
       -moz-box-shadow: 0px 8px 9px 0px var(--rgba-4);
       -webkit-box-shadow: 0px 8px 9px 0px var(--rgba-4);
       -o-box-shadow: 0px 8px 9px 0px var(--rgba-4);
       -ms-box-shadow: 0px 8px 9px 0px var(--rgba-4);
       width: 180px;
       height: 50px;
       padding: 15px 15px;
     }
       
     .btn-border-filled:hover {
       color: var(--color-22);
       /* background-color: transparent; */
       border-color: var(--color-22);
       -webkit-transform: translateY(-2px);
               transform: translateY(-2px);
     }
     
     .btn-lg {
       padding: 14px 33px;
       text-transform: uppercase;
       font-size: 16px;
     }
     
     .btn-rm {
       color: var(--body-theme-3);
       padding: 10px 0;
       text-transform: capitalize;
       font-size: 16px;
     }
     
     .btn-rm i {
       vertical-align: middle;
     }
     
     .btn-singin {
       background: var(--color-12);
       color: var(--color-22);
       padding: 10px 23px;
       margin-left: 30px;
       box-shadow: 0px 8px 9px 0px var(--rgba-4);
       -moz-box-shadow: 0px 8px 9px 0px var(--rgba-4);
       -webkit-box-shadow: 0px 8px 9px 0px var(--rgba-4);
       -o-box-shadow: 0px 8px 9px 0px var(--rgba-4);
       -ms-box-shadow: 0px 8px 9px 0px var(--rgba-4);
     }
     
     .btn-singin:hover,
     .btn-singin:active,
     .btn-singin:focus {
       color: var(--color-22);
       box-shadow: 0px 8px 9px 0px var(--rgba-4);
       -moz-box-shadow: 0px 8px 9px 0px var(--rgba-4);
       -webkit-box-shadow: 0px 8px 9px 0px var(--rgba-4);
       -o-box-shadow: 0px 8px 9px 0px var(--rgba-4);
       -ms-box-shadow: 0px 8px 9px 0px var(--rgba-4);
     }
     
     .btn-light-singin:hover,
     .btn-light-singin:active,
     .btn-light-singin:focus {
       color: var(--color-22);
       box-shadow: 0px 8px 9px 0px var(--rgba-4);
       -moz-box-shadow: 0px 8px 9px 0px var(--rgba-4);
       -webkit-box-shadow: 0px 8px 9px 0px var(--rgba-4);
       -o-box-shadow: 0px 8px 9px 0px var(--rgba-4);
       -ms-box-shadow: 0px 8px 9px 0px var(--rgba-4);
     }          
     
     button:focus {
       outline: none !important;
     }
     
     .btn-border-fill {
       background: var(--color-22);
       border-color: var(--color-22);
       color: var(--body-theme-3);
     }
     
     .btn-subtitle {
       color: var(--color-03);
       font-family: 'Poppins', sans-serif;
       background: var(--color-16);
       text-align: center;
       border-radius: 30px;
       padding: 6px 30px;
       text-transform: uppercase;
       font-weight: 700;
       margin-bottom: 20px;
       font-size: 14px;
     }
   
     .btn-flat:visited,
     .btn-flat:focus {
       color: var(--color-22);
     }
     
     .clear {
       clear: both;
     }
     
     .mt {
       margin-top: 80px;
     }
     
     .mt-30 {
       margin-top: 30px;
     }
     
     .mb-30 {
       margin-bottom: 30px;
     }
     
     .pt-30 {
       padding-top: 30px;
     }
     
     .pb-30 {
       padding-bottom: 30px;
     }
     
     .pt-70 {
       padding-top: 70px;
     }
     
     .mb-50 {
       margin-bottom: 50px;
     }
     
     .padding-0 {
       padding: 0;
     }
     
     .pr-20 {
       padding-right: 20px;
     }
     
     .pl-20 {
       padding-left: 20px;
     }
     
     .pl-70 {
       padding-left: 70px;
     }
     
     .pr-70 {
       padding-right: 70px;
     }
   
   /* == Preloader == */
   
     #preloader {
       position: fixed;
       top: 0;
       left: 0;
       right: 0;
       bottom: 0;
       background-color: var(--color-22);
       z-index: 9999999;
     }
     
     .loader {
       top: 50%;
       width: 50px;
       height: 50px;
       border-radius: 100%;
       position: relative;
       margin: 0 auto;
     }
     
     #loader-1:before,
     #loader-1:after {
       content: "";
       position: absolute;
       top: -10px;
       left: -10px;
       width: 100%;
       height: 100%;
       border-radius: 100%;
       border: 7px solid transparent;
       border-top-color: var(--body-theme-3);
     }
     
     #loader-1:before {
       z-index: 100;
       -webkit-animation: spin 2s infinite;
               animation: spin 2s infinite;
     }
     
     #loader-1:after {
       border: 7px solid var(--color-20);
     }
     
     @-webkit-keyframes spin {
       0% {
         transform: rotate(0deg);
         -moz-transform: rotate(0deg);
         -webkit-transform: rotate(0deg);
         -o-transform: rotate(0deg);
         -ms-transform: rotate(0deg);
       }
       100% {
         transform: rotate(360deg);
         -moz-transform: rotate(360deg);
         -webkit-transform: rotate(360deg);
         -o-transform: rotate(360deg);
         -ms-transform: rotate(360deg);
       }
     }
     
     @keyframes spin {
       0% {
         transform: rotate(0deg);
         -moz-transform: rotate(0deg);
         -webkit-transform: rotate(0deg);
         -o-transform: rotate(0deg);
         -ms-transform: rotate(0deg);
       }
       100% {
         transform: rotate(360deg);
         -moz-transform: rotate(360deg);
         -webkit-transform: rotate(360deg);
         -o-transform: rotate(360deg);
         -ms-transform: rotate(360deg);
       }
     }
   
   /* == Scroll To Up == */
   
     /* .back-to-top {
       display: none;
       position: fixed;
       bottom: 18px;
       right: 15px;
       width: 45px;
       height: 45px;
       line-height: 50px;
       cursor: pointer;
       text-align: center;
       border-radius: 4px;
       background: var(--body-3);
       background: linear-gradient(95deg, var(--body-3) 40%, var(--body-4) 100%);
       -webkit-box-shadow: 0px 8px 9px 0px var(--rgba-7);
               box-shadow: 0px 8px 9px 0px var(--rgba-7);
       z-index: 9999999;
     }
     
     .back-to-top i {
       color: var(--color-26);
       font-size: 20px;
       transition: all 0.3s ease-in-out;
       -moz-transition: all 0.3s ease-in-out;
       -webkit-transition: all 0.3s ease-in-out;
       -o-transition: all 0.3s ease-in-out;
       -ms-transition: all 0.3s ease-in-out;
     } */
   
     .back-to-top {
       display: none;
       position: fixed;
       width:60px;
       height:60px;
       bottom:40px;
       right:40px;
       line-height: 75px;
       cursor: pointer;
       text-align: center;
       background-color: var(--color-09);    
       border-radius:50px;
       /* background: linear-gradient(95deg, var(--body-3) 40%, var(--body-4) 100%); */
       -webkit-box-shadow: 0px 8px 9px 0px var(--rgba-4);
               box-shadow: 0px 8px 9px 0px var(--rgba-4);
       z-index: 9999999;
     }
     
     .back-to-top i {
       color: var(--color-22);
       font-size:32px;
       transition: all 0.3s ease-in-out;
       -moz-transition: all 0.3s ease-in-out;
       -webkit-transition: all 0.3s ease-in-out;
       -o-transition: all 0.3s ease-in-out;
       -ms-transition: all 0.3s ease-in-out;
     }
   
     .float{
       position:fixed;
       width:60px;
       height:60px;
       bottom:40px;
       right:40px;
       background-color: var(--color-28);
       color: var(--color-22);
       border-radius:50px;
       text-align:center;
       font-size:32px;
       box-shadow: 2px 2px 3px var(--color-13);
       z-index:100;
     }
     
     .my-float{
       margin-top: 14px;
       margin-left: 2px;
     }
   
   /* == Navbar Style == */
   
     .logo-menu a {
       font-size: 20px;
       color: var(--color-22);
     }
     
     .menu-bg {
       background: var(--body-theme-1);
       background: linear-gradient(95deg, var(--body-theme-1) 40%, var(--body-theme-2) 100%) !important;
       -webkit-box-shadow: 0 0 7px 1px var(--rgba-1);
               box-shadow: 0 0 7px 1px var(--rgba-1);
       z-index: 9999;
       padding: 5px;
       -webkit-transition: all 0.5s ease-in-out;
       transition: all 0.5s ease-in-out;
     }
     
     .menu-bg .menu-button {
       top: 0;
     }
     
     .menu-bg .menu-button:hover {
       cursor: pointer;
       color: var(--body-theme-3);
     }
     
     .menu-bg .logo-menu a {
       color: var(--body-theme-3);
     }
     
     .menu-bg .navbar-nav .nav-link {
       color: var(--color-22) !important;
     }
     
     .menu-bg .navbar-nav .nav-link:hover {
       color: var(--color-22) !important;
     }
     
     .menu-bg .navbar-nav .active {
       color: var(--color-22) !important;
     }
     
     .navbar-expand-md .navbar-nav .nav-link {
       color: var(--color-22);
       font-size: 16px;
       padding: 8px 0px;
       margin-left: 26px;
       font-family: 'Poppins', sans-serif;
       position: relative;
       font-weight: 500;
     }
     
     .navbar-expand-md .navbar-nav .nav-link:before {
       content: '';
       position: absolute;
       bottom: 0;
       left: 0;
       width: 0;
       height: 2px;
       background: var(--color-22);
       -webkit-transition: 0.3s;
       transition: 0.3s;
     }
     
     .navbar-expand-md .navbar-nav .active::before,
     .navbar-expand-md .navbar-nav .nav-link:hover::before {
       width: 100%;
     }
     
     .navbar-brand {
       color: var(--color-22);      
     }
     
     .navbar-expand-md .navbar-nav .nav-link:focus,
     .navbar-expand-md .navbar-nav .nav-link:hover,
     .navbar-expand-md .navbar-nav .nav-link:hover:before {
       color: var(--color-22);
     }
     
     .navbar-expand-md .navbar-nav .active > .nav-link,
     .navbar-expand-md .navbar-nav .nav-link.active,
     .navbar-expand-md .navbar-nav .nav-link.active:before,
     .navbar-expand-md .navbar-nav .nav-link.open,
     .navbar-expand-md .navbar-nav .open > .nav-link {
       color: var(--color-22);
     }
     
     .navbar-expand-md .navbar-toggler {
       background: transparent;
       border: 1px solid var(--color-22);
       border-radius: 3px;
       margin: 5px;
       cursor: pointer;
       float: right;
     }
     
     .navbar-expand-md .navbar-toggler i {
       color: var(--color-22) !important;
     }
     
     .navbar-expand-md .navbar-toggler:focus {
       outline: none;
     }
   
     .navbar-area {
       position: absolute;
       top: 0;
       left: 0;
       width: 100%;
       z-index: 99;
       transition: all 0.3s ease-in-out;
       -moz-transition: all 0.3s ease-in-out;
       -webkit-transition: all 0.3s ease-in-out;
       -o-transition: all 0.3s ease-in-out;
       -ms-transition: all 0.3s ease-in-out;
     }
     
     .sticky {
       position: fixed;
       z-index: 99;
       transition: all 0.3s ease-in-out;
       -moz-transition: all 0.3s ease-in-out;
       -webkit-transition: all 0.3s ease-in-out;
       -o-transition: all 0.3s ease-in-out;
       -ms-transition: all 0.3s ease-in-out;
     }
     
     .sticky .navbar {
       padding: 10px 0;
     }
     
     .navbar {
       position: relative;
       transition: all 0.3s ease-in-out;
       -moz-transition: all 0.3s ease-in-out;
       -webkit-transition: all 0.3s ease-in-out;
       -o-transition: all 0.3s ease-in-out;
       -ms-transition: all 0.3s ease-in-out;
       min-height: 80px;
       padding: 20px 0;
     }
     
     .navbar-brand {
       padding: 0;
     }
     
     .navbar-brand img {
       max-width: 280px;
     }

     .navbar-toggler {
       padding: 0;
     }
     
     .navbar-toggler .toggler-icon {
       width: 30px;
       height: 2px;
       background-color: var(--color-22);
       display: block;
       margin: 5px 0;
       position: relative;
       transition: all 0.3s ease-in-out;
       -moz-transition: all 0.3s ease-in-out;
       -webkit-transition: all 0.3s ease-in-out;
       -o-transition: all 0.3s ease-in-out;
       -ms-transition: all 0.3s ease-in-out;
     }
     
     .navbar-toggler.active .toggler-icon:nth-of-type(1) {
       transform: rotate(45deg);
       -moz-transform: rotate(45deg);
       -webkit-transform: rotate(45deg);
       -o-transform: rotate(45deg);
       -ms-transform: rotate(45deg);
       top: 7px;
     }
     
     .navbar-toggler.active .toggler-icon:nth-of-type(2) {
       opacity: 0;
     }
     
     .navbar-toggler.active .toggler-icon:nth-of-type(3) {
       transform: rotate(135deg);
       -moz-transform: rotate(135deg);
       -webkit-transform: rotate(135deg);
       -o-transform: rotate(135deg);
       -ms-transform: rotate(135deg);
       top: -7px;
     }
     
     @media only screen and (min-width: 768px) and (max-width: 991px) {
       .navbar-collapse {
         position: absolute;
         top: 100%;
         left: 0;
         width: 100%;
         background-color: var(--color-22);
         z-index: 9;
         box-shadow: 0px 15px 20px 0px var(--rgba-1);
         -moz-box-shadow: 0px 15px 20px 0px var(--rgba-1);
         -webkit-box-shadow: 0px 15px 20px 0px var(--rgba-1);
         -o-box-shadow: 0px 15px 20px 0px var(--rgba-1);
         -ms-box-shadow: 0px 15px 20px 0px var(--rgba-1);
         padding: 5px 12px;
       }
     }
     
     @media (max-width: 767px) {
       .navbar-collapse {
         position: absolute;
         top: 100%;
         left: 0;
         width: 100%;
         background-color: var(--color-22);
         z-index: 9;
         box-shadow: 0px 15px 20px 0px var(--rgba-3);
         -moz-box-shadow: 0px 15px 20px 0px var(--rgba-3);
         -webkit-box-shadow: 0px 15px 20px 0px var(--rgba-3);
         -o-box-shadow: 0px 15px 20px 0px var(--rgba-3);
         -ms-box-shadow: 0px 15px 20px 0px var(--rgba-3);
         padding: 5px 12px;
       }
     }
     
     .navbar-nav {
       -webkit-box-align: center;
           -ms-flex-align: center;
               align-items: center;
     }
     
     @media only screen and (min-width: 768px) and (max-width: 991px) {
       .navbar-nav {
         -webkit-box-align: start;
             -ms-flex-align: start;
                 align-items: flex-start;
       }
     }
     
     @media (max-width: 767px) {
       .navbar-nav {
         -webkit-box-align: start;
             -ms-flex-align: start;
                 align-items: flex-start;
       }
     }
     
     .navbar-nav .nav-item {
       margin-left: 25px;
       position: relative;
     }
     
     .navbar-nav .nav-item:first-child {
       margin-left: 0;
     }
     
     @media only screen and (min-width: 992px) and (max-width: 1199px) {
       .navbar-nav .nav-item {
         margin-left: 18px;
       }
     }
     
     @media only screen and (min-width: 768px) and (max-width: 991px) {
       .navbar-nav .nav-item {
         margin: 0;
       }
     }
     
     @media (max-width: 767px) {
       .navbar-nav .nav-item {
         margin: 0;
       }
     }
     
     .navbar-nav .nav-item a {
       font-family: 'Poppins', sans-serif;
       font-size: 16px;
       font-weight: 500;
       color: var(--color-22);
       transition: all 0.3s ease-in-out;
       -moz-transition: all 0.3s ease-in-out;
       -webkit-transition: all 0.3s ease-in-out;
       -o-transition: all 0.3s ease-in-out;
       -ms-transition: all 0.3s ease-in-out;
       position: relative;
     }
     
     .navbar-nav .nav-item a::after {
       content: '';
       position: absolute;
       width: 0%;
       height: 2px;
       background: var(--color-22);
       left: 0;
       bottom: -10px;
       transition: all 0.3s ease-in-out;
       -moz-transition: all 0.3s ease-in-out;
       -webkit-transition: all 0.3s ease-in-out;
       -o-transition: all 0.3s ease-in-out;
       -ms-transition: all 0.3s ease-in-out;
     }
     
     @media only screen and (min-width: 768px) and (max-width: 991px) {
       .navbar-nav .nav-item a::after {
         background: none;
       }
     }
     
     @media (max-width: 767px) {
       .navbar-nav .nav-item a::after {
         background: none;
       }
     }
     
     @media only screen and (min-width: 768px) and (max-width: 991px) {
       .navbar-nav .nav-item a {
         display: block;
         padding: 6px 0;
         color: var(--color-06);
       }
     }
     
     @media (max-width: 767px) {
       .navbar-nav .nav-item a {
         display: block;
         padding: 6px 0;
         color: var(--color-06);
       }
     }
     
     .navbar-nav .nav-item a.btn-singin:hover {
       box-shadow: 0px 0px 0px 0px var(--rgba-4);
       -moz-box-shadow: 0px 0px 0px 0px var(--rgba-4);
       -webkit-box-shadow: 0px 0px 0px 0px var(--rgba-4);
       -o-box-shadow: 0px 0px 0px 0px var(--rgba-4);
       -ms-box-shadow: 0px 0px 0px 0px var(--rgba-4);
     }
     
     @media only screen and (min-width: 768px) and (max-width: 991px) {
       .navbar-nav .nav-item a.btn-singin {
         padding: 10px 30px;
         margin-left: 0px;
       }
     }
     
     @media (max-width: 767px) {
       .navbar-nav .nav-item a.btn-singin {
         padding: 10px 30px;
         margin-left: 0px;
       }
     }
     
     .navbar-nav .nav-item a.btn-singin::after {
       display: none;
     }
     
     @media only screen and (min-width: 768px) and (max-width: 991px) {
       .navbar-nav .nav-item a.btn-light-singin {
         padding: 10px 30px;
         margin-left: 0px;
       }
     }
     
     @media (max-width: 767px) {
       .navbar-nav .nav-item a.btn-light-singin {
         padding: 10px 30px;
         margin-left: 0px;
       }
     }
     
     .navbar-nav .nav-item a.btn-light-singin ::after {
       display: none;
     }
     
     @media only screen and (min-width: 768px) and (max-width: 991px) {
       .navbar-nav .nav-item.active > a, .navbar-nav .nav-item:hover > a {
         color: var(--color-09);
       }
     }
     
     @media (max-width: 767px) {
       .navbar-nav .nav-item.active > a, .navbar-nav .nav-item:hover > a {
         color: var(--color-09);
       }
     }
     
     .navbar-nav .nav-item.active > a::after, .navbar-nav .nav-item:hover > a::after {
       width: 100%;
     }
     
     .navbar-nav .nav-item:hover .sub-menu {
       top: 100%;
       opacity: 1;
       visibility: visible;
     }
     
     @media only screen and (min-width: 768px) and (max-width: 991px) {
       .navbar-nav .nav-item:hover .sub-menu {
         top: 0;
       }
     }
     
     @media (max-width: 767px) {
       .navbar-nav .nav-item:hover .sub-menu {
         top: 0;
       }
     }
     
     .navbar-nav .nav-item .sub-menu {
       width: 200px;
       background-color: var(--color-22);
       box-shadow: 0px 0px 20px 0px var(--rgba-1);
       -moz-box-shadow: 0px 0px 20px 0px var(--rgba-1);
       -webkit-box-shadow: 0px 0px 20px 0px var(--rgba-1);
       -o-box-shadow: 0px 0px 20px 0px var(--rgba-1);
       -ms-box-shadow: 0px 0px 20px 0px var(--rgba-1);
       position: absolute;
       top: 110%;
       left: 0;
       opacity: 0;
       visibility: hidden;
       transition: all 0.3s ease-in-out;
       -moz-transition: all 0.3s ease-in-out;
       -webkit-transition: all 0.3s ease-in-out;
       -o-transition: all 0.3s ease-in-out;
       -ms-transition: all 0.3s ease-in-out;
     }
     
     @media only screen and (min-width: 768px) and (max-width: 991px) {
       .navbar-nav .nav-item .sub-menu {
         position: relative;
         width: 100%;
         top: 0;
         display: none;
         opacity: 1;
         visibility: visible;
       }
     }
     
     @media (max-width: 767px) {
       .navbar-nav .nav-item .sub-menu {
         position: relative;
         width: 100%;
         top: 0;
         display: none;
         opacity: 1;
         visibility: visible;
       }
     }
     
     .navbar-nav .nav-item .sub-menu li {
       display: block;
     }
     
     .navbar-nav .nav-item .sub-menu li a {
       display: block;
       padding: 8px 20px;
       color: var(--color-06);
     }
     
     .navbar-nav .nav-item .sub-menu li a.active, .navbar-nav .nav-item .sub-menu li a:hover {
       padding-left: 25px;
       color: var(--color-17);
     }
     
     .navbar-nav .sub-nav-toggler {
       display: none;
     }
     
     @media only screen and (min-width: 768px) and (max-width: 991px) {
       .navbar-nav .sub-nav-toggler {
         display: block;
         position: absolute;
         right: 0;
         top: 0;
         background: none;
         color: var(--color-06);
         font-size: 18px;
         border: 0;
         width: 30px;
         height: 30px;
       }
     }
     
     @media (max-width: 767px) {
       .navbar-nav .sub-nav-toggler {
         display: block;
         position: absolute;
         right: 0;
         top: 0;
         background: none;
         color: var(--color-06);
         font-size: 18px;
         border: 0;
         width: 30px;
         height: 30px;
       }
     }
     
     .navbar-nav .sub-nav-toggler span {
       width: 8px;
       height: 8px;
       border-left: 1px solid var(--color-06);
       border-bottom: 1px solid var(--color-06);
       transform: rotate(-45deg);
       -moz-transform: rotate(-45deg);
       -webkit-transform: rotate(-45deg);
       -o-transform: rotate(-45deg);
       -ms-transform: rotate(-45deg);
       position: relative;
       top: -5px;
     }
   
   /* == Hero Area == */
   
     .hero-area {
       position: relative;
       min-height: 720px;
     }
     
     .hero-area .overlay {
       position: absolute;
       width: 100%;
       height: 100%;
       inset:0;
       min-height:600px; /* o lo que ocupe el hero */
       top: 0px;
       left: 0px;
       background: var(--body-theme-1);
       background: linear-gradient(95deg, var(--body-theme-1) 40%, var(--body-theme-2) 100%);
       -webkit-transform: skewY(-12deg);
       transform: skewY(-12deg);
       -webkit-transform-origin: 0;
       transform-origin: 0;
       z-index: -12;
     }
     
     .hero-area .overlay :nth-child(1) {
       width: 33.33333%;
       width: calc(100% / 2);
       top: 0;
       left: 16.66666%;
       left: calc(calc(100% / 3) / 2);
       right: auto;
       background: var(--body-theme-1);
       background: linear-gradient(95deg, var(--body-theme-1) 40%, var(--body-theme-2) 100%);
       height: 200px;
     }
     
     /* .hero-area .overlay :nth-child(2) {
       width: 33.33333%;
       width: calc(100% / 3);
       bottom: 0;
       background: var(--body-theme-1);
       background: linear-gradient(95deg, var(--body-theme-1) 40%, var(--body-theme-2) 100%);
       position: absolute;
       height: 155px;
       left: 3%;
     } */
     
     .hero-area .contents {
       padding: 220px 0;
     }
     
     @media (max-width: 767px) {
       .hero-area .contents {
         padding-bottom: 0px;
       }
     }
     
     .hero-area .contents h2 {
       color: var(--color-22);
       font-size: 38px;
       font-weight: 600;
       line-height: 60px;
       margin-bottom: 20px;
     }
     
     @media only screen and (min-width: 992px) and (max-width: 1199px) {
       .hero-area .contents h2 br {
         display: none;
       }
     }
     
     .hero-area .contents p {
       color: var(--color-22);
       font-size: 18px;
       line-height: 26px;
     }
     
     .hero-area .contents .btn {
       margin-top: 40px;
       margin-right: 20px;
       text-transform: uppercase;
       width: 180px;
       height: 50px;
       padding: 15px 15px;
     }
     
     .hero-area .contents .btn-border {
       border: 1px solid var(--color-22);
       color: var(--color-09) !important;
       -webkit-box-shadow: 0 4px 6px var(--rgba-2), 0 1px 3px var(--rgba-1);
               box-shadow: 0 4px 6px var(--rgba-2), 0 1px 3px var(--rgba-1);
       width: 180px;
       height: 50px;
       padding: 15px 15px;
       background: var(--color-22);
     }
     
     .hero-area .contents .btn-border:hover {
       background: var(--color-22);
       color: var(--color-09);
     }
     
     .hero-area .intro-img {
        display: flex;
        padding: 180px 0 0px;       
     }
     
     .hero-area .intro-img img {
       display: block;
       height: auto;
       max-width: 100%;              
     }

     .grey-bg {    
         background: var(--features-04);    
     }
     .size1-5em {
       font-size: 1.5em;
     }
   
     a.page-scroll {
       cursor: pointer;
     }
   /* ==========================================================================
     Services - Section 
      ========================================================================== */
   
      .services .container {
       padding-top: 50px;
      }
     .services .services-item {
       padding: 60px 30px;
       border: 1px solid var(--services-03);
       transition: all 0.8s ease-in-out;
       -moz-transition: all 0.8s ease-in-out;
       -webkit-transition: all 0.8s ease-in-out;
       -o-transition: all 0.8s ease-in-out;
       -ms-transition: all 0.8s ease-in-out;
       margin-bottom: 30px;
     }
     
     .services .services-item:hover {
       border: 1px solid var(--services-02);
       box-shadow: 0px 0px 25px 0px var(--rgba-4);
       -moz-box-shadow: 0px 0px 25px 0px var(--rgba-4);
       -webkit-box-shadow: 0px 0px 25px 0px var(--rgba-4);
       -o-box-shadow: 0px 0px 25px 0px var(--rgba-4);
       -ms-box-shadow: 0px 0px 25px 0px var(--rgba-4);
       transition: all 0.4s ease-in-out;
       -moz-transition: all 0.4s ease-in-out;
       -webkit-transition: all 0.4s ease-in-out;
       -o-transition: all 0.4s ease-in-out;
       -ms-transition: all 0.4s ease-in-out;
     }
     
     .services .services-item .icon {
       background: var(--services-04);
       width: 110px;
       height: 110px;
       margin: 0px auto;
       margin-bottom: 0px;
       text-align: center;
       display: block;
       border-radius: 50%;
       position: relative;
       margin-bottom: 25px;
     }
     
     .services .services-item .icon i {
       font-size: 40px;
       color: var(--services-02);
       position: absolute;
       left: 0;
       right: 0;
       top: 30%;
     }
     
     .services .services-item h4 {
       font-size: 20px;
       font-weight: 600;
       color: var(--services-01);
       margin-bottom: 15px;
     }
     
     .services .services-item p {
       font-size: 16px;
       margin-bottom: 10px;
       color: var(--services-02);
     }
   
   /* ==========================================================================
     Section - business-plan
      ========================================================================== */
   
     .business-plan {
       padding-bottom: 130px;
     }
     
     .business-plan .container-fluid {
       padding-right: 30px;
       padding-left: 30px;
     }
     
     .business-plan .business-item-info {
       margin-top: 60px;
     }
     
     .business-plan .business-item-info h3 {
       font-size: 35px;
       font-weight: 600;
       margin-bottom: 25px;
     }
     
     .business-plan .business-item-info p {
       font-size: 16px;
       text-align: justify;
       margin-bottom: 20px;
     }
     
     @media only screen and (min-width: 992px) and (max-width: 1199px) {
       .business-plan .business-item-info p br {
         display: none;
       }
     }
   
   /* ==========================================================================
     Section - Features 
      ========================================================================== */
   
     .features .featured-bg {
       background: var(--features-05);
     }
     
     .features .featured-border1 {
       border-bottom: 1px solid var(--features-03);
       border-right: 1px solid var(--features-03);
     }
     
     .features .featured-border2 {
       border-bottom: 1px solid var(--features-03);
     }
     
     .features .featured-border3 {
       border-right: 1px solid var(--features-03);
     }
     
     .features .feature-item {
       padding: 30px;
       height: 100%;
       overflow: hidden;
       transition: all 0.8s ease-in-out;
       -moz-transition: all 0.8s ease-in-out;
       -webkit-transition: all 0.8s ease-in-out;
       -o-transition: all 0.8s ease-in-out;
       -ms-transition: all 0.8s ease-in-out;
     }
     
     .features .feature-item .feature-icon {
       background: var(--features-02);
       width: 100px;
       height: 100px;
       margin: 0px auto;
       margin-top: 0px;
       margin-right: auto;
       margin-bottom: 0px;
       text-align: center;
       display: block;
       border-radius: 50%;
       position: relative;
       margin-right: 20px;
       border: 1px solid var(--features-01);
       margin-top: 12px;
     }
     
    .features .feature-item .feature-info {
      margin-top: 12px;
    }

     .features .feature-item .feature-icon p {
       clear: both;
     }

     
     @media only screen and (min-width: 768px) and (max-width: 991px) {
       .features .feature-item .feature-icon {
         margin-right: 15px;
       }
     }
     
     @media (max-width: 767px) {
       .features .feature-item .feature-icon {
         margin-bottom: 30px;
       }
     }
     
     .features .feature-item .feature-icon i {
       font-size: 40px;
       color: var(--features-01);
       position: absolute;
       left: 0;
       right: 0;
       top: 32%;
     }
     
     .features .feature-item h4 {
       font-size: 20px;
       font-weight: 600;
       margin-bottom: 20px;
     }
     
     @media only screen and (min-width: 768px) and (max-width: 991px) {
       .features .feature-item h4 {
         font-size: 17px;
       }
     }
     
     .features .feature-item p {
       font-size: 16px;
       display: block;
       text-align: justify;
     }
     
     @media only screen and (min-width: 992px) and (max-width: 1199px) {
       .features .feature-item p br {
         display: none;
       }
     }
     
     .features .feature-item:hover {
       box-shadow: 0px 0px 25px 0px var(--rgba-4);
       -moz-box-shadow: 0px 0px 25px 0px var(--rgba-4);
       -webkit-box-shadow: 0px 0px 25px 0px var(--rgba-4);
       -o-box-shadow: 0px 0px 25px 0px var(--rgba-4);
       -ms-box-shadow: 0px 0px 25px 0px var(--rgba-4);
       transition: all 0.8s ease-in-out;
       -moz-transition: all 0.8s ease-in-out;
       -webkit-transition: all 0.8s ease-in-out;
       -o-transition: all 0.8s ease-in-out;
       -ms-transition: all 0.8s ease-in-out;
     }
     
     .features .feature-item:hover .feature-icon {
       background: var(--features-01);
       transition: all 0.8s ease-in-out;
       -moz-transition: all 0.8s ease-in-out;
       -webkit-transition: all 0.8s ease-in-out;
       -o-transition: all 0.8s ease-in-out;
       -ms-transition: all 0.8s ease-in-out;
     }
     
     .features .feature-item:hover .feature-icon i {
       color: var(--features-05);
       transition: all 0.8s ease-in-out;
       -moz-transition: all 0.8s ease-in-out;
       -webkit-transition: all 0.8s ease-in-out;
       -o-transition: all 0.8s ease-in-out;
       -ms-transition: all 0.8s ease-in-out;
     }
        
   
   /* ==========================================================================
     Section - Showcase 
      ========================================================================== */
   
     .showcase .showcase-area {
       margin-top: -80px;
       margin-left: 30px;
       margin-right: 30px;
     }
     
     .showcase .showcase-text h2,
     .showcase .showcase-text a  {
       color: var(--showcase-05);
     }
     
     .showcase .showcase-text p {
       color: var(--showcase-05);
     }
     
     .showcase .gradient-bg {
       background: var(--showcase-01);
       background: linear-gradient(95deg, var(--showcase-01) 40%, var(--showcase-02) 100%);
       padding: 119px 0px 80px 0px;
     }
     
     .showcase .showcase-slider .owl-controls .owl-page.active span,
     .showcase .showcase-slider .owl-controls.clickable .owl-page:hover span {
       filter: Alpha(Opacity=100);
       opacity: 1;
       background: var(--showcase-04);
     }
     
     .showcase .showcase-slider .owl-controls .owl-page span {
       display: block;
       width: 12px;
       height: 12px;
       margin: 5px 7px;
       filter: Alpha(Opacity=50);
       opacity: 0.5;
       border-radius: 20px;
       background: var(--showcase-04);
     }
     
     .showcase .showcase-slider .owl-controls .active span {
       width: 15px;
       height: 15px;
     }
     
     #showcase .showcase-slider .screenshot-thumb .fancy-table {
      padding-top: 72px; 
    } 
     .showcase .showcase-slider .screenshot-thumb {
       width: 100%;
       height: 100%;
       position: relative;
     }
     
     .showcase .showcase-slider .screenshot-thumb p, 
     .showcase .showcase-slider .screenshot-thumb a {
       color: var(--showcase-05);
       font-size: 16px;
       font-style: italic;
       margin-bottom: 10px;
     }

     .showcase .showcase-slider .screenshot-thumb .scrollable {
        overflow-y: scroll;
        height: 200px;        
      }
     
     .showcase .showcase-slider .screenshot-thumb h5 {
       font-size: 20px;
       color: var(--showcase-05);
       display: block;
       font-weight: 600;
     }
     
     .showcase .showcase-slider .screenshot-thumb .zoom-icon a {
       display: inline-block;
       margin: 8px;
     }
     
     /* .showcase .showcase-slider .screenshot-thumb .zoom-icon a:hover i {
       color: var(--showcase-03);
       -webkit-transition: all 200ms ease-in;
       transition: all 200ms ease-in;
     } */
     
     .showcase .showcase-slider .screenshot-thumb .zoom-icon a i {
       color: var(--showcase-05);
       font-size: 20px;
     }
     
     .showcase .showcase-slider .screenshot-thumb > .hover-content {
       background-color: var(--showcase-04);       
       /* height: 85%; */
       height: 80px;
       left: 0;
       opacity: 0;
       position: absolute;
       /* top: 0; */
       bottom: 0;
       -webkit-transition-duration: 500ms;
       transition-duration: 500ms;
       width: 83%;
       margin: 25px;
       display: -webkit-box;
       display: -ms-flexbox;
       display: flex;
       -webkit-box-align: center;
           -ms-flex-align: center;
               align-items: center;
       -webkit-box-pack: center;
           -ms-flex-pack: center;
               justify-content: center;
     }
     
     .showcase .showcase-slider .screenshot-thumb:hover .hover-content {
       opacity: 0.9;
       -webkit-transition-duration: 500ms;
       transition-duration: 500ms;
     }
     
     .showcase .showcase-slider .owl-wrapper-outer {
       padding: 20px 0px;
     }
   
     .showcase .instagram-link p{
       font-size: 1.5em;
     }
   
   /* ==========================================================================
      Section - Our Sucursales 
      ========================================================================== */
   
     .sucursales .sucursales-table {
       /* padding: 55px;     */
       /* margin-bottom: 30px; */
       background-color: var(--sucursales-05);
       border: 1px solid var(--sucursales-04);
       transition: all 0.8s ease-in-out;
       -moz-transition: all 0.8s ease-in-out;
       -webkit-transition: all 0.8s ease-in-out;
       -o-transition: all 0.8s ease-in-out;
       -ms-transition: all 0.8s ease-in-out;
     }
     
     .sucursales .sucursales-table h3 {
       font-size: 20px;
       color: var(--sucursales-01);
       font-weight: 500;
       text-transform: uppercase;
       margin-bottom: 11px;
     }
     
     .sucursales .sucursales-table h1 {
       color: var(--sucursales-02);
       font-size: 50px;
       font-weight: 500;
       position: relative;
       padding-left: 10px;
       display: inline-block;
     }
     
     .sucursales .sucursales-table h1 span {
       font-size: 16px;
       position: absolute;
       left: -12px;
       top: 10px;
     }
     
     .sucursales .sucursales-table ul {
       /* padding-bottom: 28px; */
       text-align: left;
     }
   
     .sucursales .sucursales-table ul li {
       font-size: 16px;
       font-weight: 400;
       color: var(--sucursales-03);
       display: block;
       line-height: 33px;
       border-top: 1px solid var(--sucursales-04);
       padding-left: 10px;    
     }
   
     .sucursales .sucursales-table ul li:hover {
       background: var(--features-01);
       cursor: pointer;
       transition: all 0.8s ease-in-out;
       -moz-transition: all 0.8s ease-in-out;
       -webkit-transition: all 0.8s ease-in-out;
       -o-transition: all 0.8s ease-in-out;
       -ms-transition: all 0.8s ease-in-out;
     }
     
     .sucursales .sucursales-table:hover {
       border: 1px solid var(--sucursales-02);
       box-shadow: 0px 0px 25px 0px var(--rgba-4);
       -moz-box-shadow: 0px 0px 25px 0px var(--rgba-4);
       -webkit-box-shadow: 0px 0px 25px 0px var(--rgba-4);
       -o-box-shadow: 0px 0px 25px 0px var(--rgba-4);
       -ms-box-shadow: 0px 0px 25px 0px var(--rgba-4);
       transition: all 0.3s ease-in-out;
       -moz-transition: all 0.3s ease-in-out;
       -webkit-transition: all 0.3s ease-in-out;
       -o-transition: all 0.3s ease-in-out;
       -ms-transition: all 0.3s ease-in-out;
     }
   
     .sucursales .sucursales-table:hover .separator{
       border: 1px solid var(--sucursales-02);
       transition: all 0.3s ease-in-out;
       -moz-transition: all 0.3s ease-in-out;
       -webkit-transition: all 0.3s ease-in-out;
       -o-transition: all 0.3s ease-in-out;
       -ms-transition: all 0.3s ease-in-out;
     }
   
     .sucursales .botonero .botonero-icon {
       background: var(--features-02);
       width: 100px;
       height: 100px;
       margin: 15px;    
       text-align: center;
       display: block;
       border-radius: 4px;
       position: relative;
       border: 1px solid var(--features-01);
       margin-top: 12px;
     }
   
     .sucursales .separator {
       border: 1px solid var(--sucursales-04);
     }
     
     @media only screen and (min-width: 768px) and (max-width: 1199px) {
       .sucursales .sucursales-table {
         margin-bottom: 50px;
       }
       .sucursales .botonero .botonero-icon {
         margin-right: 15px;
       }
     }
     
     @media (max-width: 767px) {
       .sucursales .sucursales-table {
         margin-bottom: 50px;
       }
       .sucursales .botonero .botonero-icon {
         margin-bottom: 30px;
       }
     }
     
     .sucursales .botonero .botonero-icon i {
       font-size: 40px;
       color: var(--features-01);
       position: absolute;
       left: 0;
       right: 0;
       top: 32%;
     }
   
     .sucursales .botonero .botonero-icon:hover {
       background: var(--features-01);
       cursor: pointer;
       transition: all 0.8s ease-in-out;
       -moz-transition: all 0.8s ease-in-out;
       -webkit-transition: all 0.8s ease-in-out;
       -o-transition: all 0.8s ease-in-out;
       -ms-transition: all 0.8s ease-in-out;
     }
     
     .sucursales .botonero .botonero-icon:hover i {
       color: var(--features-05);
       transition: all 0.8s ease-in-out;
       -moz-transition: all 0.8s ease-in-out;
       -webkit-transition: all 0.8s ease-in-out;
       -o-transition: all 0.8s ease-in-out;
       -ms-transition: all 0.8s ease-in-out;
     }
   
     .sucursales .sucursales-header {
       background-color: var(--body-theme-3);    
       padding: 20px;
     }
   
     .sucursales .sucursales-header h3 {
       color: var(--features-05);
       margin-bottom: 0px;
       font-size: 2em;
     }
   
     
     .sucursales .sucursales-details i {
       font-size: 30px;
       padding: 10px;
     }
   
     .sucursales .sucursales-details p,
     .sucursales .sucursales-details a {
       color: var(--color-11);
       font-size: 20px;
       font-weight: 400;
       line-height: 24px;
       -webkit-transition: all 300ms;
       transition: all 300ms;    
     }
   
     .sucursales .sucursales-details p span {
       font-size: 0.8em;
     }
         
     .sucursales .sucursales-details a:hover {
       color: var(--footer-04);
       padding-left: 5px;
       -webkit-transition: all 300ms;
       transition: all 300ms;
     }
   
     .sucursales .sucursales-details div.row {
       padding: 10px 0px;
       text-align: left;
       margin: auto 0;
       border-bottom: 1px solid #ccc;
     }
   
     .sucursales .sucursales-details .last {
       border-bottom: 0px !important;
     }
   
     .sucursales .sucursales-details div.row div {
       margin: auto 0;
     }
     
     .sucursales-details div.row i {    
       text-align: center;
     }
     
     
   /* ==========================================================================
     Section - imagenes section
      ========================================================================== */
   
     .imagenes .single-imagenes {
       border: 1px solid var(--imagenes-04);
       margin-bottom: 30px;
       position: relative;
       transition: all 0.8s ease-in-out;
       -moz-transition: all 0.8s ease-in-out;
       -webkit-transition: all 0.8s ease-in-out;
       -o-transition: all 0.8s ease-in-out;
       -ms-transition: all 0.8s ease-in-out;
     }
     
     .imagenes .single-imagenes img {
       width: 100%;
     }
          
     .imagenes .single-imagenes:hover {
       box-shadow: 0px 0px 25px 0px var(--rgba-4);
       -moz-box-shadow: 0px 0px 25px 0px var(--rgba-4);
       -webkit-box-shadow: 0px 0px 25px 0px var(--rgba-4);
       -o-box-shadow: 0px 0px 25px 0px var(--rgba-4);
       -ms-box-shadow: 0px 0px 25px 0px var(--rgba-4);
       transition: all 0.8s ease-in-out;
       -moz-transition: all 0.8s ease-in-out;
       -webkit-transition: all 0.8s ease-in-out;
       -o-transition: all 0.8s ease-in-out;
       -ms-transition: all 0.8s ease-in-out;
     }
                 
     .btn.disabled,
     .btn:disabled {
       opacity: 1;
     }
     
     .text-danger {
       font-size: 14px;
       margin-top: 10px;
     }
          
   
   /* ==========================================================================
     Contact section
      ========================================================================== */   
       
      .contact .submit-button button {
         width: 100%;
       }
   
       .contact form#contactForm .form-group {
         margin-bottom: 20px;
       }
   
       .contact form#contactForm input[type="text"],
       .contact form#contactForm input[type="email"] {
         min-height: 52px;
         padding: 0px 0 0 28px;
         font-size: 16px;
         /* color: var(--color-07); */
       }
   
       .contact form#contactForm textarea {
         padding: 15px 0 0 28px;
         font-size: 16px;
         /* color: var(--color-07); */
       }
   
       .contact form#contactForm .form-control:focus {
         border: 1px solid var(--color-09);
         outline: none;
         -webkit-box-shadow: none;
                 box-shadow: none;
         background: var(--color-09);
       }
       .contact #msgSubmit {
         padding-top: 15px;
       }
     
     /* ==========================================================================
       Footer section
        ========================================================================== */
     .footer-content {
       padding: 60px 0px;
       background: var(--footer-01);
     }
     
     .footer-content .footer-logo {    
       padding-bottom: 25px;
       margin-bottom: 10px;
       border-bottom: 1px solid rgba(255, 255, 255, 0.2);
       width: 80%;
     }
   
     .footer-content .footer-logo img {
       width: 100%;
     }
     
     .footer-content .form-control:focus {
       outline: none;
       -webkit-box-shadow: none;
               box-shadow: none;
       background: var(--footer-06);
     }
     
     .footer-content .copyright {
       margin-top: 125px;
       border-top: 1px solid var(--footer-03);
       padding-top: 30px;
       padding-bottom: 30px;
     }
     
     .footer-content .copyright p {
       color: var(--footer-04);
       font-size: 18px;
     }
     
     .footer-content .copyright a {
       color: var(--footer-05);
     }
     
     .footer-content .widget p {
       color: var(--footer-05);
       font-size: 14px;
       line-height: 24px;
     }
     
     .footer-content .widget .subscribe-area {
       position: relative;
       height: 40px;
       margin-top: 18px;
     }
     
     .footer-content .widget .subscribe-area input[type="email"] {
       background: var(--footer-02);
       border: 1px solid var(--footer-07);
       color: var(--footer-05);
       font-size: 14px;
       font-style: italic;
       height: 38px;
     }
     
     .footer-content .widget .subscribe-area span i {
       position: absolute;
       right: 0;
       width: 60px;
       height: 38px;
       color: var(--footer-07);
       top: 0;
       background: var(--footer-04);
       display: block;
       padding: 9px 20px;
       font-size: 18px;
       border-radius: 0px 4px 4px 0px;
     }
     
     .footer-content h3 {
       color: var(--footer-07);
       font-size: 18px;    
       margin-bottom: 20px;
     }
     
     .footer-content ul.menu li a {
       color: var(--footer-05);
       font-size: 16px;
       font-weight: 400;
       line-height: 32px;
       -webkit-transition: all 300ms;
       transition: all 300ms;
     }
         
     .footer-content ul.menu li a:hover {
       color: var(--footer-04);
       padding-left: 5px;
       -webkit-transition: all 300ms;
       transition: all 300ms;
     }
     
     @media (max-width: 767px) {
       .footer-content .widget {
         display: none;
         margin-bottom: 25px;
       }
     }
     
     .redes a:hover {
       color: var(--footer-04);
       -webkit-transition: all 300ms;
       transition: all 300ms;
     }
     .redes a {
       font-size: 40px;
     }


     .spinner {
        border: 4px solid rgba(0, 0, 0, 0.1);
        width: 36px;
        height: 36px;
        border-radius: 50%;
        border-left-color: #09f;
      
        animation: spin 1s ease infinite;
      }
      
      @keyframes spin {
        0% {
          transform: rotate(0deg);
        }
      
        100% {
          transform: rotate(360deg);
        }
      }
    
   /*# sourceMappingURL=main.css.map */