p,
a,
h1,
h2,
h3,
h4,
h5,
div,
span {
  font-family: "Source Sans Pro", sans-serif !important;
}

#HeaderImage {
  background: url(/img/SupportSection/soporteban.jpg) no-repeat center center
    scroll;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  height: 100vh;
  width: 100vw;
  z-index: -1;
}

#HeaderImage h1 {
  color: #54c8d2;
  font-size: 2.8rem;
}
#HeaderImage p {
  font-size: 1.2rem;
}
.source-bold {
  font-weight: 700;
}
.fontSize1Rem {
  font-size: 1rem;
}

#keyBenefits {
  font-size: 0.9rem;
  margin-top: -4rem;
  /*background-color: white;*/
}
#shadowKeyBenefits {
  -webkit-box-shadow: 0px 11px 19px 2px rgba(0, 0, 0, 0.25);
  -moz-box-shadow: 0px 11px 19px 2px rgba(0, 0, 0, 0.25);
  box-shadow: 0px 11px 19px 2px rgba(0, 0, 0, 0.25);
}
#keyBenefits > div {
  background-color: white;
}
#supportBenefits {
  margin-top: 3rem;
}
#supportBenefits p {
  margin-top: 1rem;
}
#h2List li span {
  color: #08224c;
}
.textBlue08224c {
  color: #08224c;
}

#h2List ul {
  list-style: square;
  color: #54c8d2;
}
#supportBenefits h2 {
  color: #08224c;
}
#supportBenefits h3 {
  color: #0b417f;
}
#list2 ul {
  color: #54c8d2;
  list-style: none;
}
#list2 li span {
  color: #08224c;
}
.source-light {
  font-weight: 300;
}
#supportProcess img {
  width: 40px;
}
#supportProcess h2 {
  font-size: 1.5rem;
}
.lightBlueBackground {
  background-color: #54c8d2;
}
#supportProcess .square {
  background-color: white;
  height: 11rem;
  padding: 0.5rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  -webkit-box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.2);
}
#supporProcessSlick {
  margin: 0px auto;
  margin-top: -4rem;
}
#custDashboard img {
  -webkit-box-shadow: 6px 17px 16px 6px rgba(219, 215, 219, 0.74);
  -moz-box-shadow: 6px 17px 16px 6px rgba(219, 215, 219, 0.74);
  box-shadow: 6px 17px 16px 6px rgba(219, 215, 219, 0.74);
}
.slick-dots li button:before {
  font-size: 3rem;
}
#custDashboard h2 {
  font-size: 1.5rem;
  color: #08224c;
}
#timeResponse {
  margin-top: 5rem;
}
#timeResponse h2 {
  font-size: 1.5rem;
  margin-bottom: 2rem;
}
#supportGrupoStaff > div:first-of-type {
  background: url(/img/SupportSection/soporte.jpg) no-repeat center center
    scroll;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  height: 40vh;
  z-index: -1;
}
#supportGrupoStaff ul {
  font-size: 1.1rem;
}
#supportGrupoStaff h3 {
  color: #0b417f;
}
#supportContact {
  background-color: #eebb43;
  height: 60vh;
}
#supportContact input {
  background-color: #d3a53c;
  border-color: #d3a53c;
}
#supportContact input:focus {
  box-shadow: none;
}
#supportContact button:first-child {
  background-color: #ad8938;
  border-color: #ad8938;
}

#supportContact button {
  background-color: #0b417f;
  border-color: #0b417f;
}
#supportContact ::-webkit-input-placeholder {
  /* Edge */
  color: #ad8938;
}

#supportContact :-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: #ad8938;
}

#supportContact ::placeholder {
  color: #ad8938;
}
#supportContact p span {
  color: #08224c;
}
#supportContact p {
  font-size: 1.2rem;
}

#supportContact {
  background-color: #eebb43;
  height: 80vh;
  display: flex;
  justify-content: center;
  align-items: center;
}

.h-55-vh {
  height: 75vh;
}
.centerMargin {
  margin: 0px auto;
}

.slick-prev::before,
.slick-next::before {
  font-family: "Font Awesome 5 Free";
  font-weight: 700;
  opacity: 1;
  font-size: 2rem;
}

.slick-prev::before {
  content: "\F060";
}

.slick-next::before {
  content: "\F061";
}

.slick-prev,
.slick-next {
  background-color: #08224c !important;
  height: auto;
  width: auto;
  padding: 0.25rem;
  z-index: 9999999;
  top: auto;
  bottom: 0;
}

.slick-next {
  right: 50%;
  transform: translate(50%, -50%);
}

.slick-prev {
  left: 50%;
  transform: translate(-50%, -50%);
}

.slick-prev:hover,
.slick-next:hover {
  background-color: #31557e !important;
}

.slick-prev.slick-arrow.slick-disabled {
  visibility: hidden;
}

.slick-next.slick-arrow.slick-disabled {
  visibility: hidden;
}
.textCenter {
  text-align: center;
}
.supportPlans {
  background-color: #08224c;
}
.fontPlans {
  font-size: 0.75rem;
}
.fontConsultaPlan {
  font-size: 0.7rem !important;
}
.borders-left {
  border: 0.5px solid #2385ff;

  border-bottom: hidden;
  border-top: hidden;
}
.borders-right {
  border: 0.5px solid #2385ff;

  border-bottom: hidden;
  border-top: hidden;
  border-right: hidden;
}
.fontPlans > span {
  font-size: 2.3rem;
  color: #54c8d2;
}
.text-lightBlue {
  color: #54c8d2 !important;
}

.decoration-Line {
  text-decoration: underline;
}
#plans > div:hover > div {
  background-color: #092d63;
}
#Personalizarplan {
  background-color: #54c8d2;
  color: white;
}
#PersonalizarplanMobil {
  color: white;
  font-size: 1rem;
}

#plans a {
  border-color: white;
}
#plans a:hover {
  background-color: #54c8d2;
  cursor: pointer;
}
#plans a {
  border-radius: 0;
}
#plans ul {
  color: #54c8d2;
  list-style: none;
}
#plans span {
  color: white;
}
#plans #preferencialList {
  list-style: disc;
}
#slickLogos .slick-slider .slick-track {
  display: flex;
  align-items: center;
  justify-content: center;
}
#plansTab .nav-item:first-of-type::before {
  content: "";
  border-left: 1px solid whitesmoke;
  position: absolute;
  left: 100%;
  height: 1.4rem;
  top: 0.9rem;
  z-index: 2;
}

#plansTab .nav-item {
  position: relative;
}
#plansTab a {
  border-color: white;
}

#plansTab ul {
  color: #54c8d2;
  list-style: none;
}
#plansTab span {
  color: white;
}
#plansTab #preferencialList {
  list-style: disc;
}
#plansTab a {
  border-color: white;
}
#modalForm p {
  font-size: 1rem !important;
}
#modalForm h6 {
  font-size: 1rem;
  color: #08224c;
}
#modalForm input:focus {
  outline: none !important;
  box-shadow: none !important;
  border-color: #ced4da;
}
#modalForm input {
  background-color: #f3f0f0;
  border-color: #f3f0f0;
  font-size: 0.85rem;
}
#plansTab .nav-tabs .nav-item.show .nav-link,
#plansTab .nav-tabs .nav-link.active {
  color: white;
  background-color: #092d63;
  border-color: transparent;
}

#plansTab .nav-tabs .nav-link.active {
  color: #54c8d2;
}
#plansTab .nav-tabs .nav-link {
  border: none;
  color: white;
  background-color: #092d63;
  border-radius: 0;
}
#plansTab .nav-tabs {
  border-bottom: none;
}
/*
#ContactName::placeholder {
  color: #bebebe;
}
#InputEmail::placeholder {
  color: #bebebe;
}
#ContactPhone::placeholder {
  color: #bebebe;
}
*/
#inputModal input::placeholder {
  color: #bebebe;
}
.formatButtonSend {
  background-color: #08224c;
  font-size: 0.7rem;
  width: 6rem;
}
#buttonClose {
  position: absolute;
  right: 0;
  top: -1.8rem;
  opacity: 1;
  color: #bebebe;
  font-size: 1.5rem;
  font-weight: 100;
}

#plansTab h3 {
  font-size: 2rem;
}
#myTab {
  font-size: 1.5rem;
}
#myTab ul {
  border-right: 2rem;
  border-color: white;
  background-color: #0a2963;
}
#myTab li.nav-item {
  font-family: "Source Sans Pro";
  font-size: 1rem;
}
#plansTab p {
  font-size: 0.85rem;
}
#myTabContent li {
  font-size: 1rem;
}
#myTabContent a {
  font-size: 1rem;
}
#myTabContent p {
  font-size: 0.8rem;
}
#modalForm button {
  font-size: 0.9rem;
}
#equis {
  width: 1rem;
}

/*Media Query*/
/* movil*/
/* Large devices (ipad, 768px and up) */
@media only screen and (min-width: 768px) {
  #HeaderImage p {
    font-size: 1.5rem;
  }
  #HeaderImage h1 {
    color: #54c8d2;
    font-size: 5rem;
  }

  #supportContact p {
    font-size: 1.2rem;
  }

  #supporProcessSlick {
    margin: initial;
    margin-left: -2rem;
  }
  .textCenter {
    text-align: left;
  }
  #Personalizarplan {
    background-color: transparent;
    color: #54c8d2;
    font-size: 1.2rem;
  }
  #keyBenefits p {
    font-size: 1.25rem;
    /*background-color: white;*/
  }
  #timeResponse p {
    font-size: 1.2rem;
  }
  #supportPlans h3 {
    font-size: 2.5rem;
  }
  #supportPlans h6 {
    font-size: 1.2rem;
  }
  #supportPlans p {
    font-size: 1rem;
  }
  #supportPlans li {
    font-size: 1rem;
  }
  #supportPlans a {
    font-size: 1.2rem;
  }
  #supportContact {
    background-color: #eebb43;
    height: 60vh;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  #modalForm h6 {
    font-size: 1.5rem;
  }
  #modalForm p {
    font-size: 2rem;
  }
  #modalForm button {
    font-size: 1.2rem;
  }
  .h-55-vh {
    height: 60vh;
  }
}
/* Large devices (large laptops and desktops, 1024px and up) */
@media only screen and (min-width: 1024px) {
  #HeaderImage p {
    font-size: 2rem;
  }
  #HeaderImage h1 {
    color: #54c8d2;
    font-size: 4rem;
  }
  #keyBenefits p {
    font-size: 1rem;
    /*background-color: white;*/
  }
  #supportProcess h2 {
    font-size: 2.2rem;
  }
  #supportProcess > div > div > p {
    font-size: 1.2rem;
  }
  #supportBenefits p {
    font-size: 1.3rem;
  }
  #supportBenefits li {
    font-size: 1.3rem;
  }
  #supportProcess > div:last-of-type {
    margin-left: -6rem;
  }
  #custDashboard h2 {
    font-size: 2rem;
  }
  #borderLineParraph {
    border-left: #54c8d2;
    border-style: solid;
    border-width: 1px;
    border-top: transparent;
    border-right: transparent;
    border-bottom: transparent;
  }
  #h2List {
    border-left: #383838;
    border-style: solid;
    border-width: 1px;
    border-top: transparent;
    border-right: transparent;
    border-bottom: transparent;
  }

  #supportProcess .square {
    justify-content: center;
    align-items: flex-start;
  }

  #supportGrupoStaff p {
    margin-top: 1rem;
  }

  #supportGrupoStaff > div:first-of-type {
    height: auto;
  }
  /*arrows*/
  .h-55-vh {
    height: 50vh;
  }
  .slick-nextButton {
    right: auto;
    left: 47%;
  }
  .slick-prevButton {
    left: auto;
    right: 47%;
  }
  .slick-prevButton,
  .slick-nextButton {
    font-size: 1rem;
    line-height: 0;
    position: absolute;
    top: 50%;
    display: block;

    padding: 10px;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    cursor: pointer;
    color: transparent;
    border: none;
    outline: none;
    background: transparent;
  }
  .slick-prev,
  .slick-next {
    top: 50%;
    bottom: auto;
  }

  .slick-next {
    right: 2rem;
  }

  .slick-prev {
    left: 2rem;
  }

  #supportContact p {
    font-size: 1.6rem;
  }
  #shadowKeyBenefits p {
    font-size: 1.3rem;
  }
  #divLogos {
    -webkit-box-shadow: 0px 11px 19px 2px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0px 11px 19px 2px rgba(0, 0, 0, 0.25);
    box-shadow: 0px 11px 19px 2px rgba(0, 0, 0, 0.25);
  }
}
/* Large devices (large laptops and desktops, 1280px and up) */
@media only screen and (min-width: 1280px) {
  #HeaderImage p {
    font-size: 1.5rem;
  }
  #HeaderImage h1 {
    color: #54c8d2;
    font-size: 3.5rem;
  }

  /*#supportProcess h2 {
    font-size: 2rem;
  }*/
  #supportContact p {
    font-size: 1.5rem;
  }
  #custDashboard p {
    font-size: 1.3rem;
  }
}

/* Large devices (large laptops and desktops, 1366px and up) */

@media only screen and (min-width: 1366px) {
  #HeaderImage p {
    font-size: 2rem;
  }
  #HeaderImage h1 {
    color: #54c8d2;
    font-size: 4rem;
  }
  #keyBenefits {
    font-size: 3rem;
  }
}

/* Large devices (large laptops and desktops, 1440px and up) */

@media only screen and (min-width: 1440px) {
}
/* Extra Large devices (large laptops and desktops, 1400px and up)*/

@media only screen and (min-width: 1920px) {
}
@media all and (device-width: 1024px) and (device-height: 1366px) and (orientation: portrait) {
  .fontSize1Rem {
    font-size: 0.85rem;
  }
}
@media all and (device-width: 1024px) and (device-height: 768px) and (orientation: landscape) {
  .fontSize1Rem {
    font-size: 3rem;
  }
}