@import url('https://fonts.googleapis.com/css2?family=Open+Sans&display=swap');

:root{
    --main-text: 'Open Sans', sans-serif;
}

body {
	font-family: var(--main-text);
}

/* Colors */
/*
.verd-color  { color:#068B80 !important; }
.verd-bg 	 { background-color: #068B80 !important; }
.verd-border { border:1px solid #068B80 !important; }

.vermell-color  { color: #9F3352 !important; }
.vermell-bg 	{ background-color: #9F3352 !important; }
.vermell-border { border:1px solid #9F3352 !important; }
*/

.theme-border-bottom { border-bottom:2px solid var(--theme-main-color) !important; }

.red-bg    { background-color: #9F3352; }
.blue-bg   { background-color: #4AADCF; }
.green-bg  { background-color: #068B80; }
.orange-bg { background-color: #ED7C2C; }

.btn-outline-green  {
	 border-color: #068B80; 
	 color: 	#068B80 !important; 
}

.btn-outline-light {
	color:white !important;
}

.btn-outline-light:hover, .btn-outline-light:focus {
	border-color: white; 
	color: 	var(--theme-main-color) !important; 
	background:white;
}

.btn-outline-dark:hover {
    background-color: #2125291a;
    border-color: var(--theme-main-color);
}

.btn-verd:hover {
	color:#fff !important;
	background-color: #068B80;
}
.btn-vermell {
	color:var(--theme-main-color) !important;
	border: 1px solid var(--theme-main-color) !important;
	
}
.btn-vermell:hover {
	color:#fff !important;
	background-color: var(--theme-main-color) !important;
	border: 1px solid var(--theme-main-color) !important;
	
}

.btn {
	box-shadow: none !important;
	

}

/*********/
/* LLISTATS */


.list li {
    display: block;
    margin-bottom: 12px;
    padding-left: 30px;
    position: relative;
}

.list li:before {
    font-family: "Font Awesome 5 Free"; 
    font-weight: 900; 
    content: "\f00c";
    color: var(--theme-main-color);
    display: inline-block;
    margin-left: -1.3em; 
    width: 1.3em; 
  }
/* LLISTATS */

/*
*  Personalization GLOBAL COMU
*/

.text-little {
	font-size:18px;
}

.text-date {
	font-size:14px;
}

.btn-informe {
	min-width:180px;
	margin-bottom:1em;
	margin-right:1em;
}

.page-container {
	padding-bottom: 3rem;
}

.page-container p {
	line-height: 24px;	
}

.page-container > h2 {
	margin-bottom: 2rem
}

.page-container > h3 {
	margin-top: 2rem;
	margin-bottom: 2rem;
	color:var(--theme-main-color); 
	
}
.page-container > h4,
.page-container > h5 {
	margin-bottom: 1rem;
}

h1.page-title  {    
	margin-bottom: 3rem;
}

h5.page-subtitle  {
	margin-bottom: 3rem;
}

.page-container li {
	margin-bottom: 1rem;
}

li.list-group-item {
	margin-bottom: 0;
}

.serveis-list a.nav-link.active {
	font-weight: 600;
}

.serveis-list a.nav-link.active span {
	border-bottom:3px solid var(--theme-main-color) !important;
}

/*****************************/

/*
 * Navbar & Header
 */
 

 #mainLogo img {
	/*max-width:200px;*/ /* Web academia */
	max-width:380px; /* Web fundació 280px*/
	width: 100%;
}


.form-select.selectLang {
	border: 0 !important;
	margin-top: 3px;
	min-width: 77px;
	cursor: pointer;
}





.navbar-toggle span.icon-bar {
    transition: all 0.15s;
}

.navbar-toggle span:nth-child(2) {
    transform: rotate(45deg);
    transform-origin: 10% 10%;
}

.navbar-toggle span:nth-child(3) {
    opacity: 0;
}

.navbar-toggle span:nth-child(4) {
    transform: rotate(-45deg);
    transform-origin: 10% 90%;
}

.navbar-toggle.collapsed span:nth-child(2),
.navbar-toggle.collapsed span:nth-child(4) {
    transform: rotate(0);
}

.navbar-toggle.collapsed span:nth-child(3) {
    opacity: 1;
}



button.navbar-toggler, button.navbar-toggler:focus {
    box-shadow: none !important;
}

.navbar-toggler .navbar-toggler-icon2{
	display:block;
}
.navbar-toggler .navbar-toggler-icon{
	display:none;
}

.navbar-toggler.collapsed .navbar-toggler-icon2{
	display:none !important;
}
.navbar-toggler.collapsed .navbar-toggler-icon{
	display:block !important;
}

.dropdown-item.active,
.dropdown-item:active {
	background-color: #ccc !important;
}

.nav-title-text {
	font-size:22px;
	font-weight: 400;
}
.nav-subtitle-text {
	font-size:16px;
	color:#666 !important;
}


/**********************/

/******** 
* FOOTER
*/
footer .footer-items > div {
	margin-right: 1.2rem;
	font-size: 18px;
}


/***********



/***************************/


/*
 * Media Queries
 */

 /*
// Small devices (landscape phones, 576px and up)
@media (min-width: 576px) { ... }

// Medium devices (tablets, 768px and up)
@media (min-width: 768px) { ... }

// Large devices (desktops, 992px and up)
@media (min-width: 992px) { ... }

// X-Large devices (large desktops, 1200px and up)
@media (min-width: 1200px) { ... }

// XX-Large devices (larger desktops, 1400px and up)
@media (min-width: 1400px) { ... }
 */

@media (min-width: 576px) {
	
	
}

@media (min-width: 768px) {
	
	.form-select.selectLang {
		padding-right: 1.25rem !important;
	}
    
    ul.serveis-list {
		flex-direction: column !important;
	}

    #menu-principal .active {
		text-decoration: underline;
		color: #fff !important;
	}
	#menu-principal li:hover{
		text-decoration: underline;
		color:#fff !important;
	}


}

@media only screen and (min-width: 768px) and (max-width: 992px) {


	main {
		margin-top: 66px !important;
	}
}

/**************************************** M A X  W I D T H  *************************************************/
@media (max-width: 567px) {
	/* #navbarSupportedContent1{
		display:none;
	} */
	
	
	
}


@media (max-width: 992px) {
	/* #navbarSupportedContent1 {
		display:none;
		background-color:#fff !important;
	} */
   
	

    #navbarSupportedContent1 {
        margin-top: 90px;
    }

	#navbarSupportedContent1 li {
		border-bottom: 1px solid #000;
		text-align:center;
		width:100%;
	}
    
	#navbarSupportedContent1 li.dropdown li {
		border-bottom: 1px solid #ccc;
	}
	#navbarSupportedContent1 li a {
		color:#000 !important;
	}
	
	
	#navbarMainMenu {
		padding:0 !important;
		background-color:#fff !important;
		
	}
	header .container,
	#navbarSupportedContent1 .container {
		padding:0;
	}

    #head_main {
        background-color: #fff;
        
    }

    #head_main.fixhead{
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
		z-index: 1030;
		justify-content: center !important;
		text-align: center;
		border-bottom:2px solid rgba(159, 51, 82, .25); /* VERMELL */
    }
    
    main, main.container  {
        margin-top: 75px;
    }

    h1.page-title {
        margin-top:5.5rem
    }

	ul.dropdown-menu {
		border:none;
	}
	
	li.nav-item.dropdown a.nav-link.dropdown-toggle.show {
		background-color: #FFE3EB;
	}

}

@media (max-width: 768px) {
	
    .page-container,
	footer div  {
		padding-left: 1rem !important;
		padding-right: 1rem !important;

	}
    /*
	#banner-soci{
		max-height: 600px!important;
	}
	#banner-soci .jumbotron {
		max-width: 450px !important;
		margin:0px auto;
	}
    */
}

/* Notícies i llistats */

.news-div {
	cursor:pointer;
}
.news-div:hover h5 {
	color:#000;
	text-decoration: underline;
}
.news-title {
	color:#000;
	text-decoration: none;
}
.news-title:hover h5{
	color:#000;
	text-decoration:underline;
}
.news-title:hover div{
	text-decoration: none;
	color:#000;
}

#banner-150.bg-150-slim {
	background:url(../img/150aniversari-slim.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}

#banner-150.bg-150-slim img.img-fluid {	
	max-width:150px;
	margin:auto;
}

#banner-150.bg-150-slim a.btn {	
	font-size:16px;
}

/******** 
* FOOTER
*/
footer .footer-items > div {
	margin-right: 1.2rem;
	font-size: 18px;
}


.menu-footer {
	border-left:1px solid#cacaca;
	border-right:1px solid#cacaca;
}

.menu-footer ul {
	width:90%;
	padding-left:4rem;
	margin:auto;	
    -webkit-column-count: 2;
       -moz-column-count: 2;
            column-count: 2; /*2 in those rules is just placeholder -- can be anything*/
}

.menu-footer ul  li a:hover {

}

.address-footer ul {
	padding-left:5rem;
}

.cursor-pointer {
	cursor:pointer !important;
}