html, body{
    margin:0;
    padding:0;
    border:0;
    overflow:hidden;
    font-family:Arial,sans-serif;
    font-size:12px;
    width:100%;
    height:100%;
}
/*
body{
    border:1px solid #666;
}*/
a,a:link{
    text-decoration:none;
}

#titolo,#logo,#paginazione,#nav_n,#nav_p,#add_button,#share_button,#eventi,#fading{
    display:block;
    overflow:hidden;
    position:absolute;
    /*border:1px solid #c00;*/
    z-index:10;
}
#fading{z-index:11;}
#eventi,#fading{background-color:#efefef;}
#nav_n,#nav_p{z-index:15;}
#titolo{border-bottom:1px solid #ccc;color:#666;padding-left:5px;}
#logo{border-bottom:1px solid #ccc;}
#paginazione{border-bottom:1px solid #ccc;}
#nav_n,
#nav_p{
    background-color:#ececec;
    box-shadow:0 0 3px #888;
    cursor:pointer;
    background-attachment:scroll;
    background-repeat:no-repeat;
    background-position:center center;
    overflow:hidden;
    text-indent:-999px;
}
#nav_n{
    background-image:url(../images/widgetbox/arrow-right.png);
}
#nav_p{
    background-image:url(../images/widgetbox/arrow-left.png);
}
#nav_n:active,
#nav_p:active{
    box-shadow:0 0 3px #888,0 0 10px #888 inset;
}
#add_button{
    color:#225533;
}
#share_button{
    color:#447799;
}
#add_button,#share_button{
    text-decoration:underline;
    cursor:pointer;
}
#add_button:hover,#share_button:hover{
    font-weight:bold;
}

#nav_n.nav,#nav_p.nav{display:none;}
.hover #nav_n.nav,.hover #nav_p.nav{display:block;}

/* WIDEBOX */
.widebox #titolo{
    top:0;
    left:0;
    right:100px;
    width:auto;
    height:50px;
    font-size:25px;
}
.widebox #titolo .intro{
    font-size:10px;
    display:block;
}
.widebox #logo{
    top:0;
    right:0;
    width:100px;
    height:50px;
}
.widebox #paginazione{
    top:50px;
    right:0;
    left:0;
    height:20px;
    text-align:center;
    line-height:20px;
    vertical-align:middle;
    font-style:italic;
}
.hover.widebox #paginazione{
    right:31px;
    left:31px;
}
.widebox #nav_n{
    top:50px;
    right:0;
    bottom:0;
    width:30px;
    height:auto;
}
.widebox #nav_p{
    top:50px;
    left:0;
    bottom:0;
    width:30px;
    height:auto;
}

.widebox #add_button{
    bottom:0;
    left:0;
    right:50%;
    height:20px;
}
.widebox #share_button{
    bottom:0;
    left:50%;
    right:0;
    height:20px;
}
.widebox #add_button,.widebox #share_button{
    line-height:20px;
    vertical-align:middle;
    text-transform:uppercase;
    text-align:center;
}
.widebox #eventi{
    top:71px;
    bottom:21px;
    right:0;
    left:0;
}
.hover.widebox #eventi{
    right:31px;
    left:31px;
}

.hover.widebox #add_button{left:31px;}
.hover.widebox #share_button{right:31px;}


/* WIDELINE */

.wideline #titolo{
    top:0;
    left:0;
    right:100px;
    width:auto;
    height:25px;
    font-size:16px;
    line-height:25px;
    vertical-align:middle;
}

.wideline #logo{
    top:0;
    right:0;
    width:100px;
    height:25px;
}
.wideline #logo #im{
    position:absolute;
    top:-18px;
}
.wideline #paginazione{
    display:none;
}
.wideline #nav_n{
    top:25px;
    right:0;
    bottom:0;
    width:30px;
    height:auto;
}
.wideline #nav_p{
    top:25px;
    left:0;
    bottom:0;
    width:30px;
    height:auto;
}


.wideline #add_button,.wideline #share_button{
    display:none;
}
.wideline #eventi{
    top:25px;
    bottom:0;
    right:0;
    left:0;
}

.hover.wideline #eventi{
    right:31px;
    left:31px;
}

.wideline.notitle #titolo{display:none;}
.wideline.notitle #eventi,.wideline.notitle #nav_n,.wideline.notitle #nav_p{top:0}

/* LINE */

.line #titolo{
    top:0;
    left:0;
    bottom:0;
    width:120px;
    font-size:14px;
    line-height:25px;
    vertical-align:middle;
    border-bottom:none;
    border-left:1px solid #ccc;
}
.line #logo{
    display:none;
}
.line #paginazione{
    display:none;
}
.line #nav_n{
    top:0;
    right:0;
    bottom:0;
    width:30px;
    height:auto;
}
.line #nav_p{
    top:0;
    left:120px;
    bottom:0;
    width:30px;
    height:auto;
}

.line #add_button,.line #share_button{
    display:none;
}
.line #eventi{
    top:0;
    bottom:0;
    right:0;
    left:120px;
}
.hover.line #eventi{
    left:151px;
    right:31px;
}

/* COLUMN */
.column #titolo{
    top:50px;
    left:0;
    right:0;
    height:25px;
    font-size:14px;
    line-height:25px;
    vertical-align:middle;
    text-align: center;
    padding-left:0;
}

.column #logo{
    top:0;
    left:0;
    right:0;
    height:50px;
    text-align:center;
}
.column #paginazione{
    bottom:40px;
    right:0;
    left:0;
    height:20px;
    text-align:center;
    line-height:20px;
    vertical-align:middle;
    font-style:italic;
}
.column #nav_n{
    bottom:40px;
    right:0;
    left:0;
    height:20px;
    
    background-image:url(../images/widgetbox/arrow-bottom.png);
}
.column #nav_p{
    top:70px;
    left:0;
    right:0;
    height:20px;
    
    background-image:url(../images/widgetbox/arrow-top.png);
}

.column #add_button{
    bottom:20px;
    left:0;
    right:0;
    height:20px;
}
.column #share_button{
    bottom:0;
    left:0;
    right:0;
    height:20px;
}
.column #add_button,.column #share_button{
    line-height:20px;
    vertical-align:middle;
    text-transform:uppercase;
    text-align:center;
}
.column #eventi{
    top:71px;
    bottom:61px;
    right:0;
    left:0;
}
.hover.column #eventi{
    top:91px;
}



/* LISTA EVENTI */
#eventi .event{border-bottom:1px solid #ccc;cursor:pointer;}
#eventi.onlyone .event{border-bottom:none}
#eventi .event{
    -webkit-transition: all 0.3s ease-out;  /* Saf3.2+, Chrome */
    -moz-transition: all 0.3s ease-out;  /* FF4+ */
    -ms-transition: all 0.3s ease-out;  /* IE10 */
    -o-transition: all 0.3s ease-out;  /* Opera 10.5+ */
    transition: all 0.3s ease-out;
}
#eventi .event:hover{background-color:#fff;}
#eventi .event .cover{width:100px;height:100px;float:left;background-color:#f0f0f0;overflow:hidden;background:no-repeat center center scroll;background-size:cover;}
#eventi .event .info{height:88px;margin-left:100px;padding:6px;}
#eventi .event .info .data{font-size:12px;}
#eventi .event .info .titolo{font-size:16px;}
#eventi .event .info .titolo a{text-decoration:none;}
#eventi .event .info .sottotitolo{font-size:14px;font-style:italic;}
#eventi .cl{line-height:0;height:0;clear:both;}

/* Colori */
#eventi a{
    color:#E97D1D;
}

#eventi a:hover, #eventi .event:hover a{
    color:#f00;
}
#eventi .info .data{
    color:#666;
}
#nav_n:hover,
#nav_p:hover{
    background-color:#E97D1D;
}