
/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
:root {
  scroll-behavior: smooth;
}

body {
  font-family: "Inter", sans-serif;
  color: #000;
}
body.home {background: #FFD6C4}

a {
  color: #4154f1;
  text-decoration: none;
}

a:hover {
  color: rgba(16,106,254,1);
  text-decoration: none;
}

h1, h2 , h3 {
  font-family: 'Gelica';
    font-weight: 500;
}
h2 {font-size: 60px}

p {  font-family: "Inter", sans-serif;
    font-size: 12pt}

h5 {font-family: "Manrope", sans-serif;
    font-weight: 600;
    font-size: 1.15rem;
}
h6 {font-weight: 400}

.font-primary {font-family: 'Gelica';}
.font-secondary {font-family: "Manrope", sans-serif !important;}


.btn:focus,
.btn:active:focus,
.btn-link.nav-link:focus,
input:focus,
.form-control:focus,
.form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem rgba(254, 60, 0, 1);
}

.btn-sm {font-family: "Manrope", sans-serif !important;}
.fs-10pt {font-size: 10pt !important}
.bg-secondary {background: #FFD6C4 !important}
.border-primary {border-color: #FE3C00 !important;}
.border-primary.border-2 {border: 2px solid #FE3C00}
.border-primary-light {border-color: #FFCBB4 !important}
.border-bottom-grey {border-bottom: 1px solid #979797}

.btn-yellow {background-color: #FFCF3F; color: #1A4738 }
.btn-bg-blue {background-color: #5471D7; color: #FFD6C4; border-radius: 2rem; border: none }
.btn-bg-blue:hover {background-color: #5471D7; color: #FFD6C4; }
/*--------------------------------------------------------------
# Sections
--------------------------------------------------------------*/
section {
  padding: 50px 0;
  overflow-x: clip;
  overflow-y: visible;
  position: relative;
}

.section-header {
  padding-bottom: 20px;
}

.section-header h2 {
  font-size: 38px;
  letter-spacing: 1px;
  margin: 0;
}

.section-header p {
  padding: 0;
  font-size: 14pt;
  color: #000;
}

.home .section-header  h2 {
    font-size: 25pt;
    letter-spacing: .5pt;
}



.section h3 {
    font-size: 24px;
    font-weight: 400;
}




/*--------------------------------------------------------------
# Disable aos animation delay on mobile devices
--------------------------------------------------------------*/
@media screen and (max-width: 768px) {
  [data-aos-delay] {
    transition-delay: 0 !important;
  }
}

/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
.header {
  transition: all 0.5s;
  z-index: 9;
  padding: 40px 0; background: #FFD6C4;
}

.header.header-scrolled {
  background: #FFD6C4;
  padding: 15px 0;
  box-shadow: 0px 2px 20px rgba(1, 41, 112, 0.1);
  z-index: 10;
}

.header .logo {
  line-height: 0;
}

.header .logo img {
  width: 190px;    
  margin-right: 6px;
}



/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/
/**
* Desktop Navigation 
*/
.navbar {
  padding: 0;
  font-family: "Manrope", sans-serif;
}

.navbar ul {
  margin: 0;
  padding: 0;
  display: flex;
  list-style: none;
  align-items: center;
}

.navbar li {
  position: relative;
}

.navbar a {
  display: flex; 
  align-items: center;
  justify-content: space-between;
  font-size: 20px;
  font-weight: 600;
  color:rgba(255,255,255,0.7);
  white-space: nowrap;
  transition: 0.3s;
    color: #FE3C00;
    margin-left: 20px;
}

.navbar a i {
  font-size: 12px;
  line-height: 0;
  margin-left: 5px;
}

.navbar a:hover, .navbar a:focus, .navbar .active, .navbar li:hover > a {
  color:#E60509 !important;
}




/**
* Mobile Navigation 
*/
.mobile-nav-toggle {
  color: #012970;
  font-size: 28px;
  cursor: pointer;
  display: none;
  line-height: 0;
  transition: 0.5s;
}

.mobile-nav-toggle.bi-x {
  color: #fff;
}

@media (max-width: 991px) {
  .mobile-nav-toggle {
    display: block;
  }
  .navbar ul {
    display: none;
  }
}

.navbar-mobile {
  position: fixed;
  overflow: hidden;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  background: #FE3C00;;
  transition: 0.3s;
}

.navbar-mobile .mobile-nav-toggle {
  position: absolute;
  top: 15px;
  right: 15px;
}

.navbar-mobile ul {
  display: block;
  position: absolute;
  top: 55px;
  right: 15px;
  bottom: 15px;
  left: 15px;
  padding: 10px 0;
  border-radius: 10px;
  overflow-y: auto;
  transition: 0.3s;
}

.navbar-mobile a {
  padding: 10px 20px;
  font-size: 15px;
  color: #fff;
}

.navbar-mobile a:hover, .navbar-mobile .active, .navbar-mobile li:hover > a {
  color: #fff;
}

.navbar-mobile .getstarted {
  margin: 15px;
}

.navbar-mobile .dropdown ul {
  position: static;
  display: none;
  margin: 10px 20px;
  padding: 10px 0;
  z-index: 99;
  opacity: 1;
  visibility: visible;
  background: none;
  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
}

.navbar-mobile .dropdown ul li {
  min-width: 200px;
}

.navbar-mobile .dropdown ul a {
  padding: 10px 20px;
}

.navbar-mobile .dropdown ul a i {
  font-size: 12px;
}

.navbar-mobile .dropdown ul a:hover, .navbar-mobile .dropdown ul .active:hover, .navbar-mobile .dropdown ul li:hover > a {
  color: #4154f1;
}

.navbar-mobile .dropdown > .dropdown-active {
  display: block;
}



/*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/
.hero {
  width: 100%; position: relative;
    margin: 0;
    padding: /*120px 0 0;*/ 0; overflow: visible;

}
.hero .container-lg {padding-left: 17%}
.hero h1 {font-size: 80px; line-height: 110%; color: #FFD6C4; text-shadow: 1px 1px 10px rgb(0, 0, 0);}
.hero h5 {font-size: 35px; line-height: 110%; color: #FFD6C4}
.hero p {font-size: 20px}
.hero .caption {position: absolute; z-index: 2; top: 0; left: 0; width: 100%;top: 45%; transform: translateY(-50%)}


@media (max-width: 768px) {
  .hero h1 {
    font-size: 35px;
  }
  .hero h5 {
    font-size: 14px;
  }

}



/*--------------------------------------------------------------
# Index Page
--------------------------------------------------------------*/
#main {margin-top: 150px}
.header .btn-primary {background: #FE3C00; border-color: #FE3C00; color: #fff; font-family: "Manrope", sans-serif;}

#vin1 {background: url("../img/vin-1.svg") no-repeat; background-size: 100%; width: 100px; height: 140px; position: absolute; bottom: -80px; left: -10px; }
#vin2 {background: #1F4838;  width: 100px; height: 100px; border-radius: 50%; position: absolute; top: -80px; right: -50px; }
#vin3 {background: #FFCF3F;  width: 100px; height: 100px; border-radius: 50%; position: absolute; bottom: -50px; left: -50px; }
#vin5 {background: url("../img/vin-2.png") no-repeat; background-size: 100%; width: 100px; height: 200px; position: absolute; top: -90px; right: 0px; z-index: 3 }
#vin6 {background: url("../img/vin-3.svg") no-repeat; background-size: 100%; width: 198px; height: 198px; position: absolute; top: -90px; left: -50px; z-index: 3 }

.bg-primary {background-color: #FE3C00 !important; box-shadow: none; }
.bg-primary-light {background: #FFD6C4;}
.bg-primary-light-light {background: rgba(255,214,196,0.4)}
.btn-primary {  border-radius: 30px; font-family: 'Gelica'; border-color: #FE3C00; color: #FE3C00; background: none}
.btn-primary.active:focus {color: #fff}
.btn-primary:focus {box-shadow: none !important; background-color: #fff;  border-color: #FE3C00; color: #FE3C00}
.btn-primary:hover {background: #FE3C00 !important; color: #fff !important; border: none}
.btn-check:active + .btn-primary, 
.btn-check:checked + .btn-primary, 
.btn-primary.active, 
.btn-primary:active, 
.show > .btn-primary.dropdown-toggle {
    background-color: #FE3C00 !important; border: none; box-shadow: none; 
}

hr.line-grey {background: #979797; border: none; height: 1px}
.border-end {border-right: 1px solid #FE3C00 !important}
.input-primary {border-radius: 30px;  border: 1px solid #FE3C00; color: #FE3C00; background: none; line-height: 1.5; padding: .375rem .75rem;}
@media (max-width: 768px) {
.input-primary {padding: .370rem .75rem}
}
.input-primary:focus {box-shadow: none !important; background-color: #fff;  border-color: #FE3C00; color: #FE3C00}

.btn-border {border:1px solid #fff; color: #fff}
.btn-border:hover {background: #fff; border:1px solid #fff; color: #000}
.text-primary {color: #FE3C00 !important;}
.text-primary-light {color: rgba(254, 60, 0, .5) !important;}
.text-primary-light a {color: rgba(254, 60, 0, .5) !important;}
.text-secondary {color: #FFD6C4 !important;}
.text-blue-lt {color: #5471D7 !important;}
.text-green {color: #1F4838}
.text-warning {color: #FFCF3F !important;}
.bg-green {background: #1F4838}
.bg-blue {background: #5471D7}
.rounded-10 {border-radius: 1rem}
.rounded-30 {border-radius: 4rem}
.fs-20 h4 {font-size: 35px; font-weight: 700}
.fs-20 p {font-size: 16pt}


.lnkserv {font-size: 30px}
.lnkserv img.img-fluid {height: 200px !important; width: auto !important}
.lnkserv span { min-width: 120px}
.lnkserv:hover span {background: #FE3C00; color: #fff; border: none }


.btn.btn-rounded {border-radius: 25px}

.swiper-contratar .card {background: none; height: 100% !important; border: 2px solid #FFD6C4; border-radius: 20px; padding: 2%}
.swiper-contratar .card .fs-1 {font-family: 'Gelica'; font-size: 90px !important; font-weight: 500}
.swiper-contratar .swiper-slide {height:auto !important}
.swiper-pagination-clickable .swiper-pagination-bullet {background: rgba(255,255,255,0.7)}
.swiper-pagination-bullet-active {background: rgba(255,255,255,1)}


.swiper-feedback .swiper-slide {height:auto !important}
.swiper-feedback .swiper-slide:nth-child(1) .card, 
.swiper-feedback .swiper-slide:nth-child(4n) .card {background: #E7431B; }
.swiper-feedback .swiper-slide:nth-child(2) .card, 
.swiper-feedback .swiper-slide:nth-child(5n) .card {background: #1F4838; }
.swiper-feedback .swiper-slide:nth-child(3) .card, 
.swiper-feedback .swiper-slide:nth-child(6n) .card {background: #5471D7; }

.swiper-feedback .swiper-slide .card {border-radius: 30px; padding: 2% 5%; color: #FFD6C4; border: none; height: 100% }
.swiper-feedback .swiper-slide .card .vin {background:url("../img/vin-sun.png") no-repeat; background-size: 100%; width: 72px; height: 72px; display: block; text-align: center;  margin: 30px auto} 

.swiper-feedback .swiper-button-prev::after {font-size: 23px !important; color: #FE3C00; left: 0}
.swiper-feedback .swiper-button-next::after {font-size: 23px !important; color: #FE3C00; right: 0}

.swiper-alianzas .swiper-slide  {background: #FFD6C4}
.swiper-alianzas .swiper-slide img {mix-blend-mode: multiply}

.accordion-flush .accordion-item {background: none !important; border-color: #FFD6C4; margin: 10px 0 }
.accordion-flush .accordion-item .accordion-button {background: none !important;  color: #FFD6C4; font-family: "Inter", sans-serif; padding: 20px 0; box-shadow: none}
.accordion-button::after {background-image: none; content: "\F279"; font-family: "Bootstrap-icons"; background-image: none !important;}
.accordion-button:focus {box-shadow: none !important; border: none !important}
.accordion-body {padding: 0}

.vermas.collapsed:before {content: "ver más"}
.vermas.collapsed span:after {content: "\F279"; font-family: "Bootstrap-icons"; display: block}
.vermas:before {content: "ver menos"}
.vermas span:after {content: "\F27C"; font-family: "Bootstrap-icons"; display: block}

.form-select {border-top: none; border-right: none; border-left: none; border-bottom: 1px solid #FE3C00; border-radius: 0; color: #FE3C00; padding-left: 0; background-color: transparent}
.form-select:focus {box-shadow: none !important; border: none !important}

.tab-sm .nav-link, 
.tab-sm .nav-link {color: #FE3C00; background-color: none; border: none; opacity: 0.4; font-size: 24px; padding: 0 15px; border-radius: 0}
.tab-sm .nav-item.show .nav-link, 
.tab-sm .nav-link.active {color: #FE3C00; background-color: none; border: none; opacity: 1; padding: 0 15px; border-radius: 0}
.tab-sm .brd-r {border-right: 1px solid #FE3C00 !important}

/*--------------------------------------------------------------
# Contact
--------------------------------------------------------------*/

body .form-control::placeholder {color: #000}

@-webkit-keyframes animate-loading {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes animate-loading {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

  #valores h4 {border-radius: 20px;
  background: #5471D7;
  display: inline-block;
  color: #FFCF3F;
  padding: 10px 20px;}


/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/

.footer a {color: #FFD6C4; margin: 10px 0}
.footer .logo {max-width: 180px; width: 100%; }

#wap {position: fixed;
  bottom: 2%;
  right: 2%;}

footer {background-image: url("../../assets/img/vin-sun.png"); background-repeat: no-repeat; background-position: -100px 50px;}
footer .rs a {display: inline-block; border-radius: 50%; width: 40px; height: 40px; background: #fff; color: #FE3C00; text-align: center; font-size: 20px; line-height: 40px}
/*--------------------------------------------------------------
# Ficha
--------------------------------------------------------------*/


#ficha {color: #FE3C00;}
#ficha input[type="text"],
#ficha input[type="date"] {color: #FE3C00; border-bottom: 1px solid #FE3C00; border-top: none; border-left: none; border-right: none; background: none; padding: 10px 0; font-size: 20px; swiper-theme-color: inherit; border-radius: 0}
#ficha input::placeholder {opacity: .6; color: #FE3C00;}
#ficha input:focus {box-shadow: none !important;}
 input[type="date"]:before {
    content: attr(placeholder) !important;
    color: #aaa;
    margin-right: 0.5em;
  }
  input[type="date"]:focus:before,
  input[type="date"]:valid:before {
    content: "dddd";
  }

.custom-radio .form-check-input {
            display: none;
        }
.custom-radio .form-check-label {font-weight: 600; font-size: 20px;}
        .custom-radio .form-check-label::before {
            content: "\F28A";
            font-family: "bootstrap-icons";
            display: inline-block;
            position: relative; top: 2px;
            margin-right: 5px; color: #FE3C00;
        }

        .custom-radio .form-check-input:checked+.form-check-label::before {
            content: "\F517"
        }
.custom-check .form-check-input {
            display: none;
        }
.custom-check .form-check-label {font-weight: 600; font-size: 20px;}
        .custom-check .form-check-label::before {
            content: "\F584";
            font-family: "bootstrap-icons";
            display: inline-block;
            position: relative; top: 2px;
            margin-right: 5px; color: #FE3C00;
        }

        .custom-check .form-check-input:checked+.form-check-label::before {
            content: "\F26C"
        }

.btn-primary.submit {background: #FE3C00; color: #fff} 
.btn-primary.submit:hover {border: 1px solid #FE3C00; } 

#ficha .form-check input {margin-left: 0; margin-right: 10px; border: 2px solid; width: 25px; height: 25px; background-image: none;}
#ficha .form-check-input:checked[type="radio"] {background: #FE3C00}
#ficha .form-check label {font-weight: 600; font-size: 20px;}

.tooltip-inner {
    background-color: #FE3C00;;
    box-shadow: 0px 0px 4px #FE3C00;;
    opacity: 1 !important;
}
.tooltip.bs-tooltip-right .tooltip-arrow::before {
    border-right-color: #FE3C00 !important;
}
.tooltip.bs-tooltip-left .tooltip-arrow::before {
    border-left-color: #FE3C00 !important;
}
.tooltip.bs-tooltip-bottom .tooltip-arrow::before {
    border-bottom-color: #FE3C00 !important;
}
.tooltip.bs-tooltip-top .tooltip-arrow::before {
    border-top-color: #FE3C00 !important;
}

.form-check input[type="radio"] {
            appearance: none;
            width: 20px;
            height: 20px;
            border: 2px solid #FE3C00;
            border-radius: 50%;
            outline: none;
            background-color: white;
            cursor: pointer;
        }
.form-check input[type="radio"]:checked {
            background-color: #FE3C00; box-shadow: none
        }
.btn-back:before {content: "\F12A"; font-family: "Bootstrap-icons"; color: #FE3C00; vertical-align: middle; margin-right: 10px}
.btn-next:after {content: "\F134"; font-family: "Bootstrap-icons"; color: #FE3C00; vertical-align: middle; margin-right: 10px}
.border-bottom-primary {border-bottom: 1px solid rgba(254, 60, 0, .8)}

.form-select {background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='red' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");}

.form-2 input {border-bottom: 1px solid #FFD6C4; border-top: none; border-right: none; border-left: none; background: none; border-radius: 0; font-size: 20px}
.form-2 input::placeholder {opacity: 1 !important; color: #FFD6C4 !important}
.form-2 input:focus {box-shadow: none !important; outline: 0;}
.form-2 .custom-check .form-check-label::before {color: inherit !important}


.lnkserv span  {font-weight: 600 }
.lnkserv.bbs span {background-color: #FE3C00; color: #fff;  }
.lnkserv.edu span{background-color: #FFCF3F; color: #1F4838; border-color: #FFCF3F }
.lnkserv.des span{background-color: #1F4838; color: #fff; border-color: #1F4838 }
.lnkserv.eve span{background-color: #5471D7; color: #FFCF3F; border-color: #5471D7 }
.lnkserv.tall span{background-color: #FE3C00; color: #FFD6C4; border-color: #FE3C00 }

.table-1 td:nth-child(odd){ font-weight: 600}
.table-1 td { padding: 5px; font-size: 14px}
.table-1 tr { border-bottom: 1px solid #FE3C00}

input[type="radio"] + label.btn-primary {opacity:.4}
input[type="radio"] + label.btn-primary:hover, 
input[type="radio"] + label.btn-primary:hover, 
input[type="radio"] + .btn-check:active + .btn-primary, 
.btn-check:checked + .btn-primary, 
input[type="radio"] + .btn-primary.active, 
input[type="radio"] + .btn-primary:active {background: none !important; color: #FE3C00; border:2px solid #FE3C00; opacity: 1; font-weight: bold}
    
 .header .ccuser.small {width: 60px; height: 60px}
 .header .ccuser.small a {margin: 0}


.disabled input:disabled {border: none; background: none; color: #FE3C00; padding: 0; font-weight: bold}

.delfile {background: rgba(255,214,196,0.57); color: #FE3C00; border: none; border-radius: 10px; display: flex; padding: 5px 10px; font-size: 12px}
.delfile .close{display: inline-block; margin-left: 10px; font-size: 12px}

.boxfile {background: rgba(255,214,196,0.57); color: #FE3C00; border: none; border-radius: 10px; position: relative; font-size: 12px; padding: 10px;}
.boxfile a.delete {position: absolute; right: 5px; top: 0px; color: #fff; font-size: 20px}
.boxfile .preview {background: #fff; border-radius: 10px; width: 100%; min-height: 50px; max-height: 100px; margin: 10px 0; overflow: hidden}

/*--------------------------------------------------------------
# Mobile
--------------------------------------------------------------*/

@media (max-width: 1000px) {
    h2 {font-size: 30px}
    h3 {font-size: 20px}
    p {font-size: 10pt;}
    .modal p {font-size: 8pt}
    #servicios .row-cols-5 > .col {width: 100%}
   .lnkserv {display: flex; align-items: center;}
   .lnkserv img.img-fluid { width: 40%}
    .lnkserv span {min-width: inherit; margin: 0 auto; width: 50%}
    .header {padding: 20px 0}
    .header.header-scrolled {padding: 30px 0 10px !important;}
    .header .logo img {width: 120px; margin-right: 0; margin: 0 auto}
    .mobile-nav-toggle.open::after {
    content: "\F479"; font-family: "Bootstrap-icons";  transform: skew(20deg, -5deg) rotate(5deg); display: block; color: #FE3C00;
  }
     .mobile-nav-toggle.close::after {
    content: "\F659";
    font-family: "Bootstrap-icons";
    color: #fff;
    transform: skew(20deg, -5deg) rotate(5deg);
    display: block;
    top: 10px;
         position: relative;}
    .header .btn-primary {font-size: 12px !important; position: relative; top: 5px;}
    #main {margin-top: 100px;}
    
    #vin2 {left: -50px;}
    #vin3 {right: -50px;}
    #vin5 {left: 0px; transform: rotate(180deg); width: 60px; height: 120px; top: -70px;}
    #vin6 {width: 68px;height: 68px;top: -40px;right: -10px; left: inherit; transform: rotate(-90deg);}
    #equipo img.iso {max-width: 200px !important}
    .fs-3 {font-size: 10pt !important}
    .fs-20 p {font-size: 10pt !important}    
    #valores h4 {border-radius: 20px;
  background: #5471D7;
  display: inline-block;
  color: #FFCF3F;
  font-size: 20px;
  padding: 10px 20px; margin-bottom: 15px}
    
    .accordion-flush .accordion-item .accordion-button {font-size: 12px}
    .accordion-flush .accordion-item p {font-size: 12px}
     footer {background-image: none}
    .footer h5 {margin: 0; font-size: 12pt;}
    .footer a {margin: 0; font-size: 10px;}
    
    .swiper-feedback .swiper-slide .card,
    .swiper-contratar .card,
    .swiper-alianzas .swiper-slide {height: inherit !important}
    
    .hero .caption {bottom: 0%}
    
    .swiper-button-next::after, .swiper-button-prev::after {font-size: 19px; }
    
}

