@charset "UTF-8";
:root {
    --currentColor: #fcc723; /* Color that's now being used on screen as text and boxes' color */
    --defaultTimerColor: var(--currentColor);
    --timerColor: var(--defaultTimerColor); /* Used to be changed to red when too much time passes */
    --engrescatColor: #5C007A; /* Blau:#003366; Lila:#5C007A; Morat:#4e004e; */
}
/*@font-face {
   font-family: intro;
   src: url(intro.otf);
}*/
html {
	height: 100%;
}
body {
	background-color: #067c7f;
	height: 100%;
}
ul {
    list-style-type: none;
}
h1 {  /*Títol "Reunió Telecogresca"*/
    font-size: 60px;
    font-family: "URBANOBold", Arial, Helvetica, sans-serif;
}
h2 {  /*Secció presentant*/
    font-size: 40px;
}
@font-face {
    font-family: "URBANOBold";
    src: url(URBANOBold.ttf);
}
@font-face {
    font-family:"Montserrat-Medium" ;
    src: url(Montserrat-Medium.ttf);
}
.container-flex {
    text-align: center;
    color: var(--currentColor);
	margin-left: 30px;
	margin-right: 30px;
}
.flower {
    background-image: url(flowers.gif);
    background-size: cover;
}
.crispetes {
    background-image: url(crispetes.gif);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.rata {
    background-image: url(rata2.gif);
    background-repeat: repeat-x;
    background-size: contain;
    background-position: center;
}
.ruben {
    background-image: url(ruben.jpg);
    background-size: cover;
}
.knife {
    background-image: url(knife.gif);
    background-size: cover;
}
.ptaegk {
    background-image: url(tonto.png);
    background-size: cover;
}
.obama {
    background-image: url(obama-medal.png);
    background-size: cover;
}
.fotoit {
    background-image: url(foto_it.jpg);
    background-size: cover;
}
.estrellitas{
    background-image: url(estrellitas.gif);
    background-size: cover;
}
.purple-background {
    background-color: #7f027f; /* Purple background color */
}
.theme-engrescat {
    background-color: rgb(10,212,131); /* Engresca't background color (abans #015333, després #54C9AC, ara RGB). El color que va passar Propa es veu xungo a tots els navegadors, aquest l'he trobat pillant els valors RGB del logo d'Insta (96, 208, 138), aquests valors coincidien amb l'hex de propa, pero als navegadors no es veuen així. He anat fent captures de pantalla comparant el valor rgb de la web amb l'original fins trobar un valor que es veu bé*/
    --currentColor: var(--engrescatColor);
    --timerColor: var(--engrescatColor);
}
/*.theme-engrescatRedTimer{
    background-color: rgb(10,212,131);
    --currentColor: var(--engrescatColor);
    --timerColor: red;
}*/
.bigger-text {
        font-size: larger;
}
.reunio_acabada{
    background-image: url(TELECOGRESCA1.jpg);
    background-size: cover;
}
.mono{
    background-image: url(mono.gif);
    background-size: cover;
}
.timer {
	font-size: 80px;
    color: var(--timerColor);
}
.box {
	border: 2px solid var(--currentColor);
	border-radius: 50px;
	margin: 15px 0 15px 0;
	width: 100%;
	height: 100%;
	padding: 15px;
    font-family: "Montserrat-Medium", Arial, Helvetica, sans-serif;
}