@import url('https://fonts.googleapis.com/css2?family=Red+Hat+Display:wght@300;400;500;600;800;900&display=swap');

.tab-texto-detalle a {
    color: #eb510d !important;
}

#imagen-con-texto img{
    width: 100%;
    height: auto;
}
#texto-sobre-fondo {
    color: #ff6600;
	 font-weight: bold;
}
#texto-sobre-fondo h1 {
    padding-top: 15px;
    line-height: 120%;
	 font-weight: bold;
	 font-size: clamp(27px, calc(2rem + 2.5vw), 66px);
}
#texto-sobre-fondo p {
	 font-size: 29px;
	 margin-top: 15px
}

#div-imagen-texto img {
	float: right;
   margin-top: 35px;
	width: clamp(100px, calc(6rem + 8vw), 200px);
}

#div-detalle {
   margin-top: 30px;
   font-family: 'Red Hat Display', sans-serif;
}
#div-detalle .slick-slider {
    margin: 22px 25px 0px;
}
#div-detalle h1 {
    font-size: 17px;
    line-height: 20px;
    font-weight: 700;
    text-align: center;
    margin: 0 0 25px;
    color: #0B002A;
}
#div-detalle h2{
	font-weight: bold;
	font-size: 23px;
	color: #3B3838;
}
#div-detalle ul {
   padding-left: 20px;
	font-size: 21px;
	color: #3B3838;
}
#div-detalle ul li:nth-child(3) {
    line-height: 10px;
}

#div-detalle .carrusel-temas-interes .contenedor-item {
    padding: 10px 10px;
    color: #0B002A;
    font-size: 16px;
    line-height: 19px;
}
#div-detalle .carrusel-temas-interes .contenedor-item .item {
    border: 1px solid #ccc;
    text-align: center;
    min-height: 115px;
    padding: 20px 10px 0;
}
#div-detalle .carrusel-temas-interes .contenedor-item h5 {
    font-size: 22px;
    line-height: 22px;
    text-align: center;
    display: inline-block;
    margin: 0 0 6px;
}
#div-detalle .carrusel-temas-interes .contenedor-item .ico {
    width: 18px;
    height: 25px;
    display: inline-block;
    margin-left: -8px;
    margin-right: 3px;
}
#div-detalle .carrusel-temas-interes .contenedor-item .ico img{
	width: 100%;
}

#div-telefono {
   color: #ff6600;
	font-style: italic;
	font-size: 28px;
   font-weight: bold;
}
#div-container-recomendaciones {
    margin: 20px auto 20px;
    text-align: center;
}
#div-container-recomendaciones ul{
    background-color: #0B002A;
}
#div-container-recomendaciones ul li{
    width: 16.66%;
    display: block;
    float: left;
}
#div-container-recomendaciones ul li a{
    padding: 0 5px;
}
#div-container-recomendaciones ul li a:hover,
#div-container-recomendaciones ul li a:focus,
#div-container-recomendaciones ul li a:active{
	font-weight: 600;
	background-color: #F2609E;
}
.carrusel-temas-interes .arrow-prev{
    position: absolute;
    top: 35%;
    left: -25px;
    cursor: pointer;
}
.carrusel-temas-interes .arrow-next{
    position: absolute;
    top: 35%;
    right: -25px;
    cursor: pointer;
}
.carrusel-temas-interes .arrow-prev img{
    width: 20px;
}
.carrusel-temas-interes .arrow-next img{
    width: 20px;
}
.div-box-recomendacion {
    display: block;
    color: #fff;
    padding: 15px 0;
    font-size: 11px;
    line-height: 13px;
    text-align: center;
}

.nav .nav-item .icono {
    margin: 0px auto;
    background-position: top center;
    background-repeat: no-repeat;
    background-size: 100%;
}

.fucsia {
    color: #F2609E;
    padding-right: 8px;
}
#div-container-tabs {
    margin-top: 20px;
    margin-bottom: 40px;
}

/*.tab-icono .icono {
    float: right;
	 margin-top: 80px;
    margin-bottom: 10px;
    width: 120px;
    height: 130px;
    float: none;
    clip-path: inset(0% 22% 0% 0%);
    margin-left: 81px;
}*/

#div-clave-centrado p {
    text-align: center; 
	 margin: 25px 45px;
}
.color-fff {
   color: #fff;
}
.color-000 {
   color: #000;
}

.tab-icono {
    background-color: #002C48;
	 padding-top: 75px;
}
.tab-icono .icono {
	 margin: 0px auto;
}
.tab-icono p {
   text-align: center; 
	margin-right: 5px;
   font-size: 22px;
   margin-top: 16px;
   color: #fff;
}

.tab-icono .icn-clave {
    background-image: url(../img/icn_clave_hover.png);
    background-size: 90%;
    background-repeat: no-repeat;
}
.tab-icono .icn-correo {
    background-image: url(../img/icn_correo_hover.png);
	 background-repeat: no-repeat;
}
.tab-icono .icn-sitio {
    background-image: url(../img/icn_sitio_hover.png);
	 background-repeat: no-repeat;
}
.tab-icono .icn-fraude {
    background-image: url(../img/icn_fraude_hover.png);
	 background-repeat: no-repeat;
}
.tab-icono .icn-qr {
    background-image: url(../img/icn_qr_hover.png);
	 background-repeat: no-repeat;
}

.extension-tab-icono {
    background-color: #3b3838;
}
#tab-correo-icono .extension-tab-icono {
    height: 339px;
}
#tab-sitio-icono .extension-tab-icono {
    height: 482px;
}
#tab-fraude-icono .extension-tab-icono {
    height: 322px;
}
#tab-texto-fraude-negro {
    margin: 40px 0;
	 padding: 30px;
	 background-color: #002C48;
	 border-left: 1px solid #fff;
	 width: 90%;
}

.tab-content #correo {
    background-color: #F7BD00;
}
.tab-content #sitio {
    background-color: #F2609E;
}
#qr,
#fraude,
#sitio,
#correo,
#clave,
#faqs {
    font-family: 'Red Hat Display', sans-serif !important;
}
#qr p,
#fraude p,
#sitio p,
#correo p,
#clave p,
#faqs p {
    font-size: 16px;
    line-height: 22px;
}
#qr h2,
#fraude h2,
#sitio h2,
#correo h2,
#clave h2,
#faqs h2 {
    margin: 0 0 20px;
    font-weight: 700;
    font-size: 20px;
    line-height: 22px;
}
#qr #tab-clave-icono,
#fraude #tab-clave-icono,
#sitio #tab-clave-icono,
#correo #tab-clave-icono,
#clave #tab-clave-icono,
#faqs #tab-faqs-icono{
	padding-left: 0;
}
#qr #tab-clave-icono img,
#fraude #tab-clave-icono img,
#sitio #tab-clave-icono img,
#correo #tab-clave-icono img,
#clave #tab-clave-icono img,
#faqs #tab-faqs-icono img{
    width: 100%;
    max-width: 310px;
    height: auto;
    margin-top: 15px;
}
#tab-texto-clave-negro {
    background-color: #002C48;
    padding: 15px 0 15px;
    width: 90%;
	 border-left: 1px solid #fff;
}
#tab-texto-clave-negro p {
    text-align: center;
    margin-bottom: 0;
	 font-size: 21px;
	 color: #fff;
}
.tab-texto-detalle {
    font-size: 21px;
}
#div-clave-bloque03 {
	 margin-top: 25px;
}
#div-clave-bloque03 p {
    margin: 10px 15px;
    font-size: 16px;
    color: #626567;
	 text-align: justify;
}
#div-clave-bloque03 ul {
    font-size: 16px;
    line-height: 20px;
    padding-left: 22px;
}
#div-clave-bloque03 ul li {
    padding-left: 10px;
    margin-bottom: 25px;
    font-size: 18px;
    line-height: 26px;
}

#fraude #div-clave-bloque03 ul li,
#sitio #div-clave-bloque03 ul li,
#correo #div-clave-bloque03 ul li {
    margin-bottom: 15px;
}

.web-sii .acordeon .panel-default>.panel-heading {
    background-color: #EDE7F6 !important;
	 color: #002C48 !important;
}
.web-sii .acordeon .panel-default>.panel-heading h4 a {
    color: #002C48 !important;
}
.web-sii #accordion h4.panel-title {
    padding-right: 25px;
}
.web-sii #accordion h4 .glyphicon {
    color: #002C48 !important;
}
#div-clave-bloque03 ul {
    padding-left: 31px;
}
#div-clave-bloque03 #accordion ul li {
    font-size: 14px;
    padding-left: 3px;
    margin-bottom: auto;
    line-height: inherit;
    color: #626567;
}

@media only screen and (max-width: 1360px) {
   #div-imagen-texto img {
       /*width: 140px;*/
       margin-top: 15px;
   }
	#texto-sobre-fondo h1 {
		 line-height: 120%;
/*		 font-size: 40px;*/
	}
	#texto-sobre-fondo p {
		 font-size: 30px;
	}
}

@media only screen and (min-width: 1199px) {
	.tab-icono .icn-clave {
		 margin-left: 15px;
	}
}
@media only screen and (max-width: 1200px) {
	.tab-icono p {
		 margin-right: 0px;
		 margin-left: 9px;
	}
	.tab-icono p {
		 margin-left: 0px;
	}
	#tab-correo-icono p {
	   font-size: 17px;
	}
}

@media only screen and (max-width: 991px) {
	.tab-icono .icono {
		 background-size: 80%;
	}
	.tab-icono p {
		 font-size: 16px;
	}
	#tab-correo-icono p {
		 font-size: 14px;
	}

   #div-imagen-texto img {
       /*width: 120px;*/
       margin-top: 0px;
   }
	#texto-sobre-fondo h1 {
		 line-height: 100%;
		 /*font-size: 37px;*/
	}
	#texto-sobre-fondo p {
		 font-size: 20px;
	}
	#div-detalle ul li:nth-child(3) {
		 line-height: 24px;
	}

	#tab-texto-clave-negro {
		 width: 100%;
		 right: 0px;
	}
	#tab-texto-clave-negro p {
		 margin: 0px auto;
	}
	#tab-texto-fraude-negro {
		 width: 100%;
		 right: 0px;
	}
}

@media only screen and (max-width: 767px) {
	#imagen-con-texto{
		margin-top: 55px;
	}
	#div-container-recomendaciones {
	    margin: 2px auto 20px;
	    text-align: center;
	}
	#div-container-recomendaciones ul li{
	    width: 100%;
	    display: block;
	}
	#encabezado {
		 margin-top: 56px;
	}
	#div-detalle h1 {
	    margin: 10px 40px;
	}
	#div-detalle h2 {
		 margin-top: 40px;
	}
	#div-telefono {
		 float: none;
		 margin-right: unset;
		 text-align: center;
	}
   #div-imagen-texto img {
       margin-top: 10px;
   }
	#texto-sobre-fondo h1 {
		 margin-top: 6px;
	}
	#texto-sobre-fondo p {
		 font-size: 17px;
       margin-top: 0px;
	}
	#div-detalle ul li:nth-child(3) {
		 line-height: 10px;
	}
	#tab-texto-clave-negro p {
	    padding: 0 30px;
	}
	#div-container-recomendaciones ul {
	    background-color: #723E72;
	}
	#div-container-recomendaciones ul li{
		border-bottom: 2px solid #fff;
	}
	
}

@media only screen and (max-width: 600px) {
	#div-detalle ul li:nth-child(3) {
		 line-height: 22px;
	}
}

@media only screen and (max-width: 540px) {
	#encabezado img {
	    display: none;
	}
	#encabezado {
		 background-color: #3B3838;
	}
}

@media only screen and (min-width: 992px) {
	.web-sii #div-container-recomendaciones .col-md-3 {
	    width: 20%;
	}
	.nav .nav-item .icono {
	    margin: 0px auto;
	    background-position: top center;
	    background-repeat: no-repeat;
	    background-size: 80%;
	    width: 80% !important;
	}
}

