/*INTERIOR CONTACTO*/
#cont_banner_contacto { position: relative; max-width: 120em; margin: 0 auto; background-image: url(../img/contacto-back-mob.webp); background-repeat: no-repeat; background-position: center top; background-size: cover; text-align: center; padding-top: 5.5rem; padding-bottom: 15rem; margin-bottom: 2rem; }
#cont_banner_contacto h1 { color: #4C464A; line-height: normal; text-shadow: 0px 0px 20px rgba(255, 255, 255, 1); font-weight: 500; font-size: 1.1rem; } 
#contacto-cards {background-color: aliceblue; padding: 1rem 0rem 2rem 0rem;}
#contacto-column {display: flex; flex-wrap: wrap; justify-content: center;}
#txt-contacto { text-align: center; padding: 0rem 1.5rem 2rem; font-size: 0.7rem; line-height: normal;}
.IQSEC_contacto { padding: 0rem 0 2rem 0;}
.IQSEC_contacto h2 { text-align: center; font-weight: 500; padding-bottom: 2rem; color: royalblue; font-size: 1.2rem; }
#white-box {background-color: white; box-shadow: 0 2px 10px 0 rgb(29 29 29 / 14%); border-radius: 0.5rem; padding: 0.5rem 1rem; margin: 0.5rem 0; display: flex; align-items: center; line-height: normal; width: 11rem; font-size: 0.6rem; } 
#white-box img {width: 2rem; padding-right: 1.5rem;}
#white-box hr {width: auto; margin-top: 0rem; margin-bottom: 0.4rem;}
#white-box li {color: slategray;}
#white-box:hover span { color: #ff6720; }
#white-box:hover hr { border-top: 2px double #ff6720; }
#white-box:hover {
	transform : scale(1.1);
		-moz-transform : scale(1.1); /* Firefox */
		-webkit-transform : scale(1.1); /* Chrome - Safari */
		-o-transform : scale(1.1); /* Opera */
		-ms-transform : scale(1.1); /* IE9 */
	}
#white-box:hover {
	transition: 1s ease;
 		-moz-transition: 1s ease; /* Firefox */
 		-webkit-transition: 1s ease; /* Chrome - Safari */
 		-o-transition: 1s ease; /* Opera */
	}
#secMap { display: flex; align-items: center; background-color: mistyrose; margin-bottom: 3rem; }
.IQSEC_ubi { width: fit-content; }
.IQSEC_ubi h2 { text-align: center; padding-bottom: 1rem; font-weight: 500; }
#txt-contacto-ubi { text-align: center; padding: 0rem 1.5rem 0rem; font-size: 0.7rem; line-height: normal;}
.mapa-IQSEC { margin-top: 0rem; }
.cx-iqsec { display: flex; flex-wrap: wrap; justify-content: center; flex-direction: column; align-items: center;}
.cx-iqsec h2 { text-align: center; font-weight: 500; padding-bottom: 1rem; color: #2a2559;}
#txt-contacto-cx {text-align: center; font-size: 1rem; line-height: normal; margin: 1rem 0rem 0rem; overflow-wrap: break-word; width: 11rem; }
#txt-contacto-cx a {color: slategray;}
#txt-contacto-cx span { font-weight: 500;}
#titles-cx h1 { text-align: center; font-weight: 600; color: royalblue; font-size: 1rem; font-style: italic; margin-top: 1rem; line-height: 1.5rem; padding: 0 1.7rem; }
#rrss-contacto { background: linear-gradient(316deg, royalblue, black); padding: 0.2rem; margin-bottom: 2rem; margin-top: -2rem;}
#secRedes { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; }
.rrss-title { text-align: center; font-weight: 300; padding-bottom: 1rem; color: white; text-shadow: none; padding: 0.5rem 0; font-size: 0.8rem; }
.rrss-contacto { vertical-align: center; display: flex; justify-content: center; }
.rrss-contacto li { margin-right: 1rem; }
.rrss-contacto li:nth-child(5) { margin-right: 0rem; }
.rrss-contacto img { width: 1.5rem; padding: 0.3rem 0rem; }
#iconosRedes { display: flex; }
#cx-principal { background-color: ghostwhite; padding: 2rem 1rem 1rem; height: 29rem; }
#img-cx-mov img { width: 100%; border-radius: 12rem; margin-top: 3rem;} 
#buttom-cx a { border: 4px solid #2a2559; padding: 10px; background-color:#f5fafc; color: #2a2559;text-decoration: none;border-radius: 70px; font-weight: 600;font-size: 0.8rem; }
.lineCx { width: 12rem; }
.btn { text-decoration: none; padding: 1rem 3rem; font-size: 1.1rem; position: relative; margin: 2rem 0 0; border: none; background-color: royalblue; font-weight: 500; }
.btn-1 { overflow: hidden; color: white;
  -webkit-box-shadow: 0 0 0 0 rgba(143, 64, 248, 0.5), 0 0 0 0 rgba(39, 200, 255, 0.5);
          box-shadow: 0 0 0 0 rgba(143, 64, 248, 0.5), 0 0 0 0 rgba(39, 200, 255, 0.5);
  -webkit-transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
  transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  transition: transform 0.3s ease, box-shadow 0.3s ease, -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease; }
.btn-1::after { content: ""; width: 400px; height: 400px; position: absolute; top: -50px; left: -100px; background-color: royalblue;
  background-image: linear-gradient(225deg, #27d86c 0%, #26caf8 50%, #c625d0 100%); z-index: -1;
  -webkit-transition: -webkit-transform 0.5s ease;
  transition: -webkit-transform 0.5s ease;
  transition: transform 0.5s ease;
  transition: transform 0.5s ease, -webkit-transform 0.5s ease; }
.btn-1:hover {
	border: none;
  -webkit-transform: translate(0, -6px);
      -ms-transform: translate(0, -6px);
          transform: translate(0, -6px);
  -webkit-box-shadow: 10px -10px 25px 0 rgba(143, 64, 248, 0.5),  -10px 10px 25px 0 rgba(39, 200, 255, 0.5);
          box-shadow: 10px -10px 25px 0 rgba(143, 64, 248, 0.5),  -10px 10px 25px 0 rgba(39, 200, 255, 0.5); }
.btn-1:hover::after {
  -webkit-transform: rotate(150deg);
      -ms-transform: rotate(150deg);
          transform: rotate(150deg); }

/* ========================================================================== EXAMPLE Media Queries for Responsive Design. These examples override the primary ('mobile first') styles. Modify as content requires. ========================================================================== */
/* Small screens 280px */
@media screen and (min-width: 17.5em)
{
	#cont_banner_contacto { background-position-y: -1rem; padding-top: 6.5rem; padding-bottom: 21rem; }
	#cont_banner_contacto h1 { font-size: 1.5rem; }
	#cont_banner_contacto img { width: 90%; height: auto; }
	#txt-contacto-cx { width: 15rem; }
	#white-box { width: 13rem; font-size: .8rem; margin: 0.5rem 1rem; }
	#buttom-cx a { font-size: 1rem; }
	#txt-contacto { font-size: 1rem; padding: 0rem 2.5rem 2rem; }
	.rrss-title { font-size: 1rem; }
	.rrss-contacto img { width: 2rem; }
	#titles-cx h1 { font-size: 1.1rem; }
	.lineCx { width: 15rem; }
	#cx-principal { height: 32rem; }
}

/* Small screens 320px */
@media screen and (min-width: 20em)
{
	#cont_banner_contacto h1 { font-size: 2rem; }
	#txt-contacto-ubi { font-size: 1rem; } 
	#txt-contacto-cx { width: auto; }
	#white-box { width: 16rem; font-size: 1rem; }
	.IQSEC_ubi h2 { font-size: 1.1rem; }
	.cx-iqsec h2 { font-size: 1.2rem; }
	#titles-cx h1 { font-size: 1.25rem; line-height: 1.9rem; }
	.IQSEC_contacto h2 { font-size: 1.5rem; }
}

/* Small screens 360px */
@media screen and (min-width: 22.5em)
{
	#cx-principal { height: 34rem; }
}

/* Small screens 384px */
@media screen and (min-width: 24em)
{
	#cx-principal { height: 36rem; }
}

/* Small screens 411px */
@media screen and (min-width: 25.6875em)
{
}

/* Small screens 480px */
@media screen and (min-width: 30em)
{
	#cx-principal { height: 39rem; }
	#secRedes { flex-direction: column; }
}


/* Medium screens 500px */
@media screen and (min-width: 37.5em)
{
	#cont_banner_contacto { padding-top: 9.5rem; padding-bottom: 9.375em; text-align: center;background-image: url(../img/contacto-back-tablet.webp); height: 24rem; margin-bottom: 3rem; background-position-y: 7rem;}
	#cont_banner_contacto h1 { font-size: 3rem; padding-top: 1rem;}
	#cont_banner_contacto p { font-size: 1.5rem; line-height: 1.3; padding-top: 1rem;}
	#txt-contacto {font-size: 1.3rem;}
	.IQSEC_contacto h2 { font-size: 2rem;}
	#white-box { flex-direction: column; width: 15rem; height: 8rem; justify-content: center;}
	#white-box li { font-size: 1.1rem; }
	#white-box img { padding: .5rem 0rem; width: 3rem; }
	#txt-contacto-ubi { font-size: 1.2rem; }
	.mapa-IQSEC { width: 80%; }
	.cx-iqsec { justify-content: flex-start;}
	.cx-iqsec h2 { font-weight: 400; font-size: 2rem; }
	#titles-cx h1 { font-size: 2rem; line-height: 2.7rem; padding: 0 5rem;}
	.rrss-title { font-size: 1.7rem; padding-right: 2rem; }
	#cx-principal { display: flex; height: 20rem; justify-content: center; }
	#img-cx-mov img { width: 22rem; margin-right: 1.5rem; }
}

/* Medium screens 540px */
@media screen and (min-width: 33.75em)
{
	#cont_banner_contacto { background-position-y: -4rem; }
	.btn { font-size: 0.9rem; }
}

/* Medium screens 600px */
@media screen and (min-width: 37.5em)
{
	#white-box { width: 20rem; }
	#cont_banner_contacto { padding-top: 7.5rem; background-position-y: 4.5rem; }
	#cx-principal { flex-direction: column; align-items: center; height: 37rem; padding: 2rem 1rem; }
	.IQSEC_ubi h2 { font-size: 1.4rem; }
	#white-box { width: 14rem; }
}

/* Medium screens 640px */
@media screen and (min-width: 40em)
{
	#cont_banner_contacto h1 { padding-top: 0; }
	#white-box { width: 15rem; }
}

/* Medium screens 712px */
@media screen and (min-width: 44.5em)
{
	#cx-principal { padding: 1rem; }
}

/* Medium screens 768px */
@media screen and (min-width: 48em)
{
	#contacto-column { justify-content: space-evenly; }
	#txt-contacto-cx { font-size: 1.15rem; }
}

/* Medium screens 850px */
@media screen and (min-width: 53.125em)
{ 
	#cont_banner_contacto {padding-top: 11.5rem; padding-bottom: 9.375em; background-image: url(../img/img-header-contacto-hub.webp); background-size: contain; background-position-y: 4rem; height: 5rem;}
	#cont_banner_contacto h1 { font-size: 2.8rem; text-align: left; padding-left: 4rem; max-width: 40%;}
	#cont_banner_contacto p { font-size: 1.7rem;}
	#cont_banner_contacto img { width:50%; height: auto; }
	#txt-contacto { font-size: 1.2rem; }
	.IQSEC_contacto { padding: 0 0 2rem 0;}
	#white-box { padding: 0.5rem .5rem; width: 16rem; }
	.cx-iqsec h2 { padding-top: 2rem; }
	.IQSEC_ubi { width: 50%; }
	.mapa-IQSEC { margin-top: 0rem; width: 50%; }
	#titles-cx h1 { font-size: 1.6rem; margin-top: 3rem; padding: 0 4rem; }
	.rrss-title { font-size: 1.5rem; }
	#img-cx-mov img { margin-top: 2rem; } 
	#cx-principal { flex-direction: row; height: 24rem; }
	#img-cx-mov img { margin-top: 0; }
	.cx-iqsec h2 { padding-top: 0; }
	#secRedes { flex-direction: row; }
}

/* Medium screens 912px */
@media screen and (min-width: 57em)
{
	#white-box { width: 19rem; height: 9rem; }
}

/* Large screens 1024px */
@media screen and (min-width: 64em)
{
	#titles-cx h1 { font-size: 1.8rem; }
	#txt-contacto { padding: 0rem 9.5rem 2rem;}
	#contacto-column { justify-content: center; }
	#cont_banner_contacto {padding-top: 10rem; padding-bottom: 0; background-attachment: fixed; text-align: left;position: relative;padding-left: 5rem;max-width: 120em;margin: 0 auto;background-image: url(../img/img-header-contacto.webp); background-repeat: no-repeat; background-position: center top; background-size: contain; background-position-y: 2.71rem; height: 13rem; margin-bottom: 2rem;}  
	#cont_banner_contacto h1 { font-size: 2.7rem; line-height: normal; padding-top: 1rem; padding-left: 0; }
	#cont_banner_contacto p { font-size: 1.5rem; line-height: normal; padding-top: 2rem;}
	#cont_banner_contacto img { width: 30%; height: auto; }
	.IQSEC_contacto h2 { padding-bottom: 2rem; }
	#white-box { margin: 0.5rem; width: 12rem; height: 8rem; }
	#white-box li { font-size: 0.9rem; }
	.IQSEC_ubi h2 { font-size: 2rem; padding-bottom: 1rem; }
	#cx-principal { justify-content: center; height: 25rem; }
	#img-cx-mov img { width: 25rem; margin-right: 3rem; } 
	#txt-contacto-cx { font-size: 1.2rem; }
	#buttom-cx a { font-size:25px; }
	.btn { margin: 2.5rem 0 0; padding: .8rem 2.4rem; }
}

/* Large screens 1280px */
@media screen and (min-width: 80em)
{
	#white-box { width: 14rem; margin: 0.5rem 1.5rem; }
	#white-box li { font-size: 1.1rem; }
	#cx-principal { justify-content: space-evenly; }
	.btn { margin: 3rem 0 0; font-size: 1.1rem; padding: 1rem 3rem; }
}


/* Large screens 1361px */
@media screen and (min-width: 85.0625em)
{
	#cx-principal { justify-content: center; }
	#white-box { width: 16rem; height: 10rem; }
	#cont_banner_contacto { padding-bottom: 4.75rem; }
	#cont_banner_contacto h1 { font-size: 3.3rem; padding-left: 4rem; padding-top: 5rem; }
	#txt-contacto { font-size: 1.3rem; padding: 0rem 19rem 2rem; }
	#txt-contacto-ubi { font-size: 1.3rem; }
	.cx-iqsec { margin-right: 7rem; }
	#txt-contacto-cx { font-size: 1.3rem; }
}

/* Large screens 1550px */
@media screen and (min-width: 96.875em)
{
	#txt-contacto {font-size: 1.3rem; padding: 0rem 30rem 2rem;}
}