@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600&display=swap');

@font-face {
    font-family: 'Britannic Bold';
    src: url(../WEBSITE/fonts/britanic.ttf);
	font-display: swap;
}

*, *:before, *:after {
  -webkit-box-sizing: inherit;
  -moz-box-sizing: inherit;
  box-sizing: inherit;
}

html {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

body {
  font-family: 'Montserrat', sans-serif !important;
  margin: 0;
  background: #fff;
  color: #58595b;
}

hr {
  height: 2px !important;
  border: none;
  background-color: #e7e7e7;
  margin-bottom: 5px !important;
  margin-top: 5px !important;
}

a {
  text-decoration: none;
  margin: 1rem 0;
  font-weight: 600;
  font-size: 0.8125rem;
  letter-spacing: 1px;
}

.boton {
                    border: 0;
                    outline: 0;
                    cursor: pointer;
                    color: white;
                    background-color: #005496;
                    border-radius: 4px;
                    font-size: 16px;
                    font-weight: bold;
                    padding: 4px 8px;
                    display: inline-block;
                    min-height: 20px;
					margin-left: 0%;
                    transition: background-color .24s,box-shadow .24s;
					width:90%;
					letter-spacing:2px;
					text-align:center;
					padding-bottom:6px;
					padding-top:4px;
					margin-top:10px;
}
.boton:hover {
					background-color:#f37021;

}

.txt{
	  font-family: 'Montserrat', sans-serif;
}

.dto{
   font-size:1.7em;
   font-weight: 600;
}
.resumen {
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 0px;
	font-size:0.8em;
	color:#58595b;
	font-weight: 600;
}
.sector2 {
	margin: auto;
	width: 100%;
}

.top {
  text-align: center;
  margin: auto;
  
}

.formaspago {
	width: 70%;
	margin: auto;
	border: 1px solid gray;
	border-radius: 4px;
}

.formaspagotitulo {
	background-color: #f37021;
	color: white;
	padding-left: 1em;
}

.formaspagotxt {
	text-align:left;
	font-size: 0.8em;
	line-height: 1.6;
	padding: 1em;	
}


.nroejemplares {
  font-size: 1.8rem;
  font-weight: 600;
  padding-top: 1em;
  margin: 0;
}



.costo {
  color: white;
  font-size: 3em;
  font-weight: bold;
  margin: 0;
}

.caracteristicas {
  background-color: white;
  font-size: 1em;
  text-align: left;
}

.servicios {
  background-color: white;
  font-size: 1em;
  text-align: left;
}

.subtitle {
	text-align:center;
	width:100%;
	font-size:1.1em;
	color:#005496;
}
.franjaedicion {
    padding-bottom: 10px;
	padding-top: 10px;
	text-align:center;
	color:white;
	font-weight: 600;
}
.bajada {
	font-family: 'Montserrat', sans-serif;
	text-align: left;
	padding-right: 20px;
	padding-left: 20px;
	color: #58595b;
	font-size: 0.8em;
	margin: 0;
	line-height: 1.5em;
}
.resultadosubti {
	text-align:center;	
	width:100%;
	color:#005496;	
	}
.simbolo{
	width:12px;
	height:auto;	
	}
.containerpresu {
	width: auto;
	max-width: 1920px;
	margin: auto;
}

ul {
  list-style: none;
}

.promo {
	font-size: 0.9em;
	line-height: 1.3em;
}

.promoebook {
	font-size: 0.8em;
	font-style: italic;
	margin-top: 5px;
	line-height: 1.2em;
	margin-bottom: 1em;
}



/* footer */

 
 
.footercopy-social {
    float: right;
}

.footercopy-social ul {
    padding: 0;
    margin: 0;
    margin-top: 8px;
}

.footercopy-social ul li {
    display: inline-block;
}

.footercopy-social ul li a {
    color: #58595b;
    text-align: center;
}

.footercopy-social ul li a span.fa.fa-facebook {
    background: #3b5998;
}

.footercopy-social ul li a span.fa.fa-facebook:hover {
    opacity: 0.8;
}

.footercopy-social ul li a span.fa.fa-twitter {
    background: #1da1f2;
}

.footercopy-social ul li a span.fa.fa-twitter:hover {
    opacity: 0.8;
}

.footercopy-social ul li a span.fa.fa-instagram {
    background: #b928a6;
}

.footercopy-social ul li a span.fa.fa-instagram:hover {
    opacity: 0.8;
}

.footercopy-social ul li a span.fa.fa-whatsapp {
    background: #189d0e;
}
.footercopy-social ul li a span{
    height: 40px;
    width: 40px;
    line-height: 40px;
    color: #fff;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    transition: 0.5s all;
    -webkit-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -o-transition: 0.5s all;
    -ms-transition: 0.5s all;
}

.footercopy-social ul li a span.fa.fa-whatsapp:hover {
    opacity: 0.8;
}

.footercopy-social ul li:nth-child(2) {
    margin: 0 .5em;
}

.footercopy-social ul li:nth-child(3) {
    margin: 0 .5em 0 0;
}

.allah-copy {
    float: left;
}

.footercopy-social {
    float: right;
}

.container {
	width: 100%;
}

p {
  font-size: 0.9rem;
  margin: 1rem 0;
  line-height: 1.5;
  letter-spacing: 0px !important;
}

section {
  max-width: 1000px;
  margin: 0 auto;
  text-align: center;
  padding: 30px;
}


label {
  font-family: 'Montserrat', sans-serif;
  font-weight: 400 !important;
  color: #58595b;
}

select {
  font-family: 'Montserrat', sans-serif;
  font-weight: 400;
  color: #58595b;
}


h3 {
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
  color: #58595b;
  font-size: 1.825rem;
  margin: 1.3rem 0;
}

.section-lead {
  max-width: 600px;
  margin: 1rem auto 1.5rem;
}

.service a {
  color: #5b7abb;
  display: block;
}

.service h4 {
  font-family: 'Montserrat', sans-serif;
  font-weight: 600;
  color: #56ceba;
  font-size: 1.2rem !important;
  margin: 1rem 0 0.6rem;
}


.services-grid {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  max-width: 100%;
}

.service {
  max-width: 100%;
  background: #fff;
  margin: 3px;
  padding: 0px;
  border-radius: 4px;
  text-align: center;
  -webkit-box-flex: 1;
  flex: 1;
  display: -webkit-box;
  display: flex;
  flex-wrap: wrap;
  border: 2px solid #e7e7e7;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  transition: all 0.3s ease;
}


.service:hover {
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.08);
  -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.08);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.08);
}

.service i {
  font-size: 3.45rem;
  margin: 1rem 0;
}

.service0 i,
.service0 h4,
.service0 .cta {
  color: #5ac42c;
}

.service0f {
  background-color: #5ac42c;
  color: white !important;
}

.service0:hover {
  border: 2px solid #5ac42c;
}

.service1 i,
.service1 h4,
.service1 .cta {
  color: #42b7ca;
}

.service1f {
  background-color: #42b7ca;
  color: white !important;
}

.service1:hover {
  border: 2px solid #42b7ca;
}

.service2 i,
.service2 h4,
.service2 .cta {
  color: #005496;
}

.service2f {
  background-color: #005496;
  color: white !important;
}

.service2 {
  border: 2px solid #c3c3c3;
}


.service2:hover {
  border: 2px solid #005496;
}

.service3 i,
.service3 h4,
.service3 .cta {
  color: #9c42ca;
}

.service3f {
  background-color: #9c42ca;
  color: white !important;
}

.service3:hover {
  border: 2px solid #9c42ca;
}

.service4 i,
.service4 h4,
.service4 .cta {
  color: #ca4265;
}

.service4f {
  background-color: #ca4265;
  color: white !important;
}

.service4:hover {
  border: 2px solid #ca4265;
}

.service5 i,
.service5 h4,
.service5 .cta {
  color: #ca7242;
}

.service5f {
  background-color: #ca7242;
  color: white !important;
}

.service5:hover {
  border: 2px solid #ca7242;
}

.service .cta span {
  font-size: 0.6rem;
}


.service > * {
  flex: 1 1 100%;
}

.service .cta {
  align-self: flex-end;
}

.totaldto {
	width: 90%;
	margin-left: 5%;
	padding-bottom: 8px;
	padding-top: 8px;
	border-radius: 8px;
	height: 8em;
}

.totaldtocostado {
	width: 90%;
	margin-left: 5%;
	padding-bottom: 8px;
	padding-top: 8px;
	border-radius: 8px;
	height: 8em;
}

.logoSubLinea {
	text-align: right;
	font-weight: bold;
	color: #f37021;
	font-style: normal;
	display: block;
	font-size: 12px;
	letter-spacing: 2px;
	font-weight: 600;
}
.logoLinea {
	font-family: 'Britannic Bold' !important;
	font-style: normal;
	color: #005496;
	text-transform: uppercase;
	letter-spacing: 0;
	line-height: 1em;
}
.logoBox {
	float: left;
	padding: 0;
	color: #282828;
	font-weight: 600;
	letter-spacing: 1px;
	font-size: 32px;
	margin-top: 10px;
}

.meinteresa {
	margin: 0 5em 1.5em;
}


/* Default styles for desktop */
.services-grid {
  display: flex;
  justify-content: center; /* Center items horizontally */
}

.service {
  flex: 1;
}

    .responsive-image {
      width: auto;
      height: auto;
	  max-width: 90%;
    }

    /* Optional: style the container to ensure it is also responsive */
    .promociones {
      width: 90%;
      max-width: 90%; /* You can set a max-width to the container if needed */
      margin: 0 auto; /* Center the container if needed */
    }

/* Mobile styles */
@media (max-width: 1600px) {
  .services-grid {
    display: flex; /* Retain flex layout on mobile for horizontal scrolling */
    overflow-x: scroll;
    white-space: nowrap;
    justify-content: flex-start; /* Align items to the start for proper scrolling on mobile */
  }

	.aligntop {
   align-self: flex-start; /* Align specific inner divs to the top */
	}

  .service {
    box-sizing: border-box; /* Include padding and border in the width calculation */
  }
  
	.arrow {
    position: absolute;
    margin-top: -165%;
    transform: translateY(-50%);
    font-size: 24px;
    cursor: pointer;
    display: block;
    }

.totaldtocostado {
	height: 8em;
	padding-top: 2.25em;

}

.formaspago {
	width: 90%;
}
	
}

@media (min-width: 1601px) {
	.arrow {
    display: none;
    }
	
	.hideonmobile{
	display: none;
	}


}


/* Flechas */
.services-arrows {
  position: relative;
  overflow: hidden;
}

.arrow {
  position: relative;
  margin-top: -165%;
  transform: translateY(-50%);
  font-size: 24px;
  cursor: pointer;
  width: 0;
}
	
.left-arrow {
  left: 30px;
}

.right-arrow {
  right: 50px;
}

.flecha {
  border: solid orange;
  border-width: 0 6px 6px 0;
  display: inline-block;
  padding: 6px;
}

.der {
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}

.izq {
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
}