﻿/* Layout CSS */
body {font-family: sans-serif, Verdana, Roboto, Geneva, Tahoma;font-size: 1.0em;margin: auto;}

@media screen and (max-width:767px) {
    .appcontainer {width: 100%;margin: auto;margin-top: 55px;box-sizing: border-box;padding: 0 5px 5px 5px;}
}

@media screen and (min-width:768px) {
    .appcontainer {width: 100%;margin: 85px auto;box-sizing: border-box;padding: 0 5px 5px 5px;}
}

.appcontainer h1, h2, h3, h4 {color: firebrick}
.logonversion {position: relative;width: 80%;margin: auto;padding-top: 5px;text-align: right;color: black;}

/* Paragrafi */
.titolo,
.alcentro {text-align: center}
.adestra {text-align: right}
.asinistra {text-align: left}

/* Grid & Button border*/
.noborder_left {border-left: none}
.noborder_right {border-right: none}
.noborder_left_right {border-left: none;border-right: none}
.noborder {border: none}

/* Overlay & Wait panel*/
.overlay {position: fixed;top: 0;left: 0;background-color: rgb(192,192,192);background-color: rgba(192, 192, 192,0.5);width: 100%;height: 100%;z-index: 9500;}

.waitpnlshadow {position: relative;margin: 85px auto;background-color: white;
    border: 1px solid gray;border-radius: 8px; width: 180px;height: 68px;
    box-shadow: rgba(50, 50, 93, 0.25) 0 50px 100px -20px, rgba(0, 0, 0, 0.3) 0 30px 60px -30px;
    font-size: medium;padding-left: 4px;padding-top: 6px;
    z-index: 9000;
}

.waitpaneltext {
    position: absolute;right: 15px;top: 26px;
    z-index: 9005;
}

.waitpnl {position: relative;margin: 85px auto;background-color: white;
    border: 1px solid gray;border-radius: 8px;
    font-size: medium;width: 180px;height: 68px;
    padding-left: 4px;padding-top: 6px;
    z-index: 9000;
}

/* Standard button */
.stdbtn {color: #E5322C;border: 1px solid gray;border-radius: 6px;cursor: pointer;padding: 3px;}
    .stdbtn:hover {border: 2px solid firebrick;background-color: rgb(200,200,200);background-color: rgba(200,200,200,0.4);padding: 2px;}
    .stdbtn:active {background-color: darkgrey;transform: scale(0.92);}

/* Alphabetic Button*/
#abc {position: relative;width: auto;margin: auto;font-size: small;border-spacing: 5px;}
    #abc td {text-align: center;border: 2px solid gray;border-radius: 5px;}
    #abc a {border: none;text-decoration: none;background-color: transparent;width: fit-content;padding-left: 4px;padding-right: 4px;color: black;}
    #abc td:hover {border-color: firebrick;background-color: rgb(0,0,0);background-color: rgba(0,0,0,0.4);}
    #abc a:hover {color: white;}
    #abc td:active, a:active {background-color: darkgrey;transform: scale(0.92);color: white;}
    #abc .selected {background-color: lightgrey}

/* Shadow effect */
.addshadow {box-shadow: rgba(50, 50, 93, 0.25) 0 50px 100px -20px, rgba(0, 0, 0, 0.3) 0 30px 60px -30px;}
.addshadowlight {box-shadow: 0 2px 5px #C0C0C0;}
    .addshadow:active, .addshadowlight:active {box-shadow: none}

/* Timer */
.timerstd {border:1px solid red;padding:2px 10px;}
.timerwarning {border:1px solid black;padding:2px 10px;background-color:red;color:white;}
.refresh {position:fixed;top: 100px; left:38%;  width: 320px; height: 120px;background-color:white;
          z-index:700;border:1px solid gray;border-radius:8px;
          box-shadow: rgba(50, 50, 93, 0.25) 0 50px 100px -20px, rgba(0, 0, 0, 0.3) 0 30px 60px -30px;}

