@charset "utf-8";
/* CSS Document */

label{font-weight:normal !important; cursor:pointer;}

div.loading
{
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	background-color:rgba(238,238,238,0.5);
	background-image:url(../../images/loading_public.gif);
	background-position:center;
	background-repeat:no-repeat;
	z-index:10000;
}

.divTot{ width:100%; height:100%; position:fixed; left:0; background-color:#F2F2F2;color: black;}
.divTop,.divBottom{height:1%;}
.divMiddleRight{ width:30%; position:absolute; height:95%; margin-top:2.5%; float:right; background-color:#F2F2F2; padding-right:40px; }
.divMiddleRightPaleta{ height:93.9%;}
.divMiddleLeft{ width:20%; position:absolute; height: 95%;}
.divTopLeft,.divTopRight,.divBottomRight,.divBottomLeft{ width:20%; position:absolute; height: 8vh; padding:8px 10px;}
/*.divMiddleRight{ width:10%}*/

.divTopLeft,.divBottomLeft,.divMiddleLeft{left:0;}
.divTopRight,.divBottomRight,.divMiddleRight{right:0;}
.divTopMiddle,.divBottomMiddle,.divMiddleMiddle{ width:60%; position:absolute; height: 8vh; left:20%;}
.divMiddleMiddle{ width:80%; height:100%;}
.divMiddle{ height:86vh; position:relative}
.divMiddleLeftFiltres{ background-color:#F2F2F2;overflow-y:auto;overflow-x:hidden;}

.divTextInici{width: 50%;display: inline-block; height:100%}
.divText20{width: 20%;display: inline-block; float:left; height:100%}
.divColMenu{width: 33%;display: inline-block; float:left; height:100%}

.logoInici{width: 50%; height:100%; display: inline-block; background-position:center; background-repeat:no-repeat; background-size:contain; background-image:url(../../images/logo_Principal.png)}

.logoTopBlank{height:1vh;}
.logoTopRight{width:100%; height:100%; display: inline-block; background-position:right; background-repeat:no-repeat; background-size:contain; background-image:url(../../images/logo_top.png)}
.logoTopLeft{width:100%; height:100%; display: inline-block; background-position:left; background-repeat:no-repeat; background-size:contain; background-image:url(../../images/logo_Principal.png); margin-left:10px}

.alCenter{text-align:center;}
.alRight{text-align:right;}
.alLeft{text-align:left;}


.textActive{ text-decoration:underline;}
.seccions{ cursor:pointer;list-style-type:none !important;}
.li_seccions { height:30px; padding:4px;}
ul{list-style-type:none !important; padding-inline-start: 0px !important; margin-bottom:0px !important;}

a{ color:black !important;}
a:hover{ color:black !important;}

.parent_li_seccions{position: relative; background-color: #F2F2F2; z-index: 20; border-radius:3px}

.borderTop{border-top:1px solid black;}
.borderBottom{border-bottom:1px solid black;}
.borderLeft{border-left:1px solid black;}
.borderRight{border-right:1px solid black;}

.blockImage{ margin-bottom:10px;border:1px solid #F2F2F2;border-radius:5px; cursor:pointer;}
.blockImage:hover{ background-color:#F2F2F2}
.titleResultat{ text-align:center; cursor:pointer;padding: 5px; margin-bottom:-16px; font-size:1.2em; vertical-align:bottom; position:relative; z-index:2;}
.titlePersonalitzar{ text-align:center; cursor:pointer;padding: 5px; margin-top:-16px; font-size:1.2em; vertical-align:bottom; position:relative; z-index:2;}
.divResultat{ margin-left:0px; margin-right:0px;}

.titleSeccioFiltres{ height:50px; padding:10px; font-size:1.3em;}
.titleAfinarFiltres{ height:40px; padding:10px; font-size:1em; margin:0px 0px 10px 0px; background-color:#F2F2F2;}
.accordion{ height:30px; padding:8px 10px; margin:1px; background-color:#F2F2F2; cursor:pointer;}
/*.rectSeleccionable:hover{ background-color: #B9B9B9 !important;}*/
.panelAcc{ margin-bottom:10px; background-color:#F2F2F2; padding:5px 10px;}
.panelAccFills{ height:30px; padding:5px;}
.descFiltre{ width:85%; float:left; box-sizing:border-box; display:inline-block;}
.signFiltre{ width:15%; float:left; text-align:center; box-sizing:border-box; display:inline-block;  position:relative}
.titleAcc{ text-transform:uppercase; font-size:0.9em;}

.active, .accordion:hover { background-color: #B9B9B9 !important;}


.titleMenu{ font-size:1.2em; height:40px; padding:7px}


.recResultat{ height:86vh; overflow:auto;}
.filtresPlantilles{ height:3vh; padding:5px}
.btnFiltres{padding: 1px 3px !important;font-size: 0.88em !important; line-height: 1.2 !important; border-radius: 2px !important; margin-right:5px;}

.divMiddleBottom{height:8vh; position:absolute; bottom:0; width:100%; text-align: center;}

/*------------------AUTH------------------*/
.divMiddleRightAuth{ width:20%; float:left; height: 100%; background-color:#F2F2F2;}
.divMiddleLogo,.divMiddleRightTop{ text-align:center; height:70%;padding:30px}
.divMiddleTitle,.divMiddleRightBottom{ height:30%;}
.divMiddleMiddleAuth{width:80%; float:left; height:100%;}
.divMiddleRightTopAuth{ width:100%;padding:10px}
.divMiddleRightBottomAuth{ width:100%;padding:10px}
.authText{ font-size:1.5em; padding:5px}
.divTextInici{width: 100%;display: inline-block;font-size: 2em; text-align:center;}
.logoInici{width: 50%; height:100%; display: inline-block; background-position:center; background-repeat:no-repeat; background-size:contain; background-image:url(../../images/logo_Principal.png)}
.logoTopBlank{height:1vh;}

/*-----------------------------------------*/



/*------------------ESCOLLIR------------------*/
.divMiddleMiddleEscollir{width:70%;float:left;height:100%;}
.divMiddleMiddleEscollirRight,.divMiddleMiddleEscollirLeft{width:15%;float:left; height:100%;}
.divEscollirL{ width:33%;display: inline-block; float:left; height:100%;font-size:0.8em;}
.divEscollirR{ width:50%;display: inline-block; float:right; height:100%;font-size:0.8em;}
.divEscollirLeft{width: 70%; display: inline-block; float:left; height:100%}
.divEscollirRight{float:right; width:30%;height:100%;}
.imgEscollir{ margin-bottom: 2px; position:relative; height:28px; /*filter:grayscale(100%)invert(100%)sepia(100%)saturate(10000%)hue-rotate(-50deg);*/}
/*.titleEscollir{ font-size:3em; padding:10px;  text-align:center; color:black;}
.titleEscollirFill{ font-size:1.5em; text-align:center; color:black;}
*/
li.li_seccions{text-align:center;cursor:pointer;}
.li_seccions_title{text-align:center; cursor:pointer;}
.escollirSeccionsTop{ height:20%;}
.escollirSeccions{ height:60%;}
/*--------------------------------------------*/


/*------------------PRINCIPAl------------------*/
.titleFill{font-size:1em;}
.divResultat{width:100%; height:100%;}
label.filtresLabel{width:75%; overflow:hidden; height:30px; line-height:30px;}
/*---------------------------------------------*/


/*------------------EDITAR------------------*/
.blockImageEditar{border:1px solid #F2F2F2;border-radius:5px; cursor:pointer; height:100%;}
.imgResultatDisseny{background-size:contain; background-repeat:no-repeat; background-position:center; width:100%; height:100%; text-align:center; cursor: default;}
/*.blockImage:hover{ background-color:#F2F2F2}*/
.imgResultat{ transition: transform .2s;background-image:url(images/logo_Principal.png); background-size:contain; background-repeat:no-repeat; background-position:center; width:100%; height:25vh;  margin:5px; z-index: -1;}
.imgResultat:hover { transform: scale(1.4); z-index: -1;}
.rectRightTot{width:100%; height:100px; display:inline-block; background-color:#F2F2F2; border-top:3px solid #E2E2E2; border-right:3px solid #E2E2E2; float:left;box-sizing: border-box; cursor:pointer; margin:0px}
.divEtiquetesLeft{ text-align:right}
.divEtiquetesRight{padding-left:10px;}
.divEtiquetesLeft,.divEtiquetesRight{ width:50%; float:left; height:100px;}
.divEtiquetes{height:100%;}
.divInputImage { height: 70px; width: 90px; border-radius: 10%; display: inline-block;margin: 15px; border: 2px solid #000; background-size: contain; background-repeat: no-repeat; background-position: center;}
.textEtiquetes{color:black; height: 70px; width: 90px; border-radius: 10%; display: inline-block; margin: 15px;border: 2px solid #000;background-size: contain;}
.divEtiquetesText{ margin-top:-5px; font-size:1em;float:left;padding: 42px 0px;}
/*---------------------------------------------*/


/*------------------PERSONALITZAR------------------*/
.panelPerso{ margin-bottom:10px; background-color:#F2F2F2;}
.divMiddleLeftNav{width:40px; z-index:100; position:absolute; right:0}
.divMiddleRightNav{float:left; width:40px; position:absolute; z-index:100}
.buttonsRight{height:21.5vh; border:1px solid #E2E2E2; background-color:#F2F2F2; cursor:pointer; width:3vw; display:inline-block; float:right; box-sizing:border-box; max-width:40px; clear:both}
.titleBtnRight{top: 50%;position: relative; font-size:1.2em; text-align: center; transform:rotate(-90deg)}
.panelRightTop{height:6vh; background-color:#F2F2F2; line-height:8vh; text-align:center;}
.panelTextRightTop{height:10vh; background-color:#F2F2F2; line-height:8vh;}
.titleRight{font-size:1.5em;}
.subTitleRight{font-size:1.2em;}
/*.panelRight{overflow-y:auto;overflow-x:hidden;height:auto;height:76.3vh; background-color:#F2F2F2; padding: 10px 10px 10px 10px;}*/
.panelImage{height:66.3vh;}
.panelImageHalf{height:35vh; overflow-y:auto;overflow-x:hidden;}
.divTextTop{height:80%; text-align: center;}
.divTextTop{padding:25px;}
.divColorsBottom{height:20%; text-align: center;}
/*.divColorsMostra{ height:60px; width:60px; border-radius: 50%; display: inline-block; position: relative;}*/
.divColorsText{ margin-top:-5px; font-size:0.9em;}
/*.panelRightBottom{height:7vh; background-color:#F2F2F2; cursor:pointer; line-height:8vh; border: 1px solid #E2E2E2;}*/
.panelClickable:hover{background-color: #E2E2E2;}
.titleTornar{ font-size:1.5em}
.paletesLeft{ float:left; width:100%; height:100%; padding:0 1px; /*border:1px solid #E2E2E2*/}
.paletes{ float:left; width:100%; height:100%; padding:0 1px; background-color:#F2F2F2;  /*border:1px solid #E2E2E2*/}
.rectRight{width:50%; display:inline-block; background-color:#F2F2F2; float:left;box-sizing: border-box; cursor:pointer}
.panelCenterBottom{height:8vh; background-color:#F2F2F2; cursor:pointer; line-height:8vh; display:inline-block; padding:0 20px}
.rectMides{padding:2px;}

.rectRightTotPerso{width:100%; height:100px; display:inline-block; background-color:#F2F2F2; border-bottom:2px solid #E2E2E2; float:left;box-sizing: border-box; cursor:pointer; margin:0px; padding:30px 0;}
.divTextText{ font-size:20px;}
.btn_afegir{background-color: #F2F2F2; border: 1px solid black; border-radius: 2px;width: 40px;  font-size: 1.3em; height:40px;}
.imgBtn{ width: 6vh; margin-bottom: 2px; position:relative; }
.divMotius{height:100%;}
.divMotiuMostra{width:90%; height:90%; margin:10px;}
.divMotiuMostra svg {width: inherit; height: inherit;}
/*---------------------------------------------*/


.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
    color: black !important;
    cursor: pointer !important;
    background-color: #F2F2F2 !important;
    border: 1px solid black !important;
    border-bottom-color: transparent !important;
}
.nav-tabs > li > a:hover {
    border-color: #F2F2F2 #F2F2F2 black !important;
}
.nav > li > a:hover, .nav > li > a:focus {
    text-decoration: none !important;
    background-color: gray !important;
}

.nav > li > a {
	position: relative;
	display: block;
	padding: 5px 20px 5px 20px !important;
}





.rectRightColor{width:12.5%; height:3vw; display:inline-block; background-color:#F2F2F2; float:left;box-sizing: border-box; cursor:pointer}
.divColorsTop{height:80%; text-align: center; padding-top:10%;}
/*.divColorsMostra{ width:2.5vw; height:2.5vw; border-radius: 50%; display: inline-block; position: relative;}*/
.divColorsMostra_s{ height:40px; width:40px; border-radius: 50%; display: inline-block; position: relative;}
.divColorsMostra_xs{ height:25px; width:25px; border-radius: 50%; display: inline-block; position: relative;}

.divMiddleMenu{height:6vh; text-align:center; width:100%; float:left; padding-top:0px;}
.tableMiddleMenu{width:43%;}
.tableMiddleMenu td{padding:0px 20px 0 20px; line-height:6vh; z-index:0; position:relative; font-size:1.2em; text-align:center; text-shadow: -1px 0 #F2F2F2, 0 1px #F2F2F2, 1px 0 #F2F2F2, 0 -1px #F2F2F2; vertical-align: top;}
.tableMiddleMenu td p{z-index:2;}
.tableMiddleMenu td p:hover{cursor:pointer; color:#e67300;}
.paletaSelected{color:#e67300;}

.titleEscollir{ font-size:1em; padding:10px;  text-align:center; color:black;}
.titleEscollir:hover{cursor:pointer; color:#e67300;}
.titleEscollirSelected{color:#e67300;}
.titleEscollirFill{ font-size:1.5em; text-align:center; color:black;}

.divMapes{padding-top: 10%;}

.rectSeleccionable{ transition: transform .2s;}
.rectSeleccionable:hover{ transform: scale(1.4); cursor:pointer;}
.rectSeleccionable_2{ transition: transform .2s;}
.rectSeleccionable_2:hover{ transform: scale(1.2); cursor:pointer;}
.rectSeleccionable_3{ transition: transform .2s;}
.rectSeleccionable_3:hover{ transform: scale(1.1); cursor:pointer;}

.titleTextLeft{float:left; height:40%; padding-left:15%; font-size:1.5em;}
.titleTextRight{float:right; width:100%; height:40%; font-size:1.5em; position:relative;}
.titleTextRight:hover{cursor:pointer;color:#e67300;}
.textPers{background-color: #F2F2F2; border: 1px solid black; height: 30px; padding: 5px; font-size:1.3em; width:70%;}
.rectRightTotText{width:100%; height:100%; display:inline-block; background-color:#F2F2F2; float:left;box-sizing: border-box; margin:0px; }
.panelRightText{overflow-y:auto;height:auto;height:97%; background-color:#F2F2F2; padding: 10px 10px 10px 10px;}
.panelRightTipusText{overflow-y:auto;height:auto;height:97%; background-color:#F2F2F2;}
.panelRightMaterials{overflow-y:auto;overflow-x: hidden; background-color:#F2F2F2; padding-top:20px; padding-left:25px; padding-right:25px;}
.titleTextColor:hover,.mostraTextTipus:hover,.divEscollirEscena:hover{cursor:pointer;color:#e67300;}
.titleTextColor{font-size:1.5vw;}

.divEscollirEscena{height:40px; border-bottom:1px solid black; vertical-align:central; padding-top:12px; width:50%;}
.divEscollirEscena:nth-of-type(odd){border-right:1px solid black;}

.divTextText_sm{ font-size:16px;}

.divChildSeleccionable{ font-size:.8em; transition: transform .2s;}
.divChildSeleccionable:hover > div{ transform: scale(1.1);}
.divChildSeleccionable:hover{color:#e67300;cursor:pointer;}
.isSelected,.tmpIsSelected{color:#e67300;}
.isSelected > div,.tmpIsSelected > div{ transform: scale(1.2);}
.isSelected > div {
    border: 2px solid #e67300;
    position: relative;
}
.isSelected > div:before {
    position: absolute; display: block; content: '';
    border: 2px solid #F2F2F2;
	border-radius: 25px;
    height: 100%; width: 100%;
    box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;
}


canvas {border: 1px solid LightGray; border-bottom: 0px;}

.paletaMotiusHalf{height:43%;}
.paletaTextHalf{height:40.5%;}
.paletaEscenesHalf{height:39%;}
.paletaEscenesHalfImatges{height:38%;}
.paletaImagesHalf{height:45.5%;}

.rectFinalitzar{border: 1px solid #E2E2E2;}

.rectImgsFons{overflow-y:auto;overflow-x:hidden;text-align:left;padding-top:20px; border-top:1px solid #292828;}

#divCanvas{padding-top:6vh;}
.rectRightMotiu{width:33.3%}

/* Canvis 25/03/2021 */

.paletesFlotants{ float:left; width:100%; height:100%; padding:0 1px; background-color:#F2F2F2; z-index:10;}
.divMenuButton, .divMenuButtonDisabled{line-height:35px; width:100%; background-color:#EAEAEA; margin-top:10px; padding:6px 10px; font-size:1.15em;}
.divMenuButton span, .divMenuButtonDisabled span{padding-left:10px; font-size:1em;}
.divMenuButton:hover{cursor:pointer; filter: brightness(85%);}
.divMenuIcon{transition: transform .2s;}
.divMenuButton:hover .divMenuIcon{ transform: scale(1.2); }

.divMenuOpcio{line-height:35px; width:100%; border: 1px solid #EAEAEA; margin-top:10px; padding:6px 10px; font-size:1.15em;}

.divMenuTitle{line-height:35px; width:100%; background-color:#EAEAEA; margin-top:2px; padding:6px 10px; font-size:1.15em;}

.panelRight{overflow-y:auto;overflow-x:hidden;height:auto;height:100%; background-color:#F2F2F2; padding: 10px;}
.divMiddleRightPaleta{ background-color:#F2F2F2;overflow:hidden;}

#divMenuRightMenu{font-size:.8em; text-align:center; border-bottom:1px solid #C4C4C4;}
#divMenuRightMenu .row p{margin-bottom: 2px;}
#divMenuRightMenu .row div.paletaSelected{z-index: 12;}
#divMenuRightMenu .row div.paletaSelected div.menuBorder{background-color:#e67300;}
.menuBorder{width:60px; height:2px;}
.menuEscollir{float:left;}
.menuEscollir p{font-size:.94em;}
#divMenuRightMenu .menuEscollir:hover{cursor:pointer; color:#e67300;}
#divMenuRightMenu .row div span{font-size: 20px;}

.titleTextMenus{font-size:.8vw; font-weight:bold; padding-left:5%;}
#divChangeColor, #divChangeColorMotiu{border-bottom:1px solid #DDDDDD; padding-top:0px;}
#divColors{padding:0px;}
#svgColorsBasics p{padding-top:6px; font-size:1.1em;}
.divColorsMostra{ width:1.6vw; height:1.6vw; border-radius:50%;}
.divColorsMostra_sm{ width:1.4vw; height:1.4vw; border-radius:50%;}

.valign-content{display:flex;align-items:center;}

.mostraTextTipus{font-size:1.2em; height:40px; border-bottom:1px solid #DDDDDD; vertical-align:central; padding-top:12px;}
.mostraTextTipus:nth-of-type(odd){border-right:1px solid #DDDDDD;}
#font_text{font-size:1.2em; height:100%; float:left;}

#containerColorsDetalls > div, #containerColorsDetallsProp > div{min-width:150px;}