@import url(https://fonts.googleapis.com/css?family=Rubik:300,400);
#headerUser,
#logout #icon,
.cornerUserSection .userSectionData span,
.fontLarge,
.fontMedium,
.uppercase,
body,
html {
	font-family: Rubik, sans-serif
}

#mobileFooter div a:hover,
.sapMPageFooter .sapMBarMiddle .sapMBarContainer.sapMBarPH #webFooter div a:hover,
.webLinkBox a {
	text-decoration: none!important
}

body,
html {
	font-size: 15px
}

@media (max-width:780px) {
	body,
	html {
		font-size: 16px!important
	}
}

@media (min-width:781px) and (max-width:1400px) {
	body,
	html {
		font-size: 14px!important
	}
}

/*@media (min-width:1401px) {
	body,
	html {
		font-size: 18px!important
	}
}*/


.uppercase {
	text-transform: uppercase
}

.fontMedium {
	font-size: 1rem !important
}

.fontLarge {
	font-size: 2.8rem
}

.fontWhite {
	color: #fff !important
}

.raimbowBackground {
	background: -webkit-linear-gradient(left, #009FB5, #1D4B96, #95358C, #EC1946);
	background: -moz-linear-gradient(left, #009FB5, #1D4B96, #95358C, #EC1946);
	background: -ms-linear-gradient(left, #009FB5, #1D4B96, #95358C, #EC1946);
	background: -o-linear-gradient(left, #009FB5, #1D4B96, #95358C, #EC1946);
	background: linear-gradient(left, #009FB5, #1D4B96, #95358C, #EC1946)
}

footer:before{}

.imageHeaderCornerMobile,
.imageStripMobile {
	background-repeat: no-repeat;
	background-position: center;
	background-attachment: initial
}

.sapMShellBrandingBar {
	background-color: transparent
}

#corner {
	width: 100%;
	max-width: 540px;
	padding: 0 0 50px;
	max-height: none
}

#corner .cornerContainer {
	margin: 0!important;
	padding: 20px 0 30px 50px
}

@media (max-width:780px) {
	#corner .cornerContainer {
		padding: 15px 0 30px 20px
	}
	#corner .cornerContainer #usuario {
		margin-top: 20px
	}
	#corner .cornerContainer #usuario #logo {
		border-radius: 10px;
		margin-right: 15px
	}
	#corner .cornerContainer #usuario #datos_usuario .sapMText {
		color: #084B8A !important
	}
}

@media (max-width:1360px) {
	#corner .cornerContainer {
		padding: 10px 0 50px 50px
	}
}

@media (max-width:780px) {
	#corner {
		padding: 0;
		min-height: 280px
	}
}

@media (max-width:1360px) {
	#corner {
		max-width: 460px;
		padding: 0 0 20px
	}
}

.enapLogo {
	width: 100%;
	max-width: 220px
}

.customerPortal {
	text-align: left;
	font-weight: 100;
	font-size: 2.2rem
}

@media (max-width:780px) {
	.customerPortal {
		font-size: 1.7rem;
		margin-top: 10px!important
	}
}

@media (max-width:1360px) {
	.customerPortal {
		margin: 5px 0 0!important
	}
}

.cornerUserSection {
	margin-top: 25px
}

@media (max-width:1360px) {
	.cornerUserSection {
		margin-top: 15px
	}
}

.cornerUserSection .userSectionLogo {
	margin: 0;
	border-radius: 20%;
	padding: 3px
}

.cornerUserSection .userSectionData {
	margin: 0 0 0 15px
}

.cornerUserSection .userSectionData span {
	font-weight: 400;
	color: #fff;
	font-size: 1.2rem
}

#logout #icon,
#logout a {
	color: #fff!important
}

#logout #icon {
	font-size: 13px;
	margin: 5px
}

.dialogCustom {
	width: 90%
}

.dialogCustom .sapMBtnIcon {
	color: #828282!important
}

header {
	background-color: #FFF!important
}

#headerBar {
	height: 100%;
	color: #fff!important;
	position: relative
}

#headerBar>div,
#headerLogout {
	position: absolute
}

#headerBar2 {
	right: 15%;
	top: -5px;
	max-width: 100%
}

@media (max-width:480px) {
	#headerBar2 {
		max-width: 220px
	}
	#headerBar2>div {
		max-width: 100%
	}
}

@media (max-width:375px) {
	#headerBar2 {
		max-width: 150px
	}
}

#headerBar3 {
	right: 15%;
	bottom: -10px
}

#headerBar4 {
	right: 0
}

#headerBarLogo {
	height: 35px;
	padding: 7px 0
}

#headerIcon:before {
	color: #333;
	font-size: .8rem
}

#headerUser {
	line-height: 1rem;
	color: #333!important;
	font-size: .9rem;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap
}

#headerLogout {
	right: 20%;
	bottom: -10px;
	font-size: .8rem
}

#headerBar3 a {
	color: #333!important;
	padding: 0 0 0 5px
}

#headerLogo {
	height: 40px;
	border-radius: 25%;
	padding: 5px 0
}

.mobileBorderTitle {
	height: 50px!important;
	padding: 0 20px
}

.mobileBorderTitle>div {
	display: flex;
	align-items: center
}

.mobileBorderTitle>div span {
	margin: 0!important
}

@media (max-width:780px) {
	.mobileBorderTitle .customerPortalMobile {
		font-size: 1.6rem
	}
}

.imageStripMobile {
	height: 80%;
	flex: 1;
	width: 100%;
	background-image: url(../img/carousel/carousel_1.jpg);
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover
}

.imageHeaderCornerMobile {
	height: 200px;
	width: 400px;
	background-image: url(../img/header_corner.png);
	opacity: .9;
	filter: alpha(opacity=90);
	-webkit-background-size: 100% 100%;
	-moz-background-size: 100% 100%;
	-o-background-size: 100% 100%;
	background-size: 100% 100%;
	position: absolute;
	top: 0;
	left: 0
}

.imageHeaderCornerMobile .sapMLnk,
.imageHeaderCornerMobile .sapMLnk:visited,
.imageHeaderCornerWeb .sapMLnk:focus {
	color: #fff
}

.enapBorderMobile {
	background-image: -webkit-linear-gradient(left, #009FB5, #1D4B96, #95358C, #EC1946);
	background-image: -moz-linear-gradient(left, #009FB5, #1D4B96, #95358C, #EC1946);
	background-image: -ms-linear-gradient(left, #009FB5, #1D4B96, #95358C, #EC1946);
	background-image: -o-linear-gradient(left, #009FB5, #1D4B96, #95358C, #EC1946);
	background-image: linear-gradient(left, #009FB5, #1D4B96, #95358C, #EC1946);
	height: 2%
}

.mobileLinkBox {
	background: #F6F6F6;
	padding: .5rem 2rem;
	margin: .5rem 0
}

.mobileLinkBox .sapMLnk,
.mobileLinkBox .sapMLnk:focus,
.mobileLinkBox .sapMLnk:visited {
	color: #818A91
}

#mobileFooter {
	width: 100%
}

#mobileFooter div {
	margin: auto
}

#mobileFooter div a {
	color: #97358B;
	font-size: .7rem
}

@media (max-width:320px) {
	#mobileFooter div a {
		letter-spacing: -.5px
	}
}

#tabBar .sapMITBArrowScroll {
	display: none
}

#tabBar .sapMITBScrollContainer {
	margin: 0
}

#tabBar .sapMITBScrollContainer .sapMITBHead {
	width: 100%;
	display: flex
}

#tabBar .sapMITBFilter {
	margin: auto;
	flex: 1;
	padding: 0!important
}

#tabBar .sapMITBFilter .sapMITBTab {
	margin: 0 auto
}

#tabBar .sapMITBFilter .sapMITBText {
	margin: 0 auto;
	text-transform: uppercase;
	width: 100%;
	text-align: center
}

.threeColorIconTab .sapMITBItem:nth-child(1).sapMITBSelected .sapMITBFilterDefault {
	background: #01B5F0;
	color: #fff
}

.threeColorIconTab .sapMITBFilter:nth-child(1) .sapMITBText,
.threeColorIconTab .sapMITBItem:nth-child(1) .sapMITBFilterDefault {
	color: #01B5F0
}

.threeColorIconTab .sapMITBItem:nth-child(1).sapMITBSelected>.sapMITBContentArrow {
	border-bottom-color: #01B5F0
}

.threeColorIconTab .sapMITBItem:nth-child(1) .sapMITBFilterIcon {
	border: 1px solid #01B5F0
}

.threeColorIconTab .sapMITBItem:nth-child(2).sapMITBSelected .sapMITBFilterDefault {
	background: #204A96;
	color: #fff
}

.threeColorIconTab .sapMITBFilter:nth-child(2) .sapMITBText,
.threeColorIconTab .sapMITBItem:nth-child(2) .sapMITBFilterDefault {
	color: #204A96
}

.threeColorIconTab .sapMITBItem:nth-child(2).sapMITBSelected>.sapMITBContentArrow {
	border-bottom-color: #204A96
}

.threeColorIconTab .sapMITBItem:nth-child(2) .sapMITBFilterIcon {
	border: 1px solid #204A96
}

.threeColorIconTab .sapMITBItem:nth-child(3).sapMITBSelected .sapMITBFilterDefault {
	background: #93358D;
	color: #fff
}

.threeColorIconTab .sapMITBFilter:nth-child(3) .sapMITBText,
.threeColorIconTab .sapMITBItem:nth-child(3) .sapMITBFilterDefault {
	color: #93358D
}

.threeColorIconTab .sapMITBItem:nth-child(3).sapMITBSelected>.sapMITBContentArrow {
	border-bottom-color: #93358D
}

.threeColorIconTab .sapMITBItem:nth-child(3) .sapMITBFilterIcon {
	border: 1px solid #93358D
}

#tabBar>div>div>div {
	margin-top: 0
}

#webpage {
	display: flex;
	flex-direction: column
}

#webpage #webpage-cont {
	display: flex;
	flex-direction: column;
	position: relative;
	overflow: hidden!important;
	box-sizing: border-box;
	flex: 1
}

#webpage #webpage-cont .desktopHeader {
	flex: 1
}

#webpage #webpage-cont .desktopHeader>div {
	width: 100%!important
}

#webpage #webpage-cont .desktopHeader .sapMImg {
	position: absolute!important;
	top: 50%;
	left: 50%;
	min-width: 100%;
	min-height: 80%;
	width: auto!important;
	transform: translate(-50%, -50%);
	max-width: none;
	max-height: none
}

.hexagon-wrapper {
	position: absolute;
	width: 70px;
	min-height: 70px;
	transform: scale(.5);
	bottom: -35px;
	left: -8px
}

.hexagon-wrapper .hexagon {
	--bg-color: #555;
	width: 70px;
	position: absolute
}

.hexagon-wrapper .hexagon.color-1 {
	--bg-color: #029bb4
}

.hexagon-wrapper .hexagon.color-2 {
	--bg-color: #234a96
}

.hexagon-wrapper .hexagon.color-3 {
	--bg-color: #993388
}

.hexagon-wrapper .hexagon.small {
	position: absolute;
	transform: scale(.9);
	z-index: 10
}

.hexagon-wrapper .hexagon.small .center,
.hexagon-wrapper .hexagon.small .center .bottom-ball,
.hexagon-wrapper .hexagon.small .center .top-ball {
	background-color: var(--bg-color)
}

.hexagon-wrapper .hexagon.small:after,
.hexagon-wrapper .hexagon.small:before {
	border-bottom-color: var(--bg-color);
	border-top-color: var(--bg-color)
}

.hexagon-wrapper .hexagon .center {
	background-color: #FFF;
	height: 40px;
	width: 100%;
	border-radius: 8px
}

.hexagon-wrapper .hexagon .bottom-ball,
.hexagon-wrapper .hexagon .top-ball {
	background-color: #FFF;
	width: 15px;
	height: 15px;
	z-index: 2;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	border-radius: 50%
}

.imageHeaderCornerWeb,
.imageStripWeb {
	width: 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-attachment: initial
}

.hexagon-wrapper .hexagon:after,
.hexagon-wrapper .hexagon:before {
	content: "";
	display: block;
	border-right: 29.17px solid transparent;
	border-left: 29.17px solid transparent;
	border-radius: 100px;
	position: relative
}

.hexagon-wrapper .hexagon .top-ball {
	top: 1.54px
}

.hexagon-wrapper .hexagon .bottom-ball {
	bottom: 1.54px
}

.hexagon-wrapper .hexagon:before {
	border-bottom: 20px solid #FFF;
	top: 3.64px
}

.hexagon-wrapper .hexagon:after {
	border-top: 20px solid #FFF;
	bottom: 3.64px
}

.imageStripWeb {
	height: 250px;
	background-image: url(../img/background.jpg);
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover
}

.imageHeaderCornerWeb {
	background-image: url(../img/header_corner.png);
	opacity: .9;
	filter: alpha(opacity=90);
	-webkit-background-size: 100% 100%;
	-moz-background-size: 100% 100%;
	-o-background-size: 100% 100%;
	background-size: 100% 100%;
	position: absolute;
	top: 0;
	left: 0
}

.sapMCrsl {
	border: none
}

.sapMCrslFluid .sapMCrslItem {
	margin-right: unset
}

.sapMCrslHud.sapMCrslHudMiddle {
	display: none!important
}

.imageHeaderCornerWeb .sapMLnk,
.imageHeaderCornerWeb .sapMLnk:focus,
.imageHeaderCornerWeb .sapMLnk:visited {
	color: #fff
}

.headerApps {
	height: 60px;
	padding: 0 10px 0 40px;
	align-items: center;
	align-content: center
}

.headerApps .sapMLnk,
.headerApps .sapMLnk:focus,
.headerApps .sapMLnk:visited {
	color: #777
}

.headerApps .linksHeaderIcon {
	margin: 4px 0 0!important;
	min-width: 52px;
	font-size: .8rem
}

.headerApps .linksHeaderLabel {
	margin-left: 20px!important
}

.appsWrapper {
	padding: 10px 30px
}

.headerApps1 {
	background-image: -webkit-linear-gradient(left, #009FB5, #1D4B96);
	background-image: -moz-linear-gradient(left, #009FB5, #1D4B96);
	background-image: -ms-linear-gradient(left, #009FB5, #1D4B96);
	background-image: -o-linear-gradient(left, #009FB5, #1D4B96);
	background-image: linear-gradient(left, #009FB5, #1D4B96)
}

.headerApps2 {
	background-image: -webkit-linear-gradient(left, #1D4B96, #95358C);
	background-image: -moz-linear-gradient(left, #1D4B96, #95358C);
	background-image: -ms-linear-gradient(left, #1D4B96, #95358C);
	background-image: -o-linear-gradient(left, #1D4B96, #95358C);
	background-image: linear-gradient(left, #1D4B96, #95358C)
}

.headerApps3 {
	background-image: -webkit-linear-gradient(left, #95358C, #EC1946);
	background-image: -moz-linear-gradient(left, #95358C, #EC1946);
	background-image: -ms-linear-gradient(left, #95358C, #EC1946);
	background-image: -o-linear-gradient(left, #95358C, #EC1946);
	background-image: linear-gradient(left, #95358C, #EC1946)
}

.webLinkBox .sapMLnk:hover,
.webLinkBox .sapMLnk:visited:hover {
	color: #01B5EA
}

#menu>div {
	flex: 1
}

.sapUiTinyMarginTopBottom {
	margin-bottom: unset!important;
	margin-top: .2rem!important
}

.webLinkBox:hover a {
	background-color: #00B5EE;
	border-radius: 3px;
	color: #fff!important
}

.webLinkBox a {
	padding: 3px 10px;
	font-size: 1rem;
	color: #444;
	font-family: Rubik
}

.webLinkBox a:not([data-title=""]):hover:after {
	content: attr(data-title);
	position: absolute;
	left: 100%;
	top: -40%;
	background-color: #dfe4e6;
	padding: 3px;
	border-radius: 3px;
	color: #686d6a;
	font-size: smaller;
	margin-left: 15px;
	z-index: 999;
	white-space: normal;
	width: 200px
}

.sapMShellCentralBox {
	width: 100%!important;
	margin-left: 0!important;
	left: 0!important
}

.sapMPageWithFooter>section {
	bottom: 2rem
}

.sap-phone .sapMPageWithFooter>section,
.sap-tablet .sapMPageWithFooter>section {
	bottom: 3rem!important;
	display: flex;
	flex-direction: column
}

.sapMPageFooter {
	background-color: #fff!important;
	min-height: 50px;
	height: auto;
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 1.2rem;
	position: relative
}

.sap-phone:not(.sap-desktop) .sapMPageFooter,
.sap-tablet:not(.sap-desktop) .sapMPageFooter,
footer:before {
	position: absolute
}

@media (max-width:720px) {
	.sapMPageFooter {
		position: absolute
	}
}

.sapMPageFooter .sapMBarMiddle {
	height: auto
}

.sapMPageFooter .sapMBarMiddle .sapMBarContainer.sapMBarPH {
	display: flex;
	justify-content: center;
	align-items: center
}

.sapMPageFooter .sapMBarMiddle .sapMBarContainer.sapMBarPH #webFooter div {
	margin: 0 15px;
	width: 33%
}

.sapMPageFooter .sapMBarMiddle .sapMBarContainer.sapMBarPH #webFooter div a {
	color: #97358B
}

footer div {
	background-color: transparent!important;
	border: none!important
}

footer:before {
	content: '';
	width: 100%;
	height: 3px;
	top: 0;
	left: 0
}

.footerLinkPopover {
	padding-left: 10px;
	padding-right: 10px
}

.footerLinkPopover .footerLinksBox div {
	padding: 5px 5px 5px 2px;
	border-bottom: 1px solid #a9a9a9
}

.footerLinkPopover .footerLinksBox div .footerLinks {
	font-size: .85rem;
	font-family: Rubik, sans-serif
}

.footerLinkPopover .footerLinksBox div .footerLinks:before {
	content: ">";
	margin-right: 3px
}