/* css reset */

body {
    height:             100%;
    background-color:   #333333;
    font-family:        Arial, sans-serif;  
    font-size:          16px;
    font-weight:        normal;
    padding:            0px;
    margin:             0px;
    }

html {
    font-size:          16px;
}

div {
    padding:            0px;
    margin:             0px;
    font-size:          16px;
    text-align:         center;
    align-content:      center;
}

th {
    font-size:          16px;
}

td {
    font-size:          16px;
}

form {
    font-size:          16px;
}

ul {
    display:            flex; 
    flex-direction:     row;
    align-items:        center;
    font-size:          16px;
    padding:            0px;
    margin:             0px;
}

li {
    list-style-type:    none;
    font-size:          16px;
    padding:            0px;
    margin:             0px;
}

a {
    text-decoration:    none;
    font-size:          16px;
    font-weight:        bold;
  }        

input[type=button] {
    font-size:          16px;
    font-weight:        bold;
  }        

/* common settings - id & classes */

input[type=checkbox] {
    transform:          scale(1.5);
    }

.corner {
    border-style:       none;
    border-width:       1px;
    border-radius:      10px;    
}

.solid {
    box-shadow:         rgba(0, 0, 0, 0.17) 0px -2px 3px 0px inset, rgba(0, 0, 0, 0.15) 0px -4px 3px 0px inset, rgba(0, 0, 0, 0.1) 0px -6px 7px 0px inset, rgba(0, 0, 0, 0.06) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px;    
}

.row {
    display:            flex; 
    flex-direction:     row;
    align-items:        center;
}

.color {
    background-color:   #FFFFFF;
}

.warning {
    background-color:   #FFFF88;
}

.content {
    width:              940px;
}

.flex {
    flex:               1;
}

.spaced {
    padding-right:      20px;
}

.left {
    text-align:         left;
}

.center {
    display:            grid;
    place-items:        center;
}

.row {
    display:            flex; 
    flex-direction:     row;    
}

.column {
    display:            flex;
    flex-direction:     column; 
}

.width {
    width:              700px;
}

.login {

}

/* site layout */

#main {
    display:            grid;
    place-items:        center;
    padding-top:        20px;
    padding-bottom:     30px;
    }

#container {
    padding:            30px;    
}

#content {
    padding:            20px;    
}

/* header */

#header {
    padding:            20px;
    place-items:        start;
    }

#header ul.brand {
    display:            block;
    padding-bottom:     8px;
    }
    
#header li {
    padding-right:      30px;
    }

#header li.logo {
    padding-right:      0px;
    }

#header img.luciano {
    border-radius:      50px;
    box-shadow:         0px -1px 10px 5px #888888;
}    

#header ul.brand li {
    display:            block;
    }

#header li.brand {
    font-size:          26pt;
    font-style:         italic;
    font-weight:        normal;
    color:              #555555;
    letter-spacing:     2px;
    text-shadow:        1px 1px 0 #AAAAAA, 
                        2px 2px 0 #AAAAAA, 
                        2px 3px 3px #AAAAAA;
    }
#header li.motto {
    font-size:          11pt;
    font-style:         italic;
    color:              #777777;
    letter-spacing:     2px;
    text-shadow:        1px 1px 0 #AAAAAA, 
                        1px 1px 1px #CCCCCC;
    }

#header li.test {
    font-size:          16pt;
    font-style:         italic;
    color:              #777777;
    letter-spacing:     1px;
    text-shadow:        1px 1px 0 #AAAAAA, 
                        1px 2px 2px #CCCCCC;
    }

#header span { 
    display:            inline-block; 
    }

#header span::first-letter  {
    color:              #FF0000;
    font-weight:        bold;
    }
    
/* main content */
    
#contatti li {
    width:              120px;
    }

#spot th {
    color:              #FF0000;
    width:              190px;
    text-align:         left;
}

#spot td {
    text-align:         left;
}

#prezzi ul {
/*    padding-bottom:     5px; */
    line-height:        150%;
    }

#prezzi li {
    width:              270px;
    text-align:         left;
    }

#prezzi li.prezzo {
    width:              100px;
    }
        
#prezzi li.button {
    width:              120px;
    }
        
#prezzi li.nota {
    width:              250px;
    }
        
#register ul.block {
    display:            block;
    }        
        
#register li {
    width:              300px;
    padding:            5px;
    text-align:         left;
    }
    
#register li.input {
    width:              150px;
    }

#register li.button {
    width:              80px;
    }

/* footer */

#footer {
    font-size:          14px;  
    letter-spacing:     1px;
    padding:            20px;
    }

#footer a {
    font-size:          14px;  
    font-weight:        normal;  
    }

@media only screen and (hover: none) and (pointer: coarse){
    
div {
    font-size:          14px;
}

a {
    font-size:          14px;
}

#footer {
    font-size:          12px; 
    }

#footer a {
    font-size:          12px;  
    }