@font-face {font-family: 'slim';font-style: normal;font-weight: 400;src: url(/font/slim.woff) format('woff'); }
/* button #008bd2 #81bb39*/
body {transition:opacity 1.5s;opacity:0.1;font-family: 'Arial';margin:0;}
html  {margin:0}
*{ box-sizing:border-box; }
a {text-decoration:none;outline:0;font-size:1vw;color:#888;font-weight:normal}
.nodesk{xdisplay:none}
.cal1{width:500px;margin:auto}
.cal1 th{text-align:center}
.cal1 td {padding:5px;height:100px;vertical-align:middle;text-align:center;border-radius:5px;xborder:1px dotted red}
.cal2{width:100px;max-width:100px}
.cal3{position:relative}
.cal4{width:100px;max-width:100px}
.prenblock{display:inline-block;width:49%;vertical-align:top;text-align:center;xborder:1px dotted red}


/*------------------- prenota ---------------------*/
.cat4 {width:80vw;overflow-x:scroll}
.cat1 {xwidth:200px;height:140px;}
.cat2 {width:80px;background:linear-gradient(#008bd2, #20abe2) ;color:white;height:30px;text-align:center;border-radius:8px}
.cat3 {font-size:12px;padding: 0 10px;}
.cat5 {height:60px;border:1px solid white;font-size:12px;text-align:center;background-color:#60dbf2;padding:5px;color:white;white-space: nowrap;font-weight:bold;border-radius:8px}
.cat5 label{font-weight:normal;font-size:10px}


.bull {display:inline-block;width:19px;height:16px;font-size:1px;border-radius:3px;vertical-align: middle;margin:3px}
.green  {background:linear-gradient(#5a5, #7c7)}
.green:hover  {background:#5c5}
.focusable:focus  {border:3px solid steelblue}
.focusable{border:3px solid white;cursor:pointer;border-radius:7px}
.orange  {background:linear-gradient(#d80, #fa2)}
.orange:hover  {background:#e59a10}
.red   {background:linear-gradient(#c55, #e77)}
.blue  {background:steelblue;}
.mezza  {background:linear-gradient(#5a5, #7c7)}
.giornata  {background:linear-gradient(rgb(170, 169, 85), rgb(214, 212, 81))}
.riservata  {background:linear-gradient(rgb(85, 143, 170),rgba(85, 143, 170, 0.678))}
.libero  {background:linear-gradient(rgba(221, 136, 0, 0.26), rgba(255, 170, 34, 0.068))}

.overbook   {background:linear-gradient(#c55, #e77)}
.popup{visibility:hidden;opacity:0;transition:all 0.6s;position:fixed;background:white;margin:0;box-shadow: 0px 0px 23px 0px rgba(0,0,0,0.75);border-radius:10px;}

h2    {color:black;font-family:"Slim";font-size:24px;font-weight:normal;margin-top:5px;}
h3    {color:black;font-family:"Slim";font-size:18px;font-weight:normal;margin-top:5px;}

header    {z-index:10;position:fixed;width:100%;padding-right:10px;height:50px;background:linear-gradient(to left, #444c54, #222a32);line-height:50px;color:white;font-size:16px;text-align:right}
.loginheader {position:relative;width:100%;padding-right:10px;height:50px;background:linear-gradient(to left, #444c54, #222a32);line-height:50px;color:white;font-size:16px;text-align:right}
.headerlogo      {position:absolute;left:10px;top:13px}

/*LOGIN*/
.loginlogo      {position:absolute;left:10px;top:13px}
.loginBox       {width:450px;height:250px;background:white;margin-left:auto;margin-right:auto;overflow:hidden;box-shadow: 5px 5px 16px 10px rgba(0,0,0,0.3);}
.loginContent   {margin:0 20px 0 20px;}
.loginRow       {display:table-row;width:100%;}
.loginCell      {display:table-cell;height:60px;vertical-align:middle;text-align:left;width:50%;}
.loginR         {font-size:11px;color:var(--header-D)}
.loginErr       {font-size:12px;color:red;font-weight:bold}
.loginRow3      {position:relative;width:100%;height:60px;text-align:left;border-top:1px solid #222;}
.loginbtn       {position:absolute;right:0;bottom:0}

.btn {white-space:nowrap;background-color: #008bd2;border: none; color: white;margin:0;height:32px; font-size: 15px; cursor: pointer;margin-bottom:15px;}
.btn:hover {background-color: #81bb39;}
.btn:disabled {background-color: #b2cd7c;color:#d2ed9c;cursor:default}


.btn2 {xwhite-space:nowrap;background-color: #008bd2;border: none; color: white;margin:0;min-height:32px;line-height:32px;padding:0 8px; display:inline-block;font-size: 15px; cursor: pointer;margin-bottom:15px;}
.btn2:hover {background-color: #81bb39;}

button.up       {position:relative;top:-1px}
.inp {border:1px solid #008bd2;height:32px;padding-left:10px;width:30vw;font-size:15px}

table.list      {width:99%;border-spacing:0;}
table.list th   {xborder-bottom:2px solid #aaa;text-align:left;text-align:center}
table.list td   {xborder:1px solid #aaa;text-align:left;line-height:35px;}
table.list .w1  {width:1%;padding-right:10px; text-align:center;white-space:nowrap}
table.list .spuntared {font-size:30px;color:red}
table.list .spuntagreen {font-size:30px;color:green}
table.list .cal1  {padding:5px;height:60px;border:1px solid #ccc;line-height:15px;color:white;cursor:pointer}
table.list .cal1:hover {border:1px solid red}
table.list .cal2  {border-bottom:15px solid white}
.legenda  {font-size:12px}


.pass {opacity:0.5;filter: blur(3px);transition:all 1s}
.pass:hover {filter: none;opacity:1}

tr.hi           {background:#fda}
tr.disabled     {;color:#888}
tr:hover        {background:#eee}
tr.sep:hover  {background:white}
table.form th   {white-space:nowrap;position:relative;background:#eee;text-align:left;height:40px;padding:0 10px}
table.form td   {}
form  {display:inline}
.inp1 {transition:0.5s;width:250px;border:1px solid #ddd;background: linear-gradient(#fff, #eee);font-size:14px;font-family:Arial;height:40px}

.notifica       {animation:notifica 6s forwards;background:#4f8;padding:5px 20px;}
@keyframes notifica{0%{opacity:0} 20%{opacity:1} 80%{opacity:1} 100%{opacity:0}}


xxxxxxxxxxxxxx.ic24           {width:24px;height:24px}
.icon           {vertical-align:middle;margin:0 5px 0 15px;width:24px;height:24px}

.menBtn         {display:none}   
.container      { width:1920px;float:left;position:relative;left:50%;margin-left:-960px;background:#fff; }

/*POPUP*/
#popupcont      {display:none;position:fixed;height:100%;width:100%;top:0;left:0;background:rgba(0,0,0,0.7);z-index:20;}
.cell           {display:table-cell;vertical-align:middle;}
.box            {position:relative;box-shadow: 0px 0px 18px 0px rgba(0,0,0,0.75);background:white;margin-left:auto;margin-right:auto;width:50vw;height:50vh;}
.pop            {width:100%;height:100%;overflow-y:scroll;overflow-x:hidden;padding:15px;}
.tit            {position:absolute;top:0px;left:0;width:100%;font-size:16px;line-height:30px;text-align:center;color:white;background:#222a32}
.close          {position:absolute;top:5px;right:20px;color:red;cursor:pointer;}
.popcont        {border:2px solid transparent;font-size:12px;color:red;margin-bottom:5vh;text-align:center;display:inline-block}
.popcont:hover  {border:2px solid #008bd2;}
.poplink        {font-size:15px;color:#888}
.popbanner      {width:100%;border:2px solid white}
.popcontcat     {width:19%}
.popgadicon     {width:7%}

/* MENU */
nav             {z-index:15;position:fixed;top:50px;text-align:center;width:200px;margin-right:10px;background:#222a32;height:100vh;color:white }
nav .main       {transition:all 0.5s;cursor:pointer;line-height:40px;background:#333b43;margin-bottom:1px;position:relative;font-size:14px; text-transform: uppercase;max-height:40px;overflow:hidden}
nav .main:hover {height:auto;background:#444c54}
nav .ic         {position:absolute;left:10px;top:8px;font-size:24px}
nav .ud         {position:absolute;right:10px;top:12px;width:16px;height:16px}
nav .sub        {padding-left:35px;text-transform:none;text-align:left;line-height:30px;background:#444c54;margin-bottom:1px;position:relative;font-size:13px}
nav .sub:hover  {background-color:#555d65; }
nav .ics        {position:absolute;left:10px;top:6px;font-size:16px;}
nav .sep        {height:1px;border-bottom:2px dotted grey;margin-left:10%;margin-right:10%;margin-bottom:1px;font-size:0;}
.sub:hover .ics {color:#008bd2}
footer          {width:100%; float:left;background:linear-gradient(to left, #444c54, #222a32);color:#fff;text-align:right;height:30px;line-height:30px;padding-right:10px; }
   
main            {transition:opacity:0.3s;position:absolute;top:50px;left:200px;right:0;text-align:left;padding:0 10px;background:white;}
.fisso          {position:fixed;background:white;top:50px;right:0;left:200px;padding-left:10px;z-index:10}
.scroll         {margin-left:0;margin-top:100px}

.btnTestata     {padding:0 10px;color:white;text-align:left}
.btnTestata  i  {font-size:20px}
.seldom1       {border:1px solid #555d65;border-radius: 4px;text-align:left;cursor:pointer;-webkit-appearance: none;-moz-appearance: none;font-size:16px; color:white;background:transparent;}
.seldom1::-ms-expand {display: none;}
.seldom2       {height:20px;margin:10px 0; color:white;background:#444c54; border:none}
.seldom3       {white-space:nowrap;border: 1px solid #008bd2; color: black;margin:0;height:32px; font-size: 15px; cursor: pointer;}
.seldom3       {-webkit-appearance: none;-moz-appearance: none;padding-right:30px;
                 background-image:linear-gradient(45deg, transparent 50%, white 50%),linear-gradient(135deg, white 50%, transparent 50%),linear-gradient(to right, #008bd2, #008bd2);
                 background-position:calc(100% - 15px) 12px,calc(100% - 10px) 12px,100% 0;
                 background-size:5px 5px,5px 5px,30px 30px;
                 background-repeat: no-repeat;
                }
.seldom3::-ms-expand {display: none;}
.ck3           {white-space:nowrap;border:1px solid #008bd2; vertical-align:middle;color: #008bd2;height:32px; font-size: 12px; cursor: pointer;display:inline-block;line-height:32px;padding:0 4px;width:100px;text-align:left;overflow:hidden;text-overflow:ellipsis}


p             {display:inline}

.line          {width:100%;height:1px;border-bottom:1px dotted grey}
/*categorie*/


/*GADGETS*/
.gad1           {height:250px;}
.gad2           {height:50px;}

/*PARAMETRI*/
.logo           {height:80px;}
.cent           {height:250px;}

/*COLORI*/
.inp4          {width:80px;text-align:center}


/*PRODOTTO*/
.fcont          {position:relative;background:url(/img/back.jpg);width:377px;height:372px;overflow:hidden;display:inline-block;}
.fprod          {position:absolute;top:0;left:0;cursor:pointer;width:240px;height:320px;margin-left:70px;}
.fhori          {position:absolute;top:0;left:0;width:100%;height:188px;border-bottom:1px dashed white;cursor:pointer;}
.fvert          {position:absolute;top:0;left:0;width:189px;height:100%;border-right:1px dashed white;cursor:pointer;}
.fshif          {text-align:center;display:inline-block;height:320px;width:50px;}
.frang          {height:240px;writing-mode: bt-lr;-webkit-appearance: slider-vertical;}

.sm            {font-size:9px;color:#008bd2;text-align:center;float:left;margin-right:1vw;}
.inp2          {width:60px;text-align:center}
.txt1           {width:500px;height:150px}
.sel1           {width:120px;}
.ck1            {border:1px solid #ddd;background: linear-gradient(#fff, #eee);font-size:14px;font-family:Arial;line-height:40px;margin-right:1vw;padding:0 0px;width:140px;float:left;overflow:hidden;text-overflow:ellipsis;white-space: nowrap;}
.cnt            {font-size:9px;color:#008bd2;min-width:50px;text-align:center;display:inline-block;}
.inp3            {width:100%}
.txt2           {width:100%;height:250px}
.nw             {font-size:12px;color:#008bd2;white-space:nowrap;padding:10px;}


/*UPLOAD IMMAGINI*/
.fman1          {height:48px;cursor:pointer;max-width:150px;overflow:hidden}
.fman2          {font-size:24px;color:#008bd2}
.fman3          {font-size:32px;color:#ca0;cursor:pointer;}
.fman4          {font-size:22px;}

@media only screen and (max-width: 1920px) {
.container {width:100%;margin:0;left:0;background:white}

}

@media only screen and (max-width: 1000px) {
/*categorie*/

main         {position:relative;left:0;text-align:left;padding:0 10px;margin-left:0;top:30px;margin-top:0px;xborder:1px dotted green}
.fisso      {position:relative;top:0px;left:0;height:auto;xborder:1px dotted red;margin:0}
.scroll     {margin:0}

header          {position:fixed;top:0;left:0;padding-right:10px;height:30px;line-height:30px;font-size:2vw;z-index:10;}
article         {text-align:justify;padding:35px 10px}

nav             {position:fixed;top:30px;left:0;width:100%;float:none;height:auto;display:none}
.icon           {margin:0 1vw 0 3vw;width:20px;height:20px}
.menBtn         {display:inline-block}

.headerlogo      {position:absolute;left:5px;top:5px;height:20px}

/*PRODOTTI*/
.inp3           {height:60px}


footer          {font-size:2.5vw }

}


@media only screen and (max-width: 550px) {
.nodesk{display:block}
h2          {font-size:4vw;}
h3          {font-size:3vw;}
.btnTestata     {padding:0 1vw}
.btnTestata  i  {font-size:3vw}

/*POPUP*/
.box            {width:100vw;height:100vh}
.poplink        {font-size:3vw}
.popbanner      {width:100%;border:2px solid white}
.popcontcat     {width:49%}
.popgadicon     {width:19%}

/*categorie*/



/*PRODOTTO*/
.fcont ,.fprod   {width:180px;height:240px;}
.fhori          {height:119px}
.fvert          {width:89px;}
.fshif          {height:240px;width:10vw;}
.frang          {height:180px;}

.sm            {margin-right:1vw;}
.inp1          {font-size:3vw;height:30px;width:80%}
.inp2          {width:15vw;font-size:3vw;}
.txt1           {width:100%;height:150px}
.sel1           {width:auto;font-size:3vw}
.ck1           {font-size:3vw;line-height:30px;margin:5px 5px}
.inp3           {height:60px}
.txt2           {width:100%;height:150px}



th              {font-size:2.5vw;}
td              {font-size:2vw;}
.btn {height:25px; font-size: 2.7vw}
.seldom3       {height:25px; font-size: 3vw}
.seldom3       {-webkit-appearance: none;-moz-appearance: none;padding-right:30px;
                 background-position:calc(100% - 12px) 10px,calc(100% - 7px) 10px,100% 0;
                 background-size:5px 5px,5px 5px,25px 25px;
                 }
.seldom4       {height:25px; font-size: 4vw}
.ck3        {line-height:25px;}

button.up       {position:relative;top:-1px}
.inp {font-size:3vw;height:25px;}

table.form    {width:100%}
table.form th   {white-space:normal}

table.list td   {line-height:normal}
.seldom1    {text-align:center;font-size:2vw;}
p           {display:none}
.seldom1 option{padding:0;margin:0}

.logincontent{text-align:center;margin:20px}
.loginBox     {width:300px;height:350px;background:white;margin-left:auto;margin-right:auto;}
.logincell {display:inline-block;text-align:center;width:100%;height:40px;line-height:40px}
.loginRow3    {height:80px;padding-top:20px;}
.loginbox {width:250px;font-size:24px;}




.cal1{width:95vw;}
.cal1 th{font-size:3.5vw;text-align:center}
.cal1 td {font-size:3vw;padding:5px;height:60px;vertical-align:middle;text-align:center;border-radius:5px;xborder:1px dotted red}
.cal2{width:100px;max-width:100px}
.date{font-size:4vw;}
.prenblock{display:block;width:100%}
.cat4{width:100%}
}