/* CSS Document */

	html, body { 
	  background: url(../img/bg_pattern_cream.png) repeat;
	  margin: 0px;
	  padding: 0px;
	  min-height: 100vh;
	  height: 100vh;
	  display: flex; flex-direction: column;
	}

	body {
		/* font-family: 'Open Sans', sans-serif !important; */
		font-family: 'Monserrat', sans-serif !important;
	}

	.btn-outline-secondary:hover {
		color: black;
	}
/*------------------------------*/
	:root {
	  --color-blue-dark: #182452;
	  --color-blue-light: #4563ad;
	  --color-mustard: #b7923a;
	  --color-cream: #d3cebb;
	  --color-gray-dark: #6C757D;		
	  --color-gray-strong: #2F2F2F;		
	  --color-gray-medium: #7e7e7e;
	  --color-gray-light: #98b3b1;
	  --color-orange: #ff5500;
	  --color-orange-light: #ff8d27;
	  --color-green-dark: #116711;
	  --color-green: #32B432;
	  --color-green-light: #35FF32;
	  --color-white: #FFFFFF;
	}

/*------------------------------*/
	.spacer-small {
		min-width:16px;
		min-height:16px;
	}

	.spacer-medium {
		min-width:32px;
		min-height:32px;
	}

	.spacer-large {
		min-width:64px;
		min-height:64px;
	}

	.shadow-thin {
		-webkit-box-shadow: 1px 1px 5px 1px rgba(0,0,0,0.5);
		-moz-box-shadow: 1px 1px 5px 1px rgba(0,0,0,0.5);
		box-shadow: 1px 1px 5px 1px rgba(0,0,0,0.5);
	}

	.border-cyan {
		border: thin solid cyan;
	}

/*Override bootstrap theme -------------------------*/
		
	h1, h2, h3, h4 {
		color: var(--color-blue-light) !important;
		font-weight: bold;
	}

	h1 {
		font-size: 3.0rem;
	}

	h2 {
		font-size: 2.5rem;
	}

	.bar_orange_bottom {
		border-bottom: thick var(--color-orange) solid !important;
	}

	.bar_green_bottom {
		border-bottom: thick var(--color-green) solid !important;
	}

	.disabled-div {
		pointer-events: none;
		opacity: 0.6;
   }

	.fg-titulares-dalak {
		color: #596159 !important;
	}

	.fg-titulares-sf {
		color: #4563AD !important;
	}

	.fg-titulares-sf {
		color: #4563AD !important;
	}

	.fg-subtitulares-dalak {
		color: #228022 !important;
		font-weight: bold;
	}

	.fg-subtitulares-sf {
		color: #4563AD !important;
		font-weight: bold;
	}

	#LOGIN a {
		text-decoration: none;
		color:white;
	}

	footer a {
		text-decoration: none;
		color:white;
	}

	footer a:hover {
		text-decoration: none;
		color: var(--color-orange);
	}

	.navbar-nav > li{
	  padding-left:16px;
	  padding-right:16px;
	}

	.display-none {
		display: none !important;
	}

	.bold {
		font-weight: bold;
	}

	.breadcrumb .breadcrumb-item {
		color:var(--color-gray-light);
	}

	.breadcrumb a {
		color:var(--color-white);
		font-weight: bold;
	}

	.breadcrumb-item .active {
		color:var(--color-gray-light);
	}

	.btn {
		border:none;
		border-radius: 0;
		padding-left: 32px;
		padding-right: 32px;
	}

	.btn-enviar-blue {
		color: white;
		background-color: var(--color-blue-dark);
	}

	.btn-enviar-blue:hover {
		color: white;
		background-color: var(--color-blue-dark);
	}

	.btn-enviar-green {
		color: white;
		background-color: var(--color-green-dark);
	}

	.btn-enviar-green:hover {
		color: white;
		background-color: var(--color-green);
	}

	.btn-cancelar-sf {
		color: white;
		background-color: var(--color-mustard);
	}

	.btn-cancelar-sf:hover {
		color: white;
		background-color: var(--color-blue-light);
	}

	.btn-cancelar-dalak {
		color: white;
		background-color: var(--color-gray-medium);
	}

	.btn-cancelar-dalak:hover {
		color: white;
		background-color: var(--color-gray-light);
	}

	.btn-primary {
		color:#fff;
		background-color: var(--color-blue-dark);
	}

	.btn-primary:hover {
		background-color: var(--color-blue-dark);
	}

	.btn-secondary {
		color:#fff;
		background-color: var(--color-blue-dark);

	}

	.btn-tertiary {
		color:#fff;
		background-color: var(--color-gray-medium);
	}

	.btn-tertiary:hover {
		color:#fff;
		background-color: var(--color-blue-dark);

	}

	.btn-orange {
		color:#fff;
		background-color: var(--color-orange);
	}

	.btn-orange:hover {
		color:#fff;
		background-color: var(--color-blue-dark);
	}

	.btn-dark {
		color:#fff;
		background-color: var(--color-gray-strong);
	}

	.btn-dark:hover {
		color:#fff;
		background-color: black;
	}

	.btn-white {
		color: var(--color-green-dark);
		background-color: var(--color-white);
	}

	.btn-white:hover {
		color: var(--color-green-dark);
		background-color: var(--color-gray-light);
	}

	.btn-mustard {
		color:#fff;
		background-color: var(--color-mustard);
	}

	.btn-mustard:hover {
		color:#fff;
		background-color: var(--color-blue-dark);
	}

		
/*------------------------------*/

	.color-primary {
		color:  #001c88;
	}

	.color-secondary {
		color:  #ff8e16;
	}

	.bgcolor-primary {
		background-color: #001c88;
	}

	.fg-primary-sf {
		color: #001c88;
	}

	.fg-secondary-sf {
		color: #ff8e16;
	}

	.fg-primary-dalak {
		color: var(--color-gray-medium);
	}

	.fg-secondary-dalak {
		color: var(--color-green);
	}

	.bgcolor-secondary {
		background-color:  #ff8e16;
	}

	.bg-white {
		background-color: white !important;
	}

	.bg-seccion-sf {
		background-color: #f2ede0;
	}

	.bg-seccion-dalak {
		background-color: #edf0e8;
	}

	.bg-noticias-sf {
		background-color: #ededed;
	}

	.bg-noticias-dalak {
		background-color: var(--color-gray-light);
	}

	.bg-black {
		background-color: #2f2f2f !important;
	}

	.bg-blue-dark {
		background-color: var(--color-blue-dark) !important;
	}

	.bg-blue-light {
		background-color: var(--color-blue-light) !important;
	}

	.bg-gray-dark {
		background-color: var(--color-gray-dark) !important;
	}

	.bg-gray-medium {
		background-color: var(--color-gray-medium) !important;
	}

	.bg-gray-light {
		background-color: var(--color-gray-light) !important;
	}

	.bg-red {
		background-color: #ec2126 !important;
	}

	.bg-red-dark {
		background-color: #b51b2a !important;
	}

	.bg-cream {
		background-color: #f2ede0 !important;
	}

	.bg-mustard {
		background-color: var(--color-mustard) !important;
	}

	.bg-orange {
		background-color: var(--color-orange) !important;
	}

	.bg-orange-light {
		background-color: var(--color-orange-light) !important;
	}

	.bg-green {
		background-color: var(--color-green) !important;
	}

	.bg-green-light {
		background-color: var(--color-green-light) !important;
	}

	.bg-gray {
		background-color: #4F4F4F !important;
	}

	.bg-gray-strong {
		background-color: #2F2F2F !important;
	}

	.bg-gradient-gray-horz-1 {
		background-image: -webkit-linear-gradient(left,#4F4F4F, #A1A1A1);
		background-image: -o-linear-gradient(left, #4F4F4F, #A1A1A1);
		background-image: linear-gradient(to right,#4F4F4F, #A1A1A1);
	}

	.bg-gradient-gray-vert-1 {
		background-image: -webkit-linear-gradient(top,#4F4F4F, #A1A1A1);
		background-image: -o-linear-gradient(top, #4F4F4F, #A1A1A1);
		background-image: linear-gradient(to bottom,#4F4F4F, #A1A1A1);
	}

	.bg-gradient-green-horz-1 {
		background-image: -webkit-linear-gradient(left, #32B432, #35FF32);
		background-image: -o-linear-gradient(left, #32B432, #35FF32);
		background-image: linear-gradient(to right, #32B432, #35FF32);
	}

	.bg-gradient-green-horz-2 {
		background-image: -webkit-linear-gradient(left, #226222, #31b431);
		background-image: -o-linear-gradient(left, #226222, #31b431);
		background-image: linear-gradient(to right, #226222, #31b431);
	}

	.bg-gradient-blue-horz-1 {
		background-image: -webkit-linear-gradient(left,#182452, #4563ad);
		background-image: -o-linear-gradient(left, #182452, #4563ad);
		background-image: linear-gradient(to right,#182452, #4563ad);
	}

	.bg-gradient-blue-horz-2 {
		background-image: -webkit-linear-gradient(left, #4563ad, #182452);
		background-image: -o-linear-gradient(left, #4563ad, #182452);
		background-image: linear-gradient(to right,#4563ad, #182452);
	}

	.bg-gradient-orange-horz-1 {
		background-image: -webkit-linear-gradient(left, #ff5500, #ff8d27);
		background-image: -o-linear-gradient(left, #ff5500, #ff8d27);
		background-image: linear-gradient(to right, #ff5500, #ff8d27);
	}

	.bg-gradient-red {
		background-image: -webkit-linear-gradient(left, #d71e22, #781011);
		background-image: -o-linear-gradient(left, #d71e22, #781011);
		background-image: linear-gradient(to right,#d71e22, #781011);
	}

	.color-white {
		color: white !important;
	}

	.color-black {
		color: black !important;
	}

	.color-blue-dark {
		color: var(--color-blue-dark) !important;
	}

	.color-blue-light {
		color: var(--color-blue-light) !important;
	}

	.color-gray-dark {
		color: var(--color-gray-dark) !important;
	}

	.color-gray-medium {
		color: var(--color-gray-medium) !important;
	}

	.color-gray-light {
		color: var(--color-gray-light) !important;
	}

	.color-red {
		color: #ec2126 !important;
	}

	.color-red-dark {
		color: #b51b2a !important;
	}

	.color-cream {
		color: #f2ede0 !important;
	}

	.color-mustard {
		color: var(--color-mustard) !important;
	}

	.color-orange {
		color: var(--color-orange) !important;
	}

	.color-orange-light {
		color: var(--color-orange-light) !important;
	}

/* ---------------------------------- */
	.dropdown-menu {
		color: var(--color-gray-dark);
		font-size: 14px !important;
		padding-left:10px;
		border-radius: 0px;
		border:none;
		margin-top: 0px;
		/* border-bottom: thick var(--color-orange) solid; */
		padding-top: 15px;
		padding-bottom: 15px;
	}

	.dropdown-submenu {
		position: relative;
		width: 240px;
		padding-top: 0px;
	}

	.dropdown-submenu>.dropdown-menu {
		top: 0;
		left: 100%;
		margin-top: 0px;
		margin-left: 0px;
		padding-top: 10px;
		border-radius: 0px;
		border: none;
		width: 240px;

		/* border-bottom: thick var(--color-orange) solid; */
	}

	.dropdown a{
		color: var(--color-gray-dark);
		padding-left:10px;
		text-decoration: none;
		width:100%;
	}

	.dropdown a:hover{
		/* color: var(--color-orange); */
		padding-left:10px;
	}

	.dropdown-orange a:hover{
		color: var(--color-orange);
	}

	.dropdown-green a:hover{
		color: var(--color-green);
	}

	.dropdown-submenu:hover>.dropdown-menu {
		display: block;
	}

	.dropdown-submenu>a:after {
		display: block;
		content: " ";
		float: right;
		width: 0;
		height: 0; 
		border-color: transparent;
		border-style: solid;
		border-width: 5px 0 5px 5px;
		/* border-left-color: var(--color-green); */
		margin-top: 5px;
		margin-right: 10px;
	}

	.dropdown-submenu-green>a:after {
		border-left-color: var(--color-green);
	}

	.dropdown-submenu-orange>a:after {
		border-left-color: var(--color-orange);
	}

	.dropdown-submenu:hover>a:after {
		border-left-color: #fff;
	}

	.dropdown-submenu.pull-left {
		float: none;
	}

	.dropdown-submenu.pull-left>.dropdown-menu {
		left: -100%;
		margin-left: 10px;
	}




/* Custom -----------------------------------------*/
	
	.spacer-8 {
		width:8px;
		height:8px;
		display: block;			
	}	

	.spacer-16 {
		width:16px;
		height:16px;
		display: block;			
	}

	.spacer-32 {
		width:32px;
		height:32px;
		display: block;			
	}

	.spacer-64 {
		width:64px;
		height:64px;
		display: block;			
	}

	.text-italic {
		font-style: italic;
	}

	.dot-line-gray-100 {
		background-image: url('../img/dots_gray_264x14.png');
		height:14px; width:100%; 
		display:block;
	}

	.barra-gray-dark {
		width:100%;
		height:8px;
		display:block;
		background-color:var(--color-gray-dark);
	}

	.center-div {
		margin:auto;
	}

	.width-90 {
		width:90% !important;
	}

	.width-80 {
		width:80% !important;
	}

	.width-60 {
		width:60% !important;
	}

	.width-50 {
		width:50% !important;
	}

	.height-90 {
		height:90% !important;
	}

	.height-80 {
		height:80% !important;
	}

	.height-60 {
		height:60% !important;
	}

	.height-50 {
		height:50% !important;
	}

	.img-as-btn {
		cursor: pointer;	
		border: thin solid transparent; /* <- here */
		transition: border 0.5s;
		text-decoration: none; /* I added this for clarity of effect */
	}

	.img-as-btn:hover {
		opacity: 0.7;
	}

	.btn-circle-30 {
		width: 30px;
		height: 30px;
		line-height: 30px;
		text-align: center;		
		/* background-color: var(--color-orange); */
		color: white;
		font-weight: bold;
		border-radius: 15px;
		cursor: pointer;
		
		-webkit-user-select: none; /* Safari */        
		-moz-user-select: none; /* Firefox */
		-ms-user-select: none; /* IE10+/Edge */
		user-select: none; /* Standard */
	}

	#BUSCADOR input::placeholder {
		color:var(--color-gray-strong);
	}

	.active-plus {
		background-color: #182452;
		background-color: #ff5500;
		background-color: #EDEDED;
		background-color: #575756;
		background-color: #32B432;
		background-color: #ff5500;
		background-color: #4764AC;
	}
	
	.label-upload {
		cursor: pointer;
		/* Style as you please, it will become the visible UI component. */
	 }
	 
	 #upload-file {
		opacity: 0;
		position: absolute;
		z-index: -1;
	 }

	 .page-item.active .page-link {
		z-index: 0 !important;
	 }