/* Autor: (c) trading tecno*/

@media only screen 
and (min-width : 0px) 
and (max-width : 990px) {
.index-menu-1 {display:none}
.index-menu-2 {display:block}
.index-cos-opcions-1 { display:none}
.index-cos-opcions-2 { display:none}

.area-vocabulari {font-size:12px}
.area-vocabulari-titols {font-size:12px}
.tr-vocabulari {height:20px;line-height:120%}
/*.index-body {background-image:url()}*/

.index-cos {width:100%}
.index-graella-1 { float:left; margin-left:2px; margin-right:0px}

.index-elements {width:320px;margin:auto}
#logo-1 {display:block}
#logo-2 {display:none}
.index-cos,.index-peu {max-width:450px}
#sant-tots, #sant-notes, #sant-nom {height:100%;max-width:95%}
#sant-tots, #sant-notes {overflow:hidden}
#sant-mes {font-size:18px}
.index-cos-dreta{height:100%}
#peu-tt{clear:both;font-size:12px;margin-bottom:20px;margin-right:17px}
.formulari-text, .formulari-text-2, .formulari-text-10 {font-size:1.4em}

}

@media only screen 
and (min-width : 991px) 
and (max-width : 1300px) {
.index-menu-1 {display:block}
.index-menu-2 {display:none}
.index-cos-opcions-1 { display:none}
.index-cos-opcions-2 { display:none}

.area-vocabulari {font-size:22px}
.area-vocabulari-titols {font-size:22px}
.tr-vocabulari {height:40px;line-height:120%}
/*.index-body {background-image:url()}*/

.index-cos {width:100%}
.index-graella-1 { float:left; margin-left:1px; margin-right:1px }
.index-elements {width:910px;margin:auto }
#logo-1 {display:none}
#logo-2 {display:block}
.index-cos,.index-peu {width:910px}
#sant-tots, #sant-notes, #sant-nom {height:100px}
#sant-tots, #sant-notes {overflow-y:scroll}
#sant-mes {font-size:22px}
.index-cos-dreta{height:450px}
#peu-tt{clear:both;font-size:12px;margin-right:17px}
.formulari-text, .formulari-text-2, .formulari-text-10 {font-size:1.6em}

}


@media only screen 
and (min-width : 1301px) 
and (max-width : 2600px) {
.index-menu-1 {display:block}
.index-menu-2 {display:none}
.index-cos-opcions-1 { display:none}
.index-cos-opcions-2 { display:none}

.area-vocabulari {font-size:22px}
.area-vocabulari-titols {font-size:22px}
.tr-vocabulari {height:40px;line-height:120%}
/*.index-body {background-image:url(imatges/fons-vertical-2.jpg); background-repeat:no-repeat; background-position: 40px 380px }*/

.index-cos {width:100%}
.index-graella-1 { float:left; margin-left:3px; margin-right:3px }
.index-elements {width:70% }
#logo-1 {display:none}
#logo-2 {display:block}
.index-cos,.index-peu {width:910px}
#sant-tots, #sant-notes, #sant-nom {height:100px}
#sant-tots, #sant-notes {overflow-y:scroll}
#sant-mes {font-size:22px}
.index-cos-dreta{height:450px}
#peu-tt{clear:both;font-size:12px;margin-right:17px}
.formulari-text, .formulari-text-2, .formulari-text-10 {font-size:1.6em}
}

@font-face {
  font-family: NotoSans;
  src: url(fonts/NotoSans/NotoSans-Light.ttf);
  font-display: swap;
  /* abans Times New Roman */
}
@font-face {
  font-family: Montserrat;
  src: url(https://tradingtecno.net/fonts/Montserrat/Montserrat-Light.ttf);
  font-display: swap;
}

body {
font-family:NotoSans, Times, serif ;
/*font-family: ATSackersClassicRoman, ATSackersClassicRomanIE, Times New Roman;*/
scrollbar-face-color: #cccccc;
scrollbar-shadow-color: white;
scrollbar-highlight-color:red;
scrollbar-3dlight-color: green;
scrollbar-darkshadow-color: white;
scrollbar-track-color: white;
scrollbar-arrow-color: white;


}
/*
::-webkit-scrollbar {
    width: 12px;
}
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    border-radius: 10px;
}
::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}

*/


html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
input[type="checkbox"]  {outline:1px solid #cccccc}
.index-body { background-color:white; border-top:80px; margin:0px; }

.index-logo {float:left; border:2px solid white;width:150px; height:167px; margin-right:40px;margin:auto}
.index-elements {clear:both; margin:auto; margin-bottom:4px;margin-top:20px}
.index-noticies-peu {clear:both; width:95%; max-width:910px; min-width:312px; height:40px;margin:auto;color:#FF6600;font-size:26px; cursor:default}
.index-peu {clear:both; width:95%; max-width:910px; min-width:312px; height:80px; margin:auto}

.index-graella-1 {  border:2px solid white; width:140px; height:167px}

.index-graella-1:hover, .index-graella-0:hover { border:2px solid #ffffff; opacity:1; filter:alpha(opacity=100); cursor:pointer }

.index-menu-1 { clear:both; width:100%;margin:auto; max-width:902px; min-width:310px; height:35px;  color:#999999;  font-size:32px}
.index-menu-2 { clear:both; width:100%;margin:auto;  border:1px solid #FFFFFF;  color:#999999;  font-size:32px}


.index-opcio-1 { float:left; width:118px; border:1px solid white; display:block; font-size:22px; text-align:center; padding:4px; cursor:pointer; }
.index-opcio-1:hover { border:1px solid #FF9900; background-color:#FF9900; color:white; display:block; cursor:pointer }

.index-opcio-2 { clear:both; width:130px; margin:auto;border:1px solid #ffffff; display:block; font-size:20px; text-align:center; padding:5px }
.index-opcio-2:hover { border:1px solid #FF9900; background-color:#FF9900; color:white; display:block;  cursor:pointer }

.index-cos {clear:both; margin:auto;   min-width:200px; max-height:450px; position:relative;margin-top:20px}
.index-cos-opcions-vell { width:100%; position:absolute; display:none; border:1px solid black; background-color:black; opacity:0.8; color:black; font-size:18px;}

.index-cos-opcions-1 { position:absolute; color:black; opacity:0.8; font-size:20px; z-index:2}
.index-cos-opcions-2 { width:130px;margin:auto; border:1px solid #ffffff;color:black; opacity:0.8; font-size:20px; padding-left:5px;padding-right:5px;}
.index-cos-opcions-1:hover,.index-cos-opcions-2:hover {   cursor:pointer}

.index-cos-opcions-element {clear:both; width:118px; border:1px solid #cccccc; background-color:white; color:#006699; display:block; text-align:center;  padding:5px;}
.index-cos-opcions-element:hover { background-color:#FF9900; color:white; cursor:pointer}

.index-cos-esquerra{float:left; width:100%; max-width:450px;max-height:450px;position:relative;margin-right:1px}
.index-cos-dreta {float:left; width:100%; max-width:450px; position:relative; color: black; font-size:22px; margin-left:1px;}
.finestra-cos-esquerra { position:absolute;width:100%; max-width:400px;left:20px; bottom:20px; background-color:white;color:white; border:1px solid #FF6600;height:50px;padding:4px ;opacity:0.1;display:none}

.index-cos-s1 {width:40%; float:left; margin-left:10px;}
.index-cos-s2 {width:10%; float:left; margin-left:10px}
.index-cos-s3 {width:43%; } 

a {text-decoration: none; }
a:focus { outline: thin dotted; }
a:hover, a:active { outline: 0; }
a:visited {color:#FFFFFF}

p {text-align:justify;}

ul, ol { margin: 1em 0; padding: 0; }
li {list-style:none}

img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }

table {border-collapse: collapse; border-spacing: 0; }
td {vertical-align: top;}

.scroll {color:#381c00;font-size:20px }

.rodo5  { -moz-border-radius: 5px;   -webkit-border-radius: 5px;    -khtml-border-radius: 5px;    border-radius: 5px;}
.rodo10 { -moz-border-radius: 10px;  -webkit-border-radius: 10px;   -khtml-border-radius: 10px;   border-radius: 10px;}
.rodo15 { -moz-border-radius: 15px;  -webkit-border-radius: 15px;   -khtml-border-radius: 15px;   border-radius: 15px;}

.opac40 { opacity:0.4; -moz-opacity: 0.4; filter:alpha(opacity=40); }
.opac70 { opacity:0.7; -moz-opacity: 0.7; filter:alpha(opacity=70); }

.ombra1 { box-shadow: 2px 2px 8px #999999; 	-moz-box-shadow: 3px 3px 4 #999999; 	-webkit-box-shadow: 3px 3px 4 #999999; }
.ombra2 { box-shadow: 2px 2px 8px #000000; 	-moz-box-shadow: 3px 3px 4 #000000; 	-webkit-box-shadow: 3px 3px 4 #000000; }

.fons-150-1 { background-image:url(imatges/150x150-fons-1.jpg); background-repeat:no-repeat; opacity:0.5; filter:alpha(opacity=50);  background-position:center top}
.fons-150-1:hover { opacity:1; filter:alpha(opacity=100); }
.fons-150-2 { background-image:url(imatges/150x150-fons-2.jpg); background-repeat:no-repeat; opacity:0.5; filter:alpha(opacity=50);  background-position:center top}
.fons-150-2:hover { opacity:1; filter:alpha(opacity=100); }
.fons-150-3 { background-image:url(imatges/150x150-fons-3.jpg); background-repeat:no-repeat; opacity:0.5; filter:alpha(opacity=50);  background-position:center top}
.fons-150-3:hover { opacity:1; filter:alpha(opacity=100); }
.fons-150-4 { background-image:url(imatges/150x150-fons-4.jpg); background-repeat:no-repeat; opacity:0.5; filter:alpha(opacity=50);  background-position:center top}
.fons-150-4:hover { opacity:1; filter:alpha(opacity=100); }

.fons-130-1 { background-image:url(imatges/130x145-fons-1.jpg); background-repeat:no-repeat; opacity:0.5; filter:alpha(opacity=30);background-position:center top}
.fons-130-1:hover { opacity:1; filter:alpha(opacity=100); }
.fons-130-2 { background-image:url(imatges/130x145-fons-2.jpg); background-repeat:no-repeat; opacity:0.5; filter:alpha(opacity=30);  background-position:center top}
.fons-130-2:hover { opacity:1; filter:alpha(opacity=100); }
.fons-130-3 { background-image:url(imatges/130x145-fons-3.jpg); background-repeat:no-repeat; opacity:0.5; filter:alpha(opacity=30);  background-position:center top}
.fons-130-3:hover { opacity:1; filter:alpha(opacity=100);}
.fons-130-4 { background-image:url(imatges/130x145-fons-4.jpg); background-repeat:no-repeat; opacity:0.5; filter:alpha(opacity=30);background-position:right top }
.fons-130-4:hover { opacity:1; filter:alpha(opacity=100); }
.fons-130-5 { background-image:url(imatges/130x145-fons-5.jpg); background-repeat:no-repeat; opacity:0.5; filter:alpha(opacity=30);background-position:right top }
.fons-130-5:hover { opacity:1; filter:alpha(opacity=100); }
.fons-130-6 { background-image:url(imatges/130x145-fons-6.jpg); background-repeat:no-repeat; opacity:0.5; filter:alpha(opacity=30);background-position:right top }
.fons-130-6:hover { opacity:1; filter:alpha(opacity=100); }

.titol-1-admin { clear:both;width:100%; margin:auto; height:50px; background-color:#990000; color:white; font-weight:bold; text-align:left; font-size:18px}
.admin-body {margin:0px; }
.admin-carpeta {clear:both;width:100%;margin:auto}

.informacio-4 { clear:both;width:99%; margin:auto; color:white; text-align:left; font-size:22px; padding:4px; background-color:#990000;color:white}

.pestanya-3-gris { float:left;  width: 100px; height:40px;color:#990000; text-align:center; font-size:20px; background-image:url(imatges/boto-10-gris.png); background-repeat: no-repeat; line-height:210%; cursor:pointer}
.pestanya-3-vermell { float:left;  width: 100px; height:40px;color:white; text-align:center; font-size:20px;  background-image:url(imatges/boto-10-vermell.png); background-repeat: no-repeat; line-height:210%; cursor:pointer}

.pestanya-3-gris:hover {background-image:url(imatges/boto-10-vermell.png); background-repeat: no-repeat; color:white}

.icona {opacity:0.6}
.icona:hover {opacity:1}
.separador-20 {height:20px}

.titol-1 {font-size:32px; color:#006699;padding:5px;text-align:left; }
.texte-1 {font-size:18px;color:#999999; height:390px; padding:10px; overflow:hidden }
.amunt-avall {clear:both; text-align:right; height:40px;margin-top:5px;padding-right:15px;cursor:pointer}

.area-vocabulari-titols {width:97%;height:30px; color:#999999}
.area-vocabulari {width:97%;height:370px; color:#999999; border:1px solid #FF9900; overflow:hidden}
.tr-vocabulari {border:1px solid #cccccc}
.tr-vocabulari:hover {color:#006699; cursor:default}

.mapa { width:100% }
.imatge-boto:hover {width:20px; height:20px}
#textex {
position:absolute; color:white; font-size:22px; padding:5px; bottom:40px; margin-left:10px; width:90%; left:5px; text-align:justify; max-height:100px;  background-color:black} 
#textex2{
position:absolute; color:white; font-size:22px; padding:5px; bottom:40px; margin-left:10px; width:90%; left:5px; text-align:justify; max-height:100px;text-shadow:2px 2px black} 

#peu-info{float:left; width:100%; margin:auto; text-align:center; font-size:12px; color:#999999; color:#666666; padding-bottom:10px}
#peu-info a {}
#peu-telefon {font-size:16px}
#peu-icones {position:relative; width:100%;right:15px;margin-bottom:70px}
    
#sant-nom {width:70%;  float:left;color:#006699;font-size:38px; padding-left:5px; cursor:default}	
#sant-dia-mes {width:100px; height:100px;  float:left;text-align:center;color:#006699;border:3px solid #02569c; background-color:white;  text-shadow:1px 1px #cccccc;cursor:default;margin-left:5px}
#sant-dia {font-size:64px; cursor:default}
#sant-mes {cursor:default}
#sant-notes {clear:both; width:100%;  font-size:18px;color:#666666;padding:5px;text-align:justify; cursor:default}
#sant-pastis {clear:both;width:100px;height:100px;float:left;margin:5px}
#sant-pastis-nom {color:#006699;font-size:22px; padding:10px;text-align:justify;cursor:default}
#sant-pastis-descripcio { width:90%; color:#006699;font-size:20px; padding-left:10px; padding-right:10px;text-align:justify;;margin-top:5px;cursor:default}
#sant-tots {clear:both; width:100%;  font-size:18px;color:#666666;padding:5px;text-align:justify;cursor:default}


.formulari {
font-size:16px;
text-align:center;
color:#333333;
background-color:#CCCC66;
font-weight:bold;
margin-top:20px;
margin-bottom:20px;
padding-bottom:10px;
padding-left:10px;
padding-right:10px;
width:90%;
margin:auto;
border:2px solid #ffffff;
font-family:NotoSans, Times, serif;
}

.formulari-text {width:95%}
.formulari-text-2 {width: 60px; text-align:center }
.formulari-text-10 {width: 150px; text-align:center }
.formulari-text, .formulari-text-2, .formulari-text-10 {background-color:#FFFFFF; color:#000000;}


.status {text-align:center; color:#336600;font-size:20px;margin-top:5px;margin-bottom:10px; font-family:Arial, Helvetica, sans-serif}

.enllac { font-size:14px;border:1px solid white;padding:5px; background-color:#333333; color:#999999; text-decoration:none;margin-left:5px; margin-right:5px; font-family:Arial, Helvetica, sans-serif }
.enllac:hover { background-color:white; color:#FF9900}

.boto-1 {font-size:22px; background-image:url(imatges/fons-1.jpg); background-repeat:repeat-x;color:white}

.barra-cap {
clear:both;
width:100%;
height:40px;
border-top:2px solid #ffffff;
color:#999999;
padding-top:12px;
font-family:NotoSans, Times, serif;
text-align:center;
font-size:18px;
}

.titol,.dia,.texte,.peu {
width:100%;
text-align:center;
}
.dia {margin-top:20px;margin-bottom:20px;font-size:22px; font-weight:bold }

.peu {display:block; margin:0px auto; width:90%}
#peu-amunt {position:fixed;bottom:10px;right:10px;width:50px;height:50px;cursor:pointer;z-index:1}

.texte {
margin:auto;
text-align:center;
width:90%;
padding-left:10px;
pading-right:10px;
margin-top:15px;
}

.div-logo {
width:100%;
text-align:center;
margin-top:25px;
}