﻿@import url('https://fonts.googleapis.com/css?family=Montserrat:400,600,700|Trade+Winds&display=swap');

:root {
	--primario: #0075c9;
	--blue: #002856;
	--light-blue: #54C0E8;
	--dark-grey: #585858;
	--sombra: 0 0 13px 0 rgba(185, 185, 185, .25);
	--ser: #00B5C9;
	--leg: #37AA25;
	--cap: #D04171;
	--car: #589C9C;
	--com: #EB9713;
	--med: #C43530;
	--ipc: #F0CE00;
	--osi: #16358D;
	--tel: #3A8838;
	--pre: #5C1060;
	--des: #CA5C13;
	--seg: #0088D5;
	--enc: #8A50D2;
	--mis: #00D18F;
	--apl: #085C73;

}

.oslpcategorias {

	font-family: Roboto, Helvetica, Arial, sans-serif;
	text-decoration: none;
	list-style: none;

}


.oslpbtn:not(:disabled):not(.disabled) {
	border-radius: 16px;
	width: auto !important;
	font-weight: 700;
}

#oslpCabecera-Prestadores {
	margin-left: -8px;
	margin-top: -9px;
}


/*! =================================================*/
/*! ============= Categorias ============= */
/*! =================================================grid-template-rows: repeat(6, 1fr);*/
.oslpcategorias {
	display: grid;
	grid-template-columns: repeat(6, 1fr);

	font-weight: bold;
	gap: 30px;
	margin-bottom: 40px;
	margin-top: 35px !important;
	margin-right: 45px;
	margin-left: 45px;
	margin-bottom: 55px !important;
	margin-top: 55px !important;

}

.oslpcategoria span {
	width: 64px;
	margin-bottom: 10px;
	font-size: 59px !important;
}

.oslpcategoria {
	cursor: pointer;
	text-align: center;
	padding: 10px;
	border-radius: 30px;
	background: #fff;
	font-weight: 700;
	color: var(--primario);
	border: 2px solid transparent;
	transition: .3s ease all;
	box-shadow: 0px 3px 12px 0px #a0a0a0;
	font-size: 14px !important;
	width: 144PX;
	height: 120px !important;

}



.oslpcategoria:hover {
	box-shadow: var(--sombra);
	color: var(--dark-grey) !important;
	box-shadow: 0px 1px 5px 0px #a0a0a0;
}

.oslpcategoria :hover path {
	fill: var(--dark-grey);
	color: var(--dark-grey) !important;

}

.oslpnavbar svg {
	fill: #ffffff;
}


.oslpcategorias a:hover {
	color: var(--dark-grey) !important;
	text-decoration: none;
}


.oslpcategoria svg {
	width: 64px;

}

.oslpcategoria circle {
	fill: var(--primario);

}

.oslpcategoria :hover circle {
	fill: var(--dark-grey);

}

.oslpcategoria polygon {
	fill: var(--primario);

}

.oslpcategoria :hover polygon {
	fill: var(--dark-grey);

}



.oslpcategoria path {
	fill: var(--primario);
	transition: .3s ease all;
}

.oslpcategoria.activa {
	border: 2px solid var(--blue);
	color: #002858;
	box-shadow: 0px 3px 14px 0px #a0a0a0;

}

.oslpcategoria.activa path {
	fill: var(--primario);
}

.oslpcategoria a {
	font-size: 15px !important;
	font-weight: 700;
	color: var(--primario) !important;
}


/*! =================================================*/
/*! ============= ID DATOS ============= */
/*! =================================================*/

.oslpdatos path {

	fill: #1565c0 !important;
}

.oslpdatos a {
	color: #1565c0 !important;
}

.oslpdatos a:hover {
	color: var(--blue) !important;
}

.oslpdatos :hover path {
	fill: var(--blue) !important;

}

.oslpdatos :hover {
	color: var(--blue) !important;

}


/*! =================================================*/
/*! ============= ID INFO ============= */
/*! =================================================*/


.oslpinfo path {
	fill: var(--light-blue) !important;
}

.oslpinfo a {
	color: var(--light-blue) !important;
	box-shadow: none;
}

.oslpinfo h4 {
	color: var(--primario) !important;
	font-weight: 550;
}


.oslpinfo a:hover {
	color: var(--dark-grey) !important;
}

.oslpinfo :hover path {
	fill: var(--dark-grey) !important;

}

.oslpinfo :hover {

	color: var(--dark-grey) !important;

}


/*! =================================================*/
/*! ============= ID CONSULTA ============= */
/*! =================================================*/
.oslpconsulta path {
	fill: var(--blue) !important;
}

.oslpconsulta a {
	color: var(--blue) !important;
}

.oslpconsulta h4 {
	color: var(--primario) !important;
}


.oslpconsulta a:hover {
	color: var(--dark-grey) !important;
}

.oslpconsulta :hover path {
	fill: var(--dark-grey) !important;

}

.oslpconsulta:hover {
	box-shadow: var(--sombra);
	color: var(--dark-grey) !important;
	box-shadow: 0px 1px 5px 0px #a0a0a0;
}




/*! =================================================*/
/*! ============= Contenedor Preguntas ============= */
/*! =================================================*/
.oslpcontenedor-preguntas {
	grid-template-columns: repeat(6, 1fr);
	gap: 25px;
}

.oslpcontenedor-preguntas.activo {
	display: grid;

}



.oslpsearch {
	background-color: #1f8bbd;
	padding: 20px;
	margin: 30px;
	border-radius: 10px;
	border-collapse: separate;
	position: relative;
	border: 1px solid gray;
	border-spacing: 50px;
	color: #400040;
	position: relative;
	font-family: Roboto, Helvetica, Arial, sans-serif;
	font-size: 20;
	border: 2px solid var(--primario);


}

.oslpcontenedor-pregunta {
	background: #fff;
	padding: 25px;
	border: 2px solid transparent;
	border-radius: 10px;
	overflow: hidden;
	transition: .3s ease all;
	cursor: pointer;
	box-shadow: 0px 3px 14px 0px #a0a0a0;
	display: grid;
	justify-items: end;
	height: fit-content;
}

.oslpcontenedor-pregunta:hover {
	box-shadow: 0px 3px 14px 0px #a0a0a0;
}

.oslpcontenedor-pregunta.activa {
	border: 2px solid var(--primario);
	box-shadow: 0px 3px 14px 0px #a0a0a0;
}

/*! =================================================*/
/*! ============= Preguntas ============= */
/*! =================================================*/
.oslppregunta {
	font-weight: 700;
	font-size: 20px;
	line-height: 20px;
	display: flex;
	justify-content: space-between;
	align-items: center;

}

.oslppregunta img {
	width: 14px;
}


.oslprespuesta {
	color: #808080;
	line-height: 30px;
	max-height: 0;
	opacity: 0;
	transition: .3s ease all;
}

.oslpcontenedor-pregunta.activa .respuesta {
	opacity: 1;
	margin-top: 20px;
}

.oslpcontenedor-pregunta.activa img {
	transform: rotate(45deg);
}

/*! =================================================*/
/*! ============= Responsive Design ============= */
/*! =================================================*/

@media screen and (max-width: 1300px) {
	.oslplogoMenu {
		margin-left: 0px !important;
		height: 85px;
		margin-left: -20px !important;

	}

	.oslpcategorias {
		grid-template-columns: 1fr 1fr 1fr 1fr;
		gap: 25px;
		margin-left: 35px;
	}






}

@media screen and (max-width: 870px) {

	#web{
		display: none !important;
	}

	#oslpmobil{
		display: contents !important;
		z-index: 999;
	}

	.oslpcategoria span {
		width: 64px;
		margin-bottom:
			px;
		font-size: 35px !important;
	}

	.oslpcategorias {
		grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
		gap: 15px;
	}

	.oslpnew-label {
		right: 0px !important;
	}

	.oslpbtn-flotante {
		display: none !important;
	}

	.oslpnavbar .navbar_right {
		display: none !important;
	}


	p.oslppregunta {
		font-size: 15px;
		font-family: Roboto, Helvetica, Arial, sans-serif
	}

	p.oslprespuesta {
		font-size: 14px;
		font-family: Roboto, Helvetica, Arial, sans-serif;

	}

	.oslplogoMenu {
		height: 75px;
	}

	.oslpcategoria {
		padding: 2px;
		align-items: center;
		justify-content: center;
		border-radius: 20px;
		padding-bottom: 0px;
		margin-bottom: 0;
		font-size: 11px !important;
		padding-right: 0px;
		padding-left: 0px;
		width: 102px;
		height: 79px !important;


	}

	input {
		width: auto !important;
	}



	.oslpcategoria svg {
		width: 35px;
		height: 35px;
		margin-right: 0px;
		padding-top: 2px;
		margin-bottom: 2px;

		justify-content: center;
	}

	.oslpcategoria a {
		font-size: 12px !important;
		font-weight: 700;
		color: var(--primario);
	}

	#oslplargo {
		width: 100px !important;
		align-self: flex-start;

	}

}

@media screen and (max-width: 600px) {


	.oslpcategorias {
		grid-template-columns: 1fr 1fr 1fr 1fr;
		font-size: 12px;
		text-align: justify;
		justify-content: center;
		margin: auto 0px;

	}

	.oslpcategoria span {
		width: 64px;

		font-size: 29px !important;
	}


	.oslplogoMenu {
		margin-left: 0px !important;
		height: 50px;
		margin-left: -20px !important;

	}

	.oslpcategoria {
		border-radius: 25px;
	}

	
	#mobile{
		display: flex;
		margin-top: -10px;
	}

	.subcription {
		height: 550px;
	}
}

@media screen and (max-width: 460px) {

	.oslpbt1 {
		height: auto !important;
		width: auto !important;
	}
	.oslpcategorias {
		grid-template-columns: 1fr 1fr 1fr;
	}

	thead {
		display: none;
	}

	tr:nth-of-type(2n) {
		background-color: inherit;
	}

	tr td:first-child {
		background: #f0f0f0;
		justify-content: space-around;
		font-weight: bold;
		font-size: 1.3em;
	}

	tbody td {
		display: block;
		text-align: center;
	}

	tbody td:before {
		content: attr(data-th);
		display: block;
		text-align: center;

	}

	h2 {
		font-size: 24px !important;
		font-weight: 300 !important;
		margin-left: 5px !important;
	}

	#oslpcentral {
		margin-left: 15px !important;
		display: grid;
		font-size: 24px !important;
	}
}

#oslpmobil{
	display: none;
	color: #0075C9 !important;
}

#web{
	color: #0075C9 !important;
	display: contents;
}

/* Botones de input Portal Menu */
.oslpbt1 {
	font-family: Arial, sans-serif;
	color: #0075c9 !important;
	border: 2px solid #0075c9;
	border-top-color: rgb(0, 117, 201);
	border-top-style: solid;
	border-top-width: 2px;
	border-right-color: rgb(0, 117, 201);
	border-right-style: solid;
	border-right-width: 2px;
	border-bottom-color: rgb(0, 117, 201);
	border-bottom-style: solid;
	border-bottom-width: 2px;
	border-left-color: rgb(0, 117, 201);
	border-left-style: solid;
	border-left-width: 2px;
	border-image-source: initial;
	border-image-slice: initial;
	border-image-width: initial;
	border-image-outset: initial;
	border-image-repeat: initial;
	letter-spacing: 0.02857em;
	background-color: #ffffff !important;
	cursor: pointer !important;
	text-transform: uppercase;
	height: 30px !important;
	width: 160px !important;
	box-shadow: 1px 2px 10px 0px rgb(160 160 160)!important;
	font-weight: 600 !important;
	font-size: 12px !important;
	border-radius: 20px !important;
 align-items: center;
}


#oslpbt2 {
	font-family: Arial, sans-serif;
	background: linear-gradient(90deg, #0075c9, #54c0e8 100%) !important;
	color: white;
	cursor: pointer !important;
	margin: 2px 2px 2px 2px;
	font-size: 10pt;
	box-shadow:1px 2px 10px 0px #585858;
	font-family: Arial, sans-serif;
	font-weight: bold;
	border-radius: 20px !important;
	background-color: transparent;
	border: 0px !important;
	margin-left: 14px;
	height: 30px !important;
	width: 140px !important;
	letter-spacing: 0.02857em;
	text-transform: uppercase;
	display: flex;
    align-items: center;
	text-align: center;	
    justify-content: center;
}

#oslpbt3 {
	font-family: Arial, sans-serif;
	background: linear-gradient(90deg, #54C0E8, #0075C9 100%) !important;
	width: 200px !important;
	height: 35px;
	font-weight: 600 !important;
	font-size: 14px !important;
	box-shadow: 2px 3px 9px 2px #a0a0a0 !important;
	color: #fff !important;
	cursor: pointer !important;
	margin: 2px 2px 2px 2px;
	box-shadow: 2px 3px 9px 2px #a0a0a0 !important;
	font-family: Arial, sans-serif;
	border: 0px !important;
	border-radius: 22px !important;
	text-transform: uppercase;
	letter-spacing: 0.02857em;
}

#oslpbt2:hover {
	background-color: #002858 !important;
	box-shadow: 1px 2px 12px 0px #a0a0a0 !important;
	color: #fff !important;
	transform: translateY(-3px);
}

#oslpbt2:active {
	transform: translateY(-1px);
}

.oslpbt1:hover {
	box-shadow:  1px 2px 12px 0px rgb(160 160 160 / 63%) !important;
	transform: translateY(1px);
}

.oslpbt1:active {
	transform: translateY(-1px);
}

#oslpbt3:hover {
	background-color: #002858 !important;
	box-shadow: 4px 9px 20px var(--background) !important;
	color: #fff !important;
	transform: translateY(-3px);
}

#oslpbt3:active {
	transform: translateY(-1px);
}

.oslpsearch .oslpinputaddon__item.button {
	min-height: 48px;
	border-radius: 0 2px 2px 0;
	font-size: 16px;
	width: 6.6 em;
	max-width: 620px;


	font-size: 14px;
	touch-action: manipulation;

	text-align: center;
	padding: .375rem .75rem;
	border-radius: .25rem;
	background-color: #007bff;
	color: #fff;
	transition: background-color .15s ease-in-out;
}


#oslpbox-search {
	position: fixed;
	top: 165px;
	left: 50%;
	transform: translateX(-50%);
	width: 1200px;
	background: #fff;
	z-index: 8;
	overflow: hidden;
	display: block;
}

#oslpbox-search li a {
	display: block;
	width: 1200px;
	color: #777777;
	padding: 12px 20px;
}

#oslpbox-search li a:hover {
	background: #f3f3f3;
}

#oslpbox-search li a i {
	margin-right: 10px;
	color: #777777;
}


#oslpcover-ctn-search {
	width: 100%;
	height: 100%;
	position: fixed;
	left: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 7;
	display: none;
}


.oslpbox {
	position: relative;
	top: 50%;
	left: 60%;
	transform: translate(-30%, 10%);

}


input.oslpsrc {
	padding-left: 40px !important;
	margin: 21px auto;
	padding: 15px 22px;
	font-size: 18px;
	border-radius: 40px !important;
	color: #0075c9;
	border: 3px solid;
	background: #fff url("../img/K2BUniversalSearch.png") no-repeat 9px center;
	width: 50% !important;
	box-shadow: 0px 3px 14px 0px #a0a0a0;

}

input.src:hover {
	width: 100%;
	background-color: #fff;
	border-color: var(--primario);

}

/*p {
	font-size: 16px !important;
    display: block;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}*/

-------------tooltip---------------- svg {
	pointer-events: none;
}

.oslpnew-label {
	position: relative;
	align-content: flex-end;
	background: var(--red);
	color: #fff;
	padding: 4px 6px;
	font-size: 12px;
	text-transform: uppercase;
	top: -18px;
	right: -60px;
	border-radius: 5px;
}


#oslpnotifica {


	box-shadow: 1px 1px 8px 0px #F1A215;

	border-radius: 5px;
}

.oslpbtn-flotante {
	font-size: 16px;
	/* Cambiar el tamaño de la tipografia */
	text-transform: uppercase;
	/* Texto en mayusculas */
	font-weight: bold;
	/* Fuente en negrita o bold */
	color: #ffffff;
	/* Color del texto */
	border-radius: 8px;
	/* Borde del boton */
	letter-spacing: 2px;
	/* Espacio entre letras */
	background-color: whitesmoke;
	/* Color de fondo */
	padding: auto;
	/* Relleno del boton */
	position: fixed;
	bottom: 40px;
	right: 40px;
	transition: all 300ms ease 0ms;
	box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
	z-index: 99;
}

.oslpbtn-flotante:hover {
	background-color: var(--blue);
	/* Color de fondo al pasar el cursor */
	box-shadow: 0px 15px 20px rgba(0, 0, 0, 0.3);
	transform: translateY(-7px);
}

@media only screen and (max-width: 600px) {
	.oslpbtn-flotante {
		font-size: 14px;
		padding: 12px 20px;
		bottom: 20px;
		right: 20px;
	}
}

/* Barra Principal */




#oslplogo {
	height: 102px;
	margin-left: -65%;

}

#oslpprof {
	border-radius: 20px;
	;
}


.oslpnavbars {

	border-radius: 0px !important;
	background: #1565c0;
	width: 100%;
	height: 102px;
	padding: 0 5px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.oslpnavbar {
	padding-bottom: 20px;
	border-radius: 0px !important;
	background: #1565c0;
	width: 100%;
	height: 102px;
	padding: 0 5px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
	border: none !important;
}

.oslpnavbar .oslpnavbar_left .oslplogo a {
	font-family: 'Trade Winds';
	font-size: 20px;
}

.oslpnavbar .oslpnavbar_right {
	display: flex;
}

.oslpnavbar .oslpnavbar_right img {
	width: 40px;
}

.oslpnavbar .oslpnavbar_right .oslpicon_wrap {
	cursor: pointer;
}

.oslpnavbar .oslpnavbar_right .oslpnotifications {
	margin-right: 25px;
}

.oslpnavbar .oslpnavbar_right .oslpnotifications .oslpicon_wrap {
	font-size: 30px;
}

.oslpnavbar .oslpnavbar_right .oslpprofile,
.oslpnavbar .oslpnavbar_right .oslpnotifications {
	position: relative;
}

.oslpnavbar .oslpprofile .oslpprofile_dd,
.oslpnotification_dd {
	position: absolute;
	top: 48px;
	right: -14px;
	user-select: none;
	background: #fff;
	border: 1px solid #c7d8e2;
	width: 350px;
	height: auto;
	display: none;
	border-radius: 3px;
	box-shadow: 0px 3px 12px 0px #a0a0a0;
	border-radius: 12px;

}


.oslpnavbar .oslpprofile .oslpprofile_dd:before,
.oslpnotification_dd:before {
	content: "";
	position: absolute;
	top: -20px;
	right: 20px;
	border: 10px solid;
	border-color: transparent transparent #fff transparent;
}

.oslpnotification_dd li {
	border-bottom: 1px solid #f1f2f4;
	padding: 10px 20px;
	display: flex;
	align-items: center;
	border-radius: 12px;
}

.oslpnotification_dd li .oslpnotify_icon {
	display: flex;
}

.oslpnotification_dd li .oslpnotify_data {
	margin: 0 15px;
	width: 185px;
}

.oslpnotification_dd li .oslpnotify_data .oslptitle {
	color: #000;
	font-weight: 550;
	display: flex;
}

.oslpnotification_dd li .oslpnotify_data .oslpsub_title {
	font-size: 14px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	margin-top: 5px;
	color: #000;
}

.oslpnotification_dd li .oslpnotify_status p {
	font-size: 12px;
}



.oslpnotification_dd li.oslpshow_all {
	padding: 20px;
	display: flex;
	justify-content: center;
}

.oslpnotification_dd li.oslpshow_all p {
	font-weight: 700;
	color: #3b80f9;
	cursor: pointer;
}

.oslpnotification_dd li.oslpshow_all p:hover {
	text-decoration: underline;
}

.oslpnavbar .oslpnavbar_right .oslpprofile .oslpicon_wrap {
	display: flex;
	align-items: center;
}

.oslpnavbar .oslpnavbar_right .oslpprofile .oslpname {
	display: inline-block;
	margin: 0 10px;
	font-size: 16px;
}

.oslpnavbar .oslpnavbar_right .oslpicon_wrap:hover,
.oslpnavbar .oslpnavbar_right .oslpprofile.active .oslpicon_wrap,
.oslpnavbar .oslpnavbar_right .oslpnotifications.active .oslpicon_wrap {
	color: #fff;
}

.oslpnavbar .oslpprofile .oslpprofile_dd {
	width: 245px;
	right: 72px !important;
}

.oslpnavbar .oslpprofile .oslpprofile_dd:before {
	right: 10px;
}

.oslpnavbar .oslpprofile .oslpprofile_dd ul li {
	border-bottom: 1px solid #f1f2f4;
	right: -110px;
	border-radius: 12px;
}

.oslpnavbar .oslpprofile .oslpprofile_dd ul li a {
	display: flex;
	padding: 15px 35px;
	position: inherit;
	flex-direction: row-reverse;
	justify-content: space-between;
	align-content: stretch;
	align-items: center;
	font-weight: 520;
}

.oslpnavbar .oslpprofile .oslpprofile_dd ul li a .picon {
	display: inline-block;
	width: 30px;
}

.oslpnavbar .oslpprofile .oslpprofile_dd ul li a:hover {
	color: #3b80f9;
	background: #f0f5ff;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
	border-radius: 10px;
}

.oslpnavbar .oslpprofile .profile_dd ul li.oslpprofile_li a:hover {
	color: #3b80f9;
	background: #f0f5ff;

	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}

.oslpnavbar .oslpprofile .oslpprofile_dd ul li .oslpbtn {
	height: 32px;
	padding: 7px 10px;
	color: #fff;
	border-radius: 3px;
	cursor: pointer;
	text-align: center;
	background: #3b80f9;
	width: 125px;
	margin: 5px auto 15px;
}

.oslpnavbar .oslpprofile .oslpprofile_dd ul li .oslpbtn:hover {
	background: #6593e4;
}

.oslpnavbar .oslpprofile.active .oslpprofile_dd,
.oslpnavbar .oslpnotifications.active .oslpnotification_dd {
	display: inline-table;
}

.oslppopup {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	transition: all 0.2s ease;
	display: none;
}

.oslppopup .oslpshadow {
	width: 100%;
	height: 100%;
	background: #000;
	opacity: 0.5;
}

.oslppopup .oslpinner_popup {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: auto;
}



:root {
	--background: #1C293E;
	--color: #fff;
	--font-family: 'Open Sans';
}


#oslpcentral h2 {
	font-size: 30px !important;
}

/*Icon*/



.oslpbell-notification {

	width: 15px;
	height: 15px;
	border-radius: 50%;
	position: absolute;
	right: 0px;
	top: -2px;

	color: #fff !important;
	font-weight: 550;
	font-size: 15px;
	line-height: 1px;
	text-align: center;
	opacity: 1;

}

ul {
	display: contents;
	list-style-type: disc;
	margin-block-start: 1em;
	margin-block-end: 1em;
	margin-inline-start: 0px;
	margin-inline-end: 0px;

}


.oslpicon_wrap {
	color: #f0f0f0 !important;
}

.a * {
	pointer-events: none !important;

}

#oslpvolver {
	margin-right: 20px;
}

#oslpvolverl {
	color: var(--color);

}

#oslpvolverl a:hover {
	color: var(--blue) !important;

}


