/*--------------------------------------------------------------
# GENERAL
--------------------------------------------------------------*/
body {
  font-family: 'Montserrat', sans-serif;
  color: #444444;
}

a {
  text-decoration: none;
  color: #0880e8;
}

a:hover {
  color: #2b99f8;
  text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'Montserrat', sans-serif;
}

/*--------------------------------------------------------------
# BACK TO TOP BUTTON
--------------------------------------------------------------*/
.back-to-top {
  position: fixed;
  visibility: hidden;
  opacity: 0;
  bottom: 4% !important;
  left: 2%;
  bottom: 15px;
  z-index: 996;
  background: #1d4e89;
  width: 40px;
  height: 40px;
  border-radius: 50px;
  border-style: solid;
  border-color: #00B2CA;
  border-width: 4px;
  transition: all 0.4s;
}

.back-to-top i {
  font-size: 28px;
  color: #fff;
  line-height: 0;
}

.back-to-top:hover {
  background: #F79256;
  color: #fff;
}

.back-to-top.active {
  visibility: visible;
  opacity: 1;
}

/*--------------------------------------------------------------
# PRELOADER (BACK TO TOP BUTTON CONTAINER) 
--------------------------------------------------------------*/
#preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  overflow: hidden;
  background: #fff;
}

#preloader:before {
  content: "";
  position: fixed;
  top: calc(50% - 30px);
  left: calc(50% - 30px);
  border: 6px solid #0880e8;
  border-top-color: #bfe0fd;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  -webkit-animation: animate-preloader 1s linear infinite;
  animation: animate-preloader 1s linear infinite;
}

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

  100% {
    transform: rotate(360deg);
  }
}

@keyframes animate-preloader {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

/*--------------------------------------------------------------
# DISABLE AOS ANIMATION DELAY ON MOBILE DEVICES
--------------------------------------------------------------*/
@media screen and (max-width: 768px) {
  [data-aos-delay] {
    transition-delay: 0 !important;
  }
}

/*--------------------------------------------------------------
# TOP BAR
--------------------------------------------------------------*/
#topbar {
  height: 60px;
  padding: 0;
  font-size: 14px;
  transition: all 0.5s;
  overflow: hidden;
  color: rgba(255, 255, 255, 0.8);
  z-index: 996;
}

#topbar.topbar-scrolled {
  top: -60px;
}

#topbar .contact-info a {
  line-height: 0;
  color: rgba(255, 255, 255, 0.8);
  transition: 0.3s;
}

#topbar .contact-info a:hover {
  text-decoration: underline;
}

#topbar .contact-info i {
  color: #f6b024;
  line-height: 0;
  margin-right: 5px;
}

#topbar .contact-info .phone-icon {
  margin-left: 15px;
}

#topbar .cta {
  background: transparent;
}

#topbar .cta a {
  color: #fff;
  background: #f6b024;
  padding: 6px 24px 8px 24px;
  display: inline-block;
  transition: 0.3s;
  border-radius: 50px;
}

#topbar .cta a:hover {
  background: #f1a40a;
}

/*--------------------------------------------------------------
# HEADER
--------------------------------------------------------------*/
.header-Fix {
  background: rgba(5, 87, 158, 0.9) !important;
  top: 0 !important;
}

#header {
  background: rgba(29, 78, 137);
  transition: all 0.5s;
  z-index: 997;
  height: 70px;
  top: 0px;
}

#header.header-scrolled {
  background: #fff;
  top: 0px;
}

#header .logo {
  font-size: 18px;
  margin: 0;
  padding: 0;
  line-height: 1;
  font-weight: bold;
  letter-spacing: 2px;
  text-transform: uppercase;
}

#header .logo a {
  color: #fff;
}

#header .logo img {
  max-height: 120px;
}

#logoCompany {
  min-width: 238px;
  max-height: 238px;
}

.header-inner-pages {
  background: rgba(5, 87, 158, 0.9) !important;
}

.topbar-inner-pages {
  background: rgba(6, 98, 178, 0.9) !important;
}

/*--------------------------------------------------------------
# NAVIGATION MENU
--------------------------------------------------------------*/
/*------------------------
* DESKTOP NAVIGATION 
------------------------*/
.navbar {
  font-family: 'Montserrat', sans-serif;
  padding: 0;
}

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

.navbar li {
  position: relative;
}

.navbar>ul>li {
  position: relative;
  white-space: nowrap;
  padding: 7% 0% 0% 15% !important;
}

.navbar a,
.navbar a:focus {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 3px;
  font-size: 18px;
  color: rgba(255, 255, 255, 0.7);
  white-space: nowrap;
  transition: 0.3s;
  position: relative;
}

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

.navbar>ul>li>a:hover {
  color: #F79256 !important;
  transition: ease-out 0.3s;
}

.navbar a:hover:before,
.navbar li:hover>a:before,
.navbar .active:before {
  visibility: visible;
  width: 100%;
}

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

.navbar .dropdown ul {
  display: block;
  position: absolute;
  left: 14px;
  top: calc(100% + 30px);
  margin: 0;
  padding: 10px 0;
  z-index: 99;
  opacity: 0;
  visibility: hidden;
  background: #fff;
  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
  transition: 0.3s;
  border-radius: 8px;
}

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

.navbar .dropdown ul a {
  padding: 10px 20px;
  font-size: 14px;
  font-weight: 500;
  text-transform: none;
  color: #032e54;
}

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

.navbar .dropdown ul a:hover,
.navbar .dropdown ul .active:hover,
.navbar .dropdown ul li:hover>a {
  color: #0880e8;
}

.navbar .dropdown:hover>ul {
  opacity: 1;
  top: 100%;
  visibility: visible;
}

.navbar .dropdown .dropdown ul {
  top: 0;
  left: calc(100% - 30px);
  visibility: hidden;
}

.navbar .dropdown .dropdown:hover>ul {
  opacity: 1;
  top: 0;
  left: 100%;
  visibility: visible;
}

@media (max-width: 1366px) {
  .navbar .dropdown .dropdown ul {
    left: -90%;
  }

  .navbar .dropdown .dropdown:hover>ul {
    left: -100%;
  }
}

/*------------------------
* MOBILE NAVIGATION 
------------------------*/
.bi-list-b {
  color: #1D4E89 !important;
}

.mobile-nav-toggle-b {
  color: #1D4E89 !important;
  font-size: 28px;
  cursor: pointer;
  display: none;
  line-height: 0;
  transition: 0.5s;
}

.mobile-nav-toggle {
  color: rgb(255, 255, 255);
  font-size: 28px;
  cursor: pointer;
  display: none;
  line-height: 0;
  transition: 0.5s;
}

.mobile-nav-toggle.bi-x {
  color: rgb(255, 255, 255);
}

/*Highest px to show the hamburger button by default*/
@media (max-width: 150000px) {
  .mobile-nav-toggle {
    display: block;
  }

  .navbar ul {
    display: none;
  }
}

.navbar-mobile {
  position: fixed;
  overflow: hidden;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  margin-left: 0 !important;
  background: rgba(5, 74, 133, 0.9);
  transition: 0.3s;
  z-index: 999;
}

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

.mobile-nav-toggle:hover {
  color: #F79256 !important;
}

.navbar-mobile ul {
  display: block;
  position: absolute;
  top: 10%;
  right: 3%;
  bottom: 20%;
  left: 3%;
  padding: 10px 38% 0 38%;
  border-radius: 10px;
  border-style: solid;
  border-width: 2px;
  border-color: #F79256;
  background-color: #fff;
  overflow-y: auto;
  transition: 0.3s;
}

.navbar-mobile>ul>li>a>i {
  font-size: 24px;
}

.navbar-mobile>ul>li>a:hover {
  color: #F79256;
}

.navbar-mobile>ul>li>a>i:hover {
  font-size: xx-large;
  transition: ease-out 0.3s;
}

.navbar-mobile>ul>li {
  margin-top: 10%;
  padding: 0;
}

.navbar-mobile a,
.navbar-mobile a:focus {
  padding: 10px 20px !important;
  font-size: 14px;
  font-weight: 500 !important;
  color: #1D4E89 !important;
  justify-content: center !important;
}

.navbar-mobile a:hover:before,
.navbar-mobile li:hover>a:before,
.navbar-mobile .active:before {
  visibility: hidden;
}

.navbar-mobile a:hover,
.navbar-mobile .active,
.navbar-mobile li:hover>a {
  color: #fff;
  font-size: 130% !important;
  font-weight: 500 !important;
}

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

.navbar-mobile .dropdown ul {
  position: static;
  display: none;
  margin: 10px 20px;
  padding: 10px 0;
  z-index: 99;
  opacity: 1;
  visibility: visible;
  background: #fff;
  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: #f6b024;
}

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

#nav-social-buttons-container {
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

/*--------------------------------------------------------------
# DEFAULT BACKGROUND
--------------------------------------------------------------*/
#about,
#gallery,
#contact {
  background-color: #f1f8ff !important;
}

/*--------------------------------------------------------------
# MAIN CAROUSEL/SLIDER INDEX PAGE
--------------------------------------------------------------*/

/* POSITION CONFIGURATIONS*/
#mainCarousel{
  padding-top: 0%;
}

.main-c-inner{
  height: 100vh !important;
}

.main-c-indicators{
 top: 82vh !important;
}

.main-c-caption{
  padding-top: 0% !important;
  top: 85vh !important;
}

/*TITLE AND DESCRIPTION*/
.carousel-title{
  font-family: 'Montserrat', sans-serif;
  font-size: 16px;
}

.carousel-description{
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
}

/*SET IMAGE SIZE*/
.custome-size-img {
  width: 1920px;
  height: 768px;
}
/* THE NEXT 3 RULES WORKS FOR THE TWO SLIDERS MAIN/COLLECTIONS */

/*DEFAULT - Customized arrow left and right*/
.carousel .carousel-control-prev-icon {
  background-image: url('../img/slider-arrows/FLECHA-IZQ-AZUL.svg');
}

.carousel .carousel-control-next-icon {
  background-image: url('../img/slider-arrows/FLECHA-DERECHA-AZUL.svg');
}

/*SIZE - Customized arrow left and right*/
.carousel-control-next-icon,
.carousel-control-prev-icon {
  width: 2rem;
  height: 2rem;
}

/*THE NEXT 2 RULES ARE WORKING WITH JQUERY
  HOVER - Customized arrow left and right 
  .carousel:hover, .carousel-control-prev-icon:hover {
    background-image: url('../img/slider-arrows/FLECHA-IZQ-NARANJA.svg');
  }
  .carousel:hover, .carousel-control-next-icon:hover {
    background-image: url('../img/slider-arrows/FLECHA-DERECHA-NARANJA.svg');
  }
  */

/*--------------------------------------------------------------
# CAROUSEL/SLIDER COLLECTIONS SECTION
--------------------------------------------------------------*/
.remove-padding {
  padding: 0%;
  max-height: 440px;
  min-height: 440px;
}

.img-month-collection {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.team-thumb {
  background: var(--white-color);
  position: absolute;
  bottom: 0;
  right: 0;
  width: 65%;
  padding: 22px 32px 32px 32px;
}

#myCarousel {
  padding: 0%;
}

.polos-opuestos-blue {
  background-color: #1D4E89;
}
.polos-opuestos-blue-text {
  color: #1D4E89;
}

/*--------------------------------------------------------------
# DEFAULT BUTTON - POLOS OPUESTOS
--------------------------------------------------------------*/
.btn-default {
  font-weight: 500;
  font-size: 14px;
  letter-spacing: 1px;
  display: inline-block;
  padding: 12px 32px;
  border-radius: 50px;
  transition: 0.5s;
  line-height: 1;
  margin: 10px;
  color: #444444;
  -webkit-animation-delay: 0.8s;
  animation-delay: 0.8s;
  background-color: white;
  border: 2px solid white;
}

.btn-default:hover {
  background: #F79256;
  color: #fff;
  text-decoration: none;
}

.btn-default-inverted {
  font-weight: 500;
  font-size: 14px;
  letter-spacing: 1px;
  display: inline-block;
  padding: 12px 32px;
  border-radius: 50px;
  transition: 0.5s;
  line-height: 1;
  margin: 10px;
  color: #fff;
  -webkit-animation-delay: 0.8s;
  animation-delay: 0.8s;
  background-color: #1D4E89;
  border: 2px solid #00B2CA;
}

.btn-default-inverted:hover {
  background: #F79256;
  color: #fff;
  text-decoration: none;
}

/*--------------------------------------------------------------
# GENERAL SECTIONS
--------------------------------------------------------------*/
section {
  padding: 60px 0;
  overflow: hidden;
}

.section-bg {
  background-color: #f1f8ff;
}

.section-title {
  text-align: center;
  padding-bottom: 30px;
  padding-top: 30px;
}

.section-title h2 {
  font-size: 32px;
  font-weight: bold;
  text-transform: uppercase;
  margin-bottom: 20px;
  padding-bottom: 0;
  color: #F79256;
}

.section-title p {
  margin-bottom: 0;
  font-style: italic;
}

.section-title-left h2 {
  text-align: left;
}

/*--------------------------------------------------------------
# ABOUT
--------------------------------------------------------------*/
.about {
  margin-top: auto;
  padding: 0;
  /* background: url("../img/1.jpg") top center no-repeat; */
  position: relative;
}

.about:before {
  content: "";
  background: rgba(255, 255, 255, 0.75);
  position: absolute;
  bottom: 0;
  top: 0;
  left: 0;
  right: 0;
}

.about-first {
  background-color: red;
  min-height: 50vh !important;
  max-height: 50vh !important;
  min-width: 100%;
}

.about-second {
  margin-bottom: 15%;
}

.about-second h5 {
  margin-top: 8%;
  font-weight: bold;
  color: #F79256;
}

@media (max-width: 988px) {
  .about-second {
    display: block;
    align-items: center;
  }

  .about-second .col-5 {
    margin-bottom: 10% !important;
  }
}

.img-team {
  max-height: 10% !important;
  min-width: 100% !important;
  max-height: 60% !important;
}

.about .container {
  position: relative;
}

.about .content h3 {
  font-weight: 600;
  font-size: 26px;
}

.about .content ul {
  list-style: none;
  padding: 0;
}

.about .content ul li {
  padding-left: 28px;
  position: relative;
}

.about .content ul li+li {
  margin-top: 10px;
}

.about .content ul i {
  position: absolute;
  left: 0;
  top: 2px;
  font-size: 20px;
  color: #0880e8;
  line-height: 1;
}

.about .content p:last-child {
  margin-bottom: 0;
}

.about .content .btn-learn-more {
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
  font-size: 14px;
  letter-spacing: 1px;
  display: inline-block;
  padding: 12px 32px;
  border-radius: 5px;
  transition: 0.3s;
  line-height: 1;
  color: #0880e8;
  -webkit-animation-delay: 0.8s;
  animation-delay: 0.8s;
  margin-top: 6px;
  border: 2px solid #0880e8;
}

.about .content .btn-learn-more:hover {
  background: #0880e8;
  color: #fff;
  text-decoration: none;
}

@media (max-width: 992px) {
  .about {
    padding: 60px 0;
  }
}

.text-about {
  text-align: justify;
  font-style: normal !important;
  color: #1D4E89;
}

/*--------------------------------------------------------------
# SERVICES
--------------------------------------------------------------*/
.service-contact-section{
  padding-top: 0% !important;
  padding-bottom: 0% !important;
}

.bd-placeholder-img {
  font-size: 1.125rem;
  text-anchor: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

@media (min-width: 768px) {
  .bd-placeholder-img-lg {
    font-size: 3.5rem;
  }
}

.text-service-bulletin {
  font-family: 'Montserrat', sans-serif;
  color: #1D4E89;
}

/*--------------------------------------------------------------
# CONTACT
--------------------------------------------------------------*/

#socialGallery a,
#socialGallery>.socialToolBox {
  display: flex;
  color: #fff;
  font-size: 26px;
  padding: 5px;
  background-color: transparent;
  width: 100px;
  height: 35px;
  line-height: 80px;
  border-radius: 50%;
}

#socialGallery {
  display: flex;
  align-items: center;
  justify-content: center;
}

#socialGallery a {
  visibility: visible !important;
  margin: 5px 2px;
  background-color: rgba(0, 0, 0, 0.6);
  position: relative;
  top: 10px;
}

#socialGallery a>span {
  padding-top: 0%;
  margin: 0;
  top: 4px;
  left: 4px;
  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
}

.social-buttons-contact {
  background-color: #1D4E89 !important;
}

.social-buttons-contact:hover {
  color: #F79256 !important;
  transition: 0.3s !important;
}

/*--------------------------------------------------------------
# SUBSCRIBE FORM
--------------------------------------------------------------*/
#modal-main-container-custome{
  height: 85vh;
}


#modal-body-custome{
  padding-left: 80px;
  padding-right: 80px;
  padding-bottom: 0px;
}

@media (max-width: 461px) {
  #modal-body-custome {
    height: 85vh;
    padding-left: 45px;
    padding-right: 45px;
    padding-bottom: 0px;
  }
}

@media (max-width: 406px) {
  #modal-body-custome {
    height: 85vh;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 0px;
  }
}

@media (max-width: 366px) {
  #modal-body-custome {
    height: 90vh;
    padding-left: 2px;
    padding-right: 2px;
    padding-bottom: 0px;
  }
}

#iframe-container{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 355px;
  height: 520px;
}

#close-modal-custome{
  color: #1D4E89 !important;
}
#close-modal-custome:hover{
  color: #F79256 !important;
}

/*--------------------------------------------------------------
# BLOG
--------------------------------------------------------------*/

.category-general{
  color: #F79256;
}

.blog-thumbnail{
  max-width: 200px !important;
  max-height: 250px !important;
}

@media (min-width: 1375) {
  .movile-blog-thumbnail {
    max-height: 100% !important;
  }
}


/*--------------------------------------------------------------
# FOOTER
--------------------------------------------------------------*/
#footer {
  background-color: #00B2CA;
}

.btn-footer {
  font-size: 24px;
  display: inline-block;
  /* background: #fff; */
  color: #fff;
  line-height: 1;
  padding: 15px 0;
  margin-right: 15px;
  border-radius: 50%;
  margin-bottom: 10%;
  text-align: center;
  width: 36px;
  height: 36px;
  transition: 0.3s;
}

.btn-footer:hover {
  color: #1D4E89 !important;
}

.btn-footer-contact {
  margin-right: 2%;
}

.copyright {
  background-color: #1D4E89;
  color: white;
}
/*---------------------------------------
#  SOCIAL BUTTOS - CONTACT SECTION              
-----------------------------------------*/
#whatsAppButton {
  z-index: 100;
  position: fixed;
  bottom: 2%;
  right: 2%;
  /* background-color: #25d366; */
  color: white;
  padding: 0.5%;
}

#icon-message {
  width: 80px;
  height: 80px;
}

@media (max-width: 1024px) {
  #icon-message {
    width: 65px;
    height: 65px;
  }
}

@media (max-width: 405px) {
  #icon-message {
    width: 55px;
    height: 55px;
  }
}

#whatsAppButton:hover {
  transition: 0.5s;
  color: white;
}

/*--------------------------------------------------------------
# SOCIAL BUTTONS (WHITE)
--------------------------------------------------------------*/
.social-buttons {
  font-size: 24px;
  display: inline-block;
  /* background: #fff; */
  color: #fff;
  line-height: 1;
  padding: 15px 0;
  margin-right: 15px;
  border-radius: 50%;
  margin-bottom: 10%;
  text-align: center;
  width: 36px;
  height: 36px;
  transition: 0.3s;
}

.social-buttons:hover {
  color: #F79256;
}

@media (max-width: 560px) {
  .social-buttons {
    display: none;
  }
}

/*--------------------------------------------------------------
# SOCIAL BUTTONS-B (BLACK)
--------------------------------------------------------------*/
.social-buttons-b {
  font-size: 24px;
  display: inline-block;
  /* background: transparent !important; */
  color: #1D4E89 !important;
  line-height: 1;
  padding: 15px 0;
  margin-right: 15px;
  border-radius: 50%;
  text-align: center;
  width: 36px;
  height: 36px;
  transition: 0.3s;
}

.social-buttons-b:hover {
  color: #F79256 !important;
}

@media (max-width: 560px) {
  .social-buttons-b {
    display: none !important;
  }
}

/*--------------------------------------------------------------
# Page transition effect
--------------------------------------------------------------*/
.loading-screen {
  position: relative;
  padding-left: 0;
  padding-right: 0;
  padding-top: 0;
  background-color: #0880e8;
  ;
  width: 0%;
  height: 100%;
}

.load-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  z-index: 999;
  pointer-events: none;
}

/*--------------------------------------------------------------
# WRAPPER FOR TRASITIONS
--------------------------------------------------------------*/
.wrapper {
  display: inline-flex;
  margin-top: 15%;
}

.wrapper .icon {
  margin: 0 20px;
  text-align: center;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  position: relative;
  z-index: 2;
  transition: 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  animation: bounce 4s 1s 1s 2 normal forwards;
}

.myBounce {
  animation: bounce 4s 1s 1s 2 normal forwards;
}

.wrapper .icon span {
  display: block;
  height: 80px;
  width: 80px;
  background: #fff;
  border-radius: 50%;
  position: relative;
  z-index: 2;
  box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.1);
  transition: 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.wrapper .icon span i {
  line-height: 80px;
  font-size: 30px;
}

.wrapper .icon .tooltip {
  position: absolute;
  top: 0;
  z-index: 1;
  background: #fff;
  color: #fff;
  padding: 10px 18px;
  font-size: 20px;
  font-weight: 500;
  border-radius: 25px;
  opacity: 0;
  pointer-events: none;
  box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.1);
  transition: 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.wrapper .icon:hover .tooltip {
  top: -70px;
  opacity: 1;
  pointer-events: auto;
}

.icon .tooltip:before {
  position: absolute;
  content: "";
  height: 15px;
  width: 15px;
  background: #fff;
  left: 50%;
  bottom: -6px;
  transform: translateX(-50%) rotate(45deg);
  transition: 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.wrapper .icon:hover span {
  color: #fff;
}

.wrapper .icon:hover span,
.wrapper .icon:hover .tooltip {
  text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.4);
}

.wrapper .whatsApp-button:hover span,
.wrapper .whatsApp-button:hover .tooltip,
.wrapper .whatsApp-button:hover .tooltip:before {
  background: #25d366;
}

.wrapper .email-button:hover span,
.wrapper .email-button:hover .tooltip,
.wrapper .email-button:hover .tooltip:before {
  background: #05579e;
}