/*

ELIMINAR
se usa en:
\funds-mihai.asp;

*/

:root {--compas-color: #8b81d7;}


/* OLD CUSTOM */
 h4{
	font-family: inherit;
	font-weight: 500;
	line-height: 1.2;
	color: inherit;
	font-size: 20px;}
.titol-form {padding-top: 20px;}
.nom-container {padding-right: 30px; padding-left: 30px;}

input {height: 40px; width: 100%;}
input[type=submit] {background: var(--compas-color); color: #fff; min-height: 40px; font-size: 20px;}

input[type=text] {
	background: #f1f1f1; 
	border: 1px solid var(--compas-color); 
	width: 100%;
	padding: 3px 10px;}

 /* width */
::-webkit-scrollbar {width: 10px;}
/* Track */
::-webkit-scrollbar-track {background: #f1f1f1;}
 /* Handle */
::-webkit-scrollbar-thumb {background: var(--compas-color);}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {background: #555;}


.multiple {background: #f1f1f1; height: 40px; border-radius: 0px;}
.multiple option {background: } 

.styled select {
	background: transparent;
	width: 150px;
	font-size: 16px;
	border: 1px solid #ccc;
	height: 34px;}

.styled {
	margin: 50px;
	width: 120px;
	height: 34px;
	border: 1px solid #111;
	border-radius: 3px;
	overflow: hidden;}

select {
	-webkit-appearance: button;
	-moz-appearance: button;
	-webkit-user-select: none;
	-moz-user-select: none;
	-webkit-padding-end: 20px;
	-moz-padding-end: 20px;
	-webkit-padding-start: 2px;
	-moz-padding-start: 2px;
	
	background-position: center right;
	background-repeat: no-repeat;

	border-radius: 2px;
	box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
	color: #555;
	font-size: inherit;
	margin: 0;
	overflow: hidden;
	padding-top: 2px;
	padding-bottom: 2px;
	text-overflow: ellipsis;
	white-space: nowrap;

	width: 100%; 
	text-align: center; 
	min-height: 10px; 

	font: 400 12px/1.3 'Roboto',sans-serif;
	-webkit-appearance: none;
	appearance: none;
	border: 1px solid var(--compas-color);
	line-height: 1;
	outline: 0;
	padding: 0.65em 2.5em 0.55em 0.75em;
}


/*FUNDS*/
@media screen and (min-width: 320px) and (max-width: 580px) {
	.img6 {
		-webkit-background-size: 100% auto;
		-moz-background-size: 100% auto;
		-o-background-size: 100% auto;
		background-size: 100% auto;
		background-image: url(../img/funds-mobil.png);
		background-repeat: no-repeat;
	}
}

/* END OLD CUSTOM */


* {font-family: 'Roboto', sans-serif;}
body {background: #f8faf9; min-height: 100vh; font-size: 1rem;}
.body {min-height: 65vh;}
section {padding: 20px 0px 20px 0px;}
@media (min-width: 1200px){
	.container, .container-lg, .container-md, .container-sm, .container-xl section{
		max-width: 1365px;
	}
}
a, em.fas {color: var(--compas-color);}


/* ################################ SCROLLBAR ################################ */
::-webkit-scrollbar-track{
	-webkit-box-shadow: none; border-radius: 10px; background-color: #F5F5F5;}
::-webkit-scrollbar {width: 12px;background-color: #7066CC;}
::-webkit-scrollbar-thumb{
	border-radius: 10px; -webkit-box-shadow: none; background-color: #7066CC;}


/* ################################ SELECT TEXT COLOR ################################*/
::-moz-selection {color: #fff;background: #7066CC;}
::selection {color: #fff; background: #7066CC;}


/* ################################ NAVBAR ################################ */
.logo {max-width: 100px; text-align: left; float: left;}
.navbar {margin-top: 20px;}
.navbar-dark {background: #fbfbfb;}
.navbar-brand {min-width: 200px;}

.navbar-toggler {border:0px; color: #7066CC;}

/* ADVANCED SEARCH */
.select-div {margin-top: 12px;}
.select-div label, .select-div label span {font-size: 1rem; text-align: left; width: 100%;}
.select-div p {font-weight: 500; margin: 10px 0px 4px 0px; color: #5d6f6d;}
.select-div > .dropdown  {width: 100%!important;}
.bootstrap-select > .dropdown-toggle.bs-placeholder, .bootstrap-select > .dropdown-toggle.bs-placeholder:hover, .bootstrap-select > .dropdown-toggle.bs-placeholder:focus, .bootstrap-select > .dropdown-toggle.bs-placeholder:active {
	background-color: #eaf0f0!important;}
.bootstrap-select .dropdown-menu.inner {
	background: #fff;
	max-height: 200px; max-width: 200px; 
	transform: translate3d(0px, 0px, 0px)
}
.social-icons {width: 100%;}
.social-icons a {margin-right: 10px; text-align: left; position: relative;}

.result {border:1px solid #ccc; margin-bottom: 20px; border-radius: 10px; padding: 20px 10px; background-color: #ffffff;}

.btn-light {background: #f8faf9;}

input.form-control {background-color: #eaf0f0;}
.btn-outline-secondary {background-color: #f6f6f6; border-radius: 0px;}


.title {
	font-size: 48px; 
	font-weight: 100;
	margin-bottom: 0px; 
	color: #f2f2f2;
	font-family: 'Oswald', sans-serif;

    -webkit-transform:scale(1,1.2); /* Safari and Chrome */
    -moz-transform:scale(1,1.2); /* Firefox */
    -ms-transform:scale(1,1.2); /* IE 9 */
    -o-transform:scale(1,1.2); /* Opera */
    transform:scale(1,1.2); /* W3C */
}


.title2 {
	margin: 28px 0px; 
	color: #f2f2f2;
	font-size: 2em; 
	font-weight: 500;
	line-height: 1em;}

.intro {color: #f2f2f2;}
i {color: #7066CC;}


.title2 {
	font-family: 'Roboto', sans-serif;
	color: #5d6f6d;
	font-size: 28px;
	margin: 0px;
	font-weight: 500;}

.form-control, .bootstrap-select .dropdown-toggle .filter-option {
	border-radius: 0px;
	border: 1px solid #7066CC;}




.bt-info, .info i {
	background: none; display: inline-block; 
	color: #7066CC; padding: 0px 10px;}

a.bn-info:hover{text-decoration:none;}


a[title]:hover:after {
	content: attr(title);
	position: absolute;
	top: -80px;
	right: 0;
	padding: 10px;
	border-radius: 5px;
	font-size: 12px;
	font-weight: 300;
	background: #7066CC;
	color: #fff;
	z-index: 9999;
}

a.a_menu[title]:hover:after {
	content: attr(title);
	position: relative;
	top: 00px;
	right: -10px;
	padding: 10px;
	border-radius: 5px;
	font-size: 12px;
	font-weight: 300;
	text-decoration: none;
	background: #7066CC;
	color: #fff;
	z-index: 9999;
}

/* end custom tooltips (?) */

h1, h2, h3, h4, .title-search, strong {color: #5d6f6d;}


.title-search {font-size: 18px;}
.title-hr {margin: 4px 0px 11px 0px;}
.intro {max-width: 90%; margin: 20px 0px 60px 0px;}

.btn-carregar {background: #5d6f6d; color: #fff; border-radius: 50px; text-align: center;}
.btn-carregar:hover {background: #eaf0f0; color: #5d6f6d; border: 1px solid #5d6f6d;}

.oberta {
	font-size: 1rem;
	background: green;
	color: #fff;
	padding: 4px 10px;
	margin-left: 14px;
	border-radius: 4px;}

.tancada {
	font-size: 1rem;
	background: #757575;
	color: #fff;
	padding: 4px 10px;
	margin-left: 14px;
	border-radius: 4px;}

.paginacio {width: 100%;}


input.btn-outline-secondary {
	background: #7066CC; color: #fff; border-radius: 0px!important; 
	text-align: center; margin: 0px 5px; max-height: 2.4rem!important;}
 
input.btn-outline-alt {background: #eaf0f0; color: #7066CC; text-align: center; margin: 0px 5px; border: 1px solid #7066CC;}
input.btn-outline-alt:hover {background: #eaf0f0; color: #5d6f6d; border: 1px solid #5d6f6d;} {background: #d68484; color: #eaf0f0; border: 1px solid #7066CC;}




/* FOOTER BUTTON */
/* The old, slow way. */
.slow-transition {
  box-shadow: 0 0 10px 0 #655D99;
  transition: box-shadow 500ms;
}

.slow-transition:hover {box-shadow: 0 10px 50px 0 #9085da;}

/* The fast, new way! */
.fast-transition {
  position: relative; /* For positioning the pseudo-element */
  box-shadow: 0 0 10px 0 #3B3659;
}

.fast-transition::before {
  /* Position the pseudo-element. */
  content: ' ';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;

  /* Create the box shadow at expanded size. */
  box-shadow: 0 10px 50px 0 #6259B3;

  /* Hidden by default. */
  opacity: 0;
  transition: opacity 500ms;
}

.fast-transition:hover::before {
  /* Show the pseudo-element on hover. */
  opacity: 1;}



.btn-footer{
	box-shadow: linear-gradient(-45deg, #3B3659, #6259B3, #655D99, #9085da)!important;
	width: 14rem;
	height: 6rem;
	border: 1px solid #ACA6E4;
	text-align: center;
	font-size: 1rem!important;
	border-radius: 10px;
	font-weight: 400;
	background: linear-gradient(-45deg, #3B3659, #6259B3, #655D99, #9085da);
	background-size: 600%;
	animation: bkg 5s linear infinite!important;
	animation: shadow 10s linear infinite!important;	
}

.btn-footer2{
	padding: 1rem;
	width: 100%;
	color: #eaf0f0;
	font-size: 1.2em;
	height: 90px;
	line-height: 1.6rem;
	display: block;
}

@keyframes bkg {
	0% {background-position: 0% 50%;}
	50% {background-position: 100% 50%;}
	100% {background-position: 0% 50%;}
}

@keyframes shadow {
	0% {box-shadow: 0px -10px 25px 10px #9085da;}
	25% {box-shadow: 10px 10px 25px 10px #655D99;}
	50% {box-shadow: 0px -10px 20px 0px #9085da;}
	75% {box-shadow: -10px 10px 25px 10px #655D99;}
	100% {box-shadow: 0px -10px 25px 10px #9085da;}
}




.btn-footer:hover {background: #f2f2f2; color: #7066CC;}
.btn-footer:hover > .btn-footer2 {color: #7066CC;}

/* END FOOTER BUTTON */

ul.pagination > li > a {
	background: #7066CC; color: #fff; border-radius: 50px; 
	min-width: 40px; text-align: center; margin: 0px 5px;}
.page-item:first-child .page-link, 
.page-item:last-child .page-link,
.pagination-sm .page-item:first-child .page-link,
.pagination-sm .page-item:last-child .page-link {
	border-radius: 50px!important; margin: 0px 5px;}

ul.pagination > li > a:hover {background: #eaf0f0; color: #5d6f6d; border: 1px solid #5d6f6d;}

.page-item.active .page-link {background: #eaf0f0!important; color: #5d6f6d!important; border: 1px solid #5d6f6d;}


/* ################################ SLIDER ################################ */

.custom-header {
	color: #000;
	margin-top: 0px/*125px*/;
	padding: 40px;
	/*min-height: 50vh;*/
	transition: 0.15s all ease;
	border-radius: .5rem;
	box-shadow: 0 2rem 1.5rem -1.5rem rgba(33,37,41,0.15),0 0 1.5rem 0.5rem rgba(33,37,41,0.05) !important;
	background: #fff;}


.slider {
	background-color: #6259b3;
	background-image: url(../img/bkg_img.svg), linear-gradient(135deg, #6259b3 0%, #aca6e4 100%);
	background-size: cover;
	margin-top: 20px;
	min-height: 500px;
	z-index: -50;
	padding: 0px 20px;}


.search1 {
	position: relative;
	width: 100%;
	float: right;
	color: #000;
	margin: -80px 0px 60px 0px/*125px*/;
	padding: 20px 40px 40px 40px;
	transition: 0.15s all ease;
	border-radius: .5rem;
	box-shadow: 0 2rem 1.5rem -1.5rem rgba(33,37,41,0.15),0 0 1.5rem 0.5rem rgba(33,37,41,0.05) !important;
	background: #fff;}

.search1 .subtitulo {padding: 0px;}

.search1 input{border-radius: 0px;}

.img-person {
	background-image:url(../img/person_lite.svg);
	background-size: cover;
	float: right;
	right: 0;
	width: calc((100% / 6) * 5);
	height: calc((100% / 6) * 5);
	position: absolute;
	}

.img-person-funds {
	background-image:url(../img/person_funds.svg);
	background-size: cover;
	float: right;
	right: 0;
	width: calc((100% / 6) * 5);
	height: calc((100% / 6) * 5);
	position: absolute;
	}


.search2 {
	color: #000;
	margin: 100px 0px 40px 0px/*125px*/;
	padding: 40px;
	transition: 0.15s all ease;
	border-radius: .5rem;
	box-shadow: 0 2rem 1.5rem -1.5rem rgba(33,37,41,0.15),0 0 1.5rem 0.5rem rgba(33,37,41,0.05) !important;
	background: #fff;}




.cercador form div div input, input, .search-container {
	width: 100%; border-radius: 0px;}

.search-container {width: 100%; padding: 0px; margin: 0px;}



	
@media (min-width: 992px){  .slider {padding-top: 50px;} } 

.title-left h1 {margin-bottom: 40px; font-size: 38px; font-weight: 800;}

.btn-primary {border-radius: 1rem; background: #7066CC; border: 1px solid #7066CC;}
.btn-primary:hover {background: #fff; border: 1px solid #7066CC; color: #7066CC;}


/* ################################ CARDS ################################ */
.custom-grid a.custom-grid-item {
	color: #fff;
	position: relative;
	padding-top: 1.5rem;
	padding-bottom: 1.5rem;
	transition: 0.15s box-shadow ease, 0.15s transform ease;
	-moz-transition: 0.15s box-shadow ease, 0.15s transform ease;}

.custom-grid .card-themes {background-color: #0094ca;}
.custom-grid .card-templates {background-color: #7a6b68;}
.custom-grid .card-guides {background-color: #7a6b68;}
.shadow-lg {box-shadow: 0 2rem 1.5rem -1.5rem rgba(33,37,41,0.15),0 0 1.5rem 0.5rem rgba(33,37,41,0.05) !important;}
.card {border-radius: .5rem;}
a.custom-grid-item:hover {text-decoration: none; opacity: .8;}

.custom-grid a.custom-grid-item .card-body i {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	font-size: 4rem;
	left: 1rem;
	color: rgba(255,255,255,0.2);
	transition: 0.15s all ease;
}
/* ################################ END CARDS ################################ */



/* ################################ FOOTER	################################ */
footer {
	font-size: 1.5rem;
	text-align: left;
	color: #f8faf9;
	background-color: #6259b3;
	background-image: linear-gradient(135deg, #6259b3 0%, #aca6e4 100%);
	padding: 40px 0px;
	margin-top: 40px;
	font-size: 14px;}

.logo-part {height: 100%;}

footer h6 {margin-bottom: 20px; position: relative; font-size: 20px; font-weight: 600;}
footer p {margin-bottom: 10px;}

footer a {color: #fff!important; font-size: 14px!important; text-decoration: none; }
footer a:hover {text-decoration: underline;color: #f8faf9;}

footer ul {padding-left: 0px;}
footer ul li {list-style: none; display: block; margin-bottom: 10px;}
footer ul.universitats li {margin-bottom: 0px;}
footer ul li a {text-decoration: none; color: #f8faf9;}
footer ul li a:hover {text-decoration: underline; color: #f8faf9;}

footer ul li i {color: #f8faf9;}

.legal {background: #e6e6e6; margin-top: 40px;}
.legal a {text-decoration: none;}
.legal a:hover {text-decoration: underline;}
.legal .container {border-top: 1px solid #aaa; padding-top: 20px;}

.footer-info a {color: #7a6b68;}

.social-icons {
	list-style: none;
	padding: 0;
	margin: 15px;
	margin-top: 40px;
	display: flex;
	font-size: 18px;
	float: right;}

.social-icons li a {color: #7a6b68; padding: 0px 20px; font-size: 20px;}
.social-icons li a:hover {text-decoration: none;}

.logo-footer {max-width: 100px;}
/* ################################ END FOOTER	################################ */





/* ################################ PHONE ################################ */
@media (max-width: 450px) {

	.navbar {margin-top: 20px;}

	.search1 {margin:0px; margin-top: 40px; float: none;}
	.cercador {margin-top: -50px;}

	.slider > .col-lg-7 {padding-top: 0px!important;}
	.engranaje2 {visibility: hidden;}
	.titulo {font-size: 52px;}
	.image-slider, .img-person {min-height: 300px;}

	/* ################ FOOTER ################ */
	.avis-legal {margin: 20px 0px;}
	.footer-right {text-align: left;}
	.align-social-icons {text-align: left; padding: 20px 0px 20px 0px;}
	.footer-logo {padding: 10px 0px;}
	.text-col {column-count: 1;}


	section {padding-top: 20px;}
	form {margin: 0px; padding: 30px!important;}
	.login {padding: 0px!important;}
	.login > label {padding: 0px!important; margin: 10px 5px;}
	.cercador {padding: 0px; margin-bottom: 40px;}
	.ibercaja { text-align: left; }
	.ibercaja > p, .ibercaja > img {text-align: left!important; padding-left: 40px;}
	.ibercaja a {margin-left: 40px; margin-bottom: 40px;}
	.ibercaja {text-align: left!important;}
}


/* ################################ TABLET ################################ */
@media only screen and (max-width: 991px) {

	.slider {padding-top: 40px; padding-right: 0px;}
	h2.titulo2 {margin: 18px 0px;}
	.intro {line-height: 1.4rem; margin-bottom: 20px;}


	footer h6 {margin-top: 40px;}
	.legal {text-align: center;}

	.ibercaja { text-align: left; }
	.ibercaja > p, .ibercaja > img {text-align: left!important; padding-left: 40px;}
	.ibercaja a {margin-left: 40px; margin-bottom: 40px;}
	.ibercaja {text-align: left!important;}
}


