body { padding-bottom: 70px; font-family: "Muli", Arial, Helvetica, sans-serif; background-color:#eee; line-height: normal }

.left { float:left }
.right { float:right }
.clear { clear:both }
.middle { vertical-align:middle }
.hidden { display:none }
.block { display:block }
.strong { font-weight:bold }
.inline-block { display:inline-block; vertical-align:top }
.hidden { display:none }
ul, li { list-style-type:none }
ul.list { list-style-image:url(../images/list_disk.png); margin-left:15px }
ul.list li { margin-bottom:10px }

a:link, a:visited { text-decoration:none; color:#666; transition: all 0.3s ease; }
a:hover, a.active { text-decoration:none; color:#EC6820 }

.small { font-size:85% }
.big { font-size:120% }
.very_big { font-size:150% }
.very_small { font-size:75% }
.red { color:#F60 }
.white { color:#FFF }
.grey { color:#aaaaaa }
.green { color:#329B45 }

.text_color { color: #EC6820; }
.bg_color { background-color: #EC6820; }
.bg_color:hover { background-color:orangered; }

.icon { height: 20px }


input { border:1px solid #aaa; background-color:#FFF; padding: 0 5px 0 5px; line-height: 20px }
input:focus { border:1px solid #666 }
button { border: 0; background: none; cursor: pointer }

.border { border:1px solid #CCC; padding:5px }
.border:hover { border:1px solid #aaaaaa }

.error { background-color: crimson; color: #FFF; padding:5px; margin-bottom: 10px; font-size: 0.9em }



#container_print { padding:20px }

.alert_green { line-height: 25px; padding-left: 20px; color: #FFF; background-color: green; margin-bottom: 2px }
.alert_red { line-height: 25px; padding-left: 20px; color: #FFF; background-color: red; margin-bottom: 2px }
.alert_green a, .alert_red a { color:#FFF }

.field-icon {
  float: right;
  margin-right: 8px;
  margin-top: -30px;
  position: relative;
  z-index: 2;
}


#menu_button { padding:10px 0 10px 20px }
#menu_button img { height: 30px; padding-right: 10px }
@media (min-width:700px) {
    #menu_button { visibility: hidden; }
}

#logo { position:absolute; top:10px; right:20px }
#logo img { padding-right: 15px; height: 25px }


.slideout-menu {
    height: 100%; /* Full-height: remove this if you want "auto" height */
    width: 170px; /* Set the width of the sidebar */
    position: fixed; /* Fixed Sidebar (stay in place on scroll) */
    z-index: 1; /* Stay on top */
    top: 0; /* Stay at the top */
    left: 0;
    background-color: #111; /* Black */
    overflow-x: hidden; /* Disable horizontal scroll */
    padding-top: 75px;

}

@media (max-width:980px) {
    .slideout-menu {
    	position: fixed;
    	top: 45px;
    	left: -195px;
    	width: 180px;
    	height: 100%;
    	z-index: 100;
    	padding-top: 20px;

    }
}


#menu { margin: 0; padding: 0; padding-right: 5px; }
#menu li { margin-bottom:5px }
#menu a:link, #menu a:visited { line-height:30px; display:block; width:100%; color: #FFF; padding-left:10px; text-decoration:none; transition: all 0.3s ease }
#menu a:hover, #menu a.active { color:#FFF; background-color:#F60 }

.submenu { margin: 1px 0 20px 0; padding: 0; }
.submenu li { margin-bottom: 1px; }
.submenu li a:link, .submenu li a:visited { padding-left: 5px; line-height:30px; display:block; background-color:#333; text-decoration:none; transition: all 0.3s ease }
.submenu li a:hover, .submenu li a.active { background-color:#333; color:#FFF }

#years { margin-bottom:10px; border-bottom:1px dotted #CCC }

#container { margin-left: 170px; padding: 10px 10px; }
@media (max-width:700px) {
    #container { padding: 0; margin-left: 0; }
}
#contents h1 { padding-bottom:20px }

.cronologia li.border { background:none; border:1px solid #CCC; padding:10px; margin-bottom:5px }
.cronologia li { background-color:#eee; border:1px solid #eee; border-left:5px solid #eee; padding:10px; margin-bottom:5px; border-radius:10px }

.agenda_mod { text-align:center; padding-top:5px; margin-top:10px; margin-bottom:-10px; border-top:1px dashed #FFF }
#agenda td { padding:8px; border:1px solid #CCC; }
#agenda th { padding:8px; border:1px solid #CCC; background-color:#eee; font-weight:bold; }
#agenda td.scadenza { border:1px solid #F00 }
.agenda_box { padding:13px; padding-bottom: 20px; margin-bottom: 8px; background-color:#eee; position: relative }
.agenda_box img { padding-right:10px }

.rapporto td.number input { font-size: 1.2em; width: 70px; line-height: 30px; border:0; background: none; text-align: right }


#paginazione { text-align:center; padding-top:10px }
#paginazione a:link, #paginazione a:visited { line-height:18px; padding:0 5px 0 5px; margin:0 1px 0 1px; background-color:#FFF }
#paginazione a:hover, #paginazione a.active { background-color:#c1c1c1; padding:0 5px 0 5px; color:#FFF }

#popup {
	position:absolute; display:none; overflow:auto;
	width:500px; height:500px; left:50%; margin-left:-250px;
	padding:10px 30px 20px 30px; border:1px solid #B1B1B1; background-color:#FFF;
}


input[type="text"]:invalid, input[type="email"]:invalid, select:invalid {
    border: 2px solid red;
}