:root {
/*  --primary-color:  #fff; */
  --primary-color:  #b6141c;
  --primary-color-light: #fbc24830;
  --secondary-color:  #b6141c;
  --secondary-color-light: #f0f0f0;

  --nav-bg-color:  #fff;
  --nav-color:  #b6141c;
  --nav-hover-color: #000;
  --nav-font: 'Roboto', sans-serif;
  
  --header-title-color:  #000;
  --header-color:  #b6141c;
  --header-link-color:  #000;
  --header-link-hover-color:  #000;
  --header-bg-color:  #f0f0f0;

  --footer-title-color:  #b6141c;
  --footer-color:  #b6141c;
  --footer-link-color:  #b6141c;
  --footer-link-hover-color:  #b6141c;
  --footer-bg-color:  #f0f0f0;

  --esports-title-color: #b6141c;
  --esports-title-hover-color: #b6141c;

  --body-font:  "Inter", sans-serif;
  --body-color: #b6141c;
  --title-font:  "Inter", sans-serif;/* ENCARA NO S'USA */
}

html{
	scroll-behavior: smooth;
}

body{
	font-family: var(--body-font);
	font-size: 1rem;
	line-height: 1.6rem;
	color: var(--body-color);
}

/* input[type="checkbox"]{
	height: 25px;
	-webkit-transform: scale(1.3,1.3);
}

input[type="radio"]{
	height: 15px;
	-webkit-transform: scale(1.3,1.3);
	margin-right: 15px;
} */

.btn-light:hover{
  background-color: var(--secondary-color) !important;
}

input[type="radio"]{
	margin-right: 15px;
}

h2{
	font-weight: 600;
	font-size: 1.6rem !important;
}

a{
	color: var(--primary-color);
}

a:hover{
	color: var(--secondary-color);
	/*font-weight: 800;*/
}

a.active{
	color: #000;
	font-weight: 600;
}

header{
	background-color: var(--nav-bg-color);
	color:  #000;
}

footer{
	background-color: var(--footer-bg-color);
	color:  var(--footer-color);
  font-size: 0.9rem;;
}

footer h5{
	color:  var(--footer-title-color);
	text-transform: uppercase;
	font-size:  1rem;
	font-weight: 600;
  margin-bottom: 1rem;
}

footer h5::after{
	display: block;
    content: "\00a0";
    border: var(--footer-title-color) 4px;
    background-color: var(--footer-title-color);
    width: 2rem;
    font-size: 3px;
    margin-top: 0.5rem;
}

footer p{
	margin-top: 0;
	margin-bottom: 0;
}

footer .label-footer{
	color: var(--footer-title-color) ;
}

footer .nav{
  font-size: 15px;
}

footer .nav-link{
  padding: 0;
  display: inline;
}

footer .nav-item:after{
  content: "|";
  margin: 10px;
}

footer .nav-item:last-child:after{
  content: "";
}

footer a{
	color: var(--footer-link-color);
}

footer a:hover{
	color: var(--footer-link-hover-color);
	text-decoration: underline !important;
}

h2::after{
	display: block;
    content: "\00a0";
    border: var(--secondary-color) 4px;
    background-color: var(--secondary-color);
    width: 3rem;
    font-size: 5px;
    margin-top: 1rem;
}

.navbar-nav{
  font-size: 0.9rem !important;
  color: #000 !important;
}

.py-8 {
	padding-top: 4rem !important;
	padding-bottom: 4rem !important;
}

.verd{
  color: var(--primary-color);
}

.subtitol-inici{
  font-size: x-large;
  font-weight: 100;
  text-transform: initial;
}

.titol-inici{
  line-height: 1em;
}

.menu-fb{
  margin-right: 1rem;
  font-weight: bold;
  color: #fff;
}

.menu-fb:hover{
  text-decoration: none;
}

.nav-link{
	font-family: var(--nav-font);
  color: var(--nav-color) !important;
  font-weight: 400 !important;
  font-size: 1.1rem;
}

.nav-link:hover{
  color: var(--nav-hover-color) !important;
}

.square{
}

.img-esport-container{
  border-radius: 1rem;
  box-shadow: #9f9f9f 2px 2px 7px;
  overflow: hidden;
}

.img-esport{
  aspect-ratio: 1/0.6;
  object-fit: cover;
  transition: all .4s ease-in-out;
}

.img-esport:hover{
  transform: scale(1.3);
  filter: contrast(.5) brightness(1.5);
}

.img-esport-modal{
  aspect-ratio: 1/0.6;
  object-fit: cover;
}

a.esport-matricula:hover .img-esport{
  transform: scale(1.3);
  filter: contrast(.5) brightness(1.5);
}

.btn-escola{
  font-size: 1.9rem;
  color: var(--primary-color);
  background-color: transparent;
	font-family: var(--title-font);
  font-weight: bold;
  border: 1px solid var(--primary-color);
  border-radius: 5px;
  padding: 0.7rem;
  cursor: pointer;
  margin: 1rem;
}

.btn-escola-selected{
  font-size: 1.9rem;
  color: #fff;
	font-family: var(--title-font);
  font-weight: bold;
  border: 1px solid var(--primary-color);
  background-color: var(--primary-color);
  border-radius: 5px;
  padding: 0.7rem;
  margin: 1rem;
}

.title-escola{
  font-size: 1rem;
  color: var(--secondary-color);
	font-family: var(--title-font);
  font-style: italic;
  font-weight: bold;
  margin-bottom: 0.5rem;
}

.title-esport{
  font-size: 1.3rem;
  color: var(--esports-title-color);
	font-family: var(--title-font);
  /* font-style: italic; */
  font-weight: bold;
}

.title-escola-modal{
  font-size: 1.5rem;
  line-height: 1.0;
  color: var(--secondary-color);
	font-family: var(--title-font);
  font-style: italic;
  font-weight: bold;
  margin-bottom: 0;
}

.title-esport-modal{
  font-size: 2.5rem;
  line-height: 1.0;
  color: var(--primary-color);
	font-family: var(--title-font);
  font-style: italic;
  font-weight: bold;
}

a.esport-matricula:hover .title-esport{
  color: var(--esports-title-hover-color);
}

a.esport-matricula:hover{
  text-decoration: none !important;
}

.text-verd-eemelverger{
  color: var(--primary-color);
}

.text-header-bar{
	font-size: 3.5rem;
  font-weight: bold;
	font-family: var(--title-font);
  color: var(--header-color);
}

.text-header-bar-after{
  border: var(--header-color) 4px;
  background-color: var(--header-color);
  width: 3rem;
  font-size: 5px;
  margin: 1rem auto 0;
  line-height: 1em;
}

.card-category{
	background-color: #000;
	font-size: 0.8rem;
	padding-left: 1em;
	padding-right: 1em;
	margin-bottom: 1em;
}

.card-date{
	color: var(--secondary-color);
	font-size: 0.8m;
	text-shadow: 1px 1px 2px #000;
}

.card-title{
	font-size: 1.5rem;
	font-weight: 600;
	text-shadow: 1px 1px 2px #000;
}

.nav-social{
	padding-left: 2px;
	padding-right: 2px;
}

.matricules-obertes{
	background-color: var(--header-bg-color);
	font-size: 3rem;
	font-weight: bold;
	color: #000;
	/* text-transform: uppercase; */
}

.area-privada{
	background-color: var(--secondary-color);
	font-size: 3rem;
	font-weight: 600;
	color: #000;
}

.resaltat{
	color: var(--secondary-color);
}

.info-general{
	background-color: #000;
	font-size: 1.5rem;
	font-weight: 600;
	color: #fff;
}

.info-especial{
	background-color: var(--secondary-color);
	font-size: 1.5rem;
	font-weight: 600;
	color: #000;
}

.text-news-slider{
	background-image: linear-gradient(to bottom, rgba(31,28,90,0), rgba(31,28,90,0), rgba(31,28,90,0.9));
}

.btn-eem{
  background-color: #e8fae3;
  color: #1e1b59;
  font-weight: bold;
}

.btn-eem i {
  color: #a7ef93;
}

.label-fg{
  background-color: var(--secondary-color-light);
  color: #000;
  border-radius: 5px;
}

.text-matricula{
    /* font-size: 1.5rem; */
}

.text-matricula-cat{
    font-size: 1.5rem;
}

.btn-fg-light, .btn-fg-dark{
	background-color: var(--primary-color);
	border: none;
	color: #fff;
	font-weight: 600;
  border-radius: 50px;
  font-size: 1.1rem;
}

.btn-fg-danger, .btn-fg-danger:hover{
	background-color: rgb(220, 53, 69);
	border: none;
	color: #fff;
	font-weight: 600;
  border-radius: 50px;
  font-size: 1.1rem;
}

.btn-fg-light:hover, .btn-fg-dark:hover{
	background-color: #000;
	color: #fff;
}

.btn-fg-white{
	background-color: #fff;
	border: none;
	color: #000;
	font-weight: 600;
  border-radius: 50px;
  font-size: 1.1rem;
}

.btn-fg-white:hover{
	background-color: var(--secondary-color);
	color: #000;
}

.btn-fg-lg{
	/*height: 80%;*/
	font-size: 1.5rem;
}

.bg-fg{
	background-color: var(--header-bg-color);
  border-radius: 5px;
}

.noticia-esport{
	background-color: #000;
    color: var(--secondary-color);
    padding: 0 5%;
    font-weight: bold;
}

.img-noticia-card{
		max-height: 320px !important;
		overflow: hidden !important;
}

hr.separator{
	border-top: 7px solid var(--secondary-color);
  width: 75px;
}

/* COOKIE CONSENT */
div.js-cookie-consent{
	position: fixed;
  bottom: 0;
  height: 100px;
  text-align: center;
  width: 100%;
  background-color: var(--secondary-color);
  padding-top: 15px;
}

span.cookie-consent__message{
	display: block;
  margin-bottom: 5px;
  color:  #000
}

button.js-cookie-consent-agree{
	background-color: #000;
  color: var(--secondary-color);
  font-weight: 600;
  border: none;
  padding: 8px;
}

/* BUTTON TOP */
#BtnTop {
  display: none; /* Hidden by default */
  position: fixed; /* Fixed/sticky position */
  bottom: 20px; /* Place the button at the bottom of the page */
  right: 30px; /* Place the button 30px from the right */
  z-index: 99; /* Make sure it does not overlap */
  border: none; /* Remove borders */
  outline: none; /* Remove outline */
	background-color: var(--secondary-color);
  color: #000;
  cursor: pointer; /* Add a mouse pointer on hover */
  padding: 15px; /* Some padding */
  font-size: 18px; /* Increase font size */
}

#BtnTop:hover {
  background-color: #555; /* Add a dark-grey background on hover */
}

@media (max-width: 415px) {

.esport{
  width: 50% !important;
}

.text-header-bar{
	font-size: 2rem;
	/* font-family: var(--title-font); */
  color: var(--header-color); */
}

.img-noticia-card{
		max-height: 160px !important;
		overflow: hidden !important;
}

.card-title{
	font-size: 0.75rem;
}

/* COOKIE CONSENT */
div.js-cookie-consent{
    height: 150px;
}

footer h5::after{
    margin-left: auto;
    margin-right: auto;
}

.footer-center{
  text-align: center;
}

}


/*PRIVATE */
.private-fg-header{
	margin: 0;
	padding: 0;
	color: #000;
	background-color: var(--secondary-color);
}

.private-fg-header a{
	color: #000;
}

.private-fg-header a:hover{
	color: #fff;
  text-decoration: none;
}

.private-fg-logout{
	color: #fff;
	background-color: #000;
}

.private-logout-btn{
	color:  #fff;
	font-size: 2rem;
}

.private-logout-btn:hover{
	color:  #fff;
	text-decoration: none;
}

i.icon-matricula-wait:before{
  display: block;
  content: ' ';
  background-image: url('../../img/area_privada/matricula_wait.svg');
  background-size: 35px 35px;
  height: 35px;
  width: 35px;
}

i.icon-matricula-good:before{
  display: block;
  content: ' ';
  background-image: url('../../img/area_privada/matricula_good.svg');
  background-size: 35px 35px;
  height: 35px;
  width: 35px;
}

i.icon-matricula-reg:before{
  display: block;
  content: ' ';
  background-image: url('../../img/area_privada/matricula_reg.svg');
  background-size: 35px 35px;
  height: 35px;
  width: 35px;
}

i.icon-matricula-bad:before{
  display: block;
  content: ' ';
  background-image: url('../../img/area_privada/matricula_bad.svg');
  background-size: 35px 35px;
  height: 35px;
  width: 35px;
}

i.icon-matricula:before{
  display: block;
  content: ' ';
  background-image: url('../../img/area_privada/matricula_area_privada.svg');
  background-size: 35px 35px;
  height: 35px;
  width: 35px;
}

i.icon-alumne-bad:before{
  display: block;
  content: ' ';
  background-image: url('../../img/area_privada/alumne_bad.svg');
  background-size: 35px 35px;
  height: 35px;
  width: 35px;
}

i.icon-alumne-good:before{
  display: block;
  content: ' ';
  background-image: url('../../img/area_privada/alumne_ok.svg');
  background-size: 35px 35px;
  height: 35px;
  width: 35px;
}

i.icon-alumne:before{
  display: block;
  content: ' ';
  background-image: url('../../img/area_privada/alumne_area_privada.svg');
  background-size: 35px 35px;
  height: 35px;
  width: 35px;
}

i.icon-monedes:before{
  display: block;
  content: ' ';
  background-image: url('../../img/area_privada/icona_monedes_color.svg');
  background-size: 35px 35px;
  height: 35px;
  width: 35px;
}

.revisar-cobro{
	background-color: #ffcc66;
}

/* MATERIAL ICONS */
.material-symbols-outlined {
  font-variation-settings:
  'FILL' 0,
  'wght' 400,
  'GRAD' 0,
  'opsz' 48
}

/*CK-CONTENT*/
.ck-content li{
  margin: 0.5em !important;
}

.ck-content a{
	color: var(--primary-color) !important;
  text-decoration: underline var(--secondary-color) !important;
}

.ck-content a:hover{
	color: var(--secondary-color) !important;
}



/*FOOTER RESPONSIVE*/
@media (min-width: 0) {
  .h-xs-200p {
    height: fit-content;
    /* height: 250px; */
  }

  .w-xs-150p {
    width: 150px;
  }
}

@media (min-width: 1200px) {
  .w-xl-300p {
    width: 300px;
  }
}

@media (min-width: 0) {
}

/*RESERVES*/
.reserva-titol-instalacio {
  font-size: 20px;
	font-family: var(--title-font);
  font-weight: bold;
  cursor: pointer;
}

.rounded-rsv{
  border-radius: 1rem!important;
}

.text-small{
  font-size: 0.7rem;
}