@import url('reset.css');

/*---------------------------------------------*\
                   common  
\*---------------------------------------------*/

* {margin:0; padding:0; font:16px/1.35 'Abel', Arial, Verdana, serif;  color:#666; z-index:1; -webkit-text-size-adjust: none;}

html, body { min-height:100%; height:auto; width:auto; }
html > body  {min-height:100%; height:auto; width:auto;}
html { }
body {background:#fff;  }

h1,h2,h3,h4,h5,h6 {line-height:1em; color:#666; font-weight:normal; padding:0;  padding-bottom:10px; text-transform:uppercase}
h1 *, h2 *, h3 *, h4 *, h5 *, h6 * {line-height:1em; font-size:inherit; font-family:inherit; }
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover {line-height:1em; background:none }


h1 {font-size:38px;}
h2 {font-size:36px; }
h3 {font-size:22px; }
h4 {font-size:22px; }
h5 {font-size:18px; }
h6 {font-size:16px; }

p {margin:5px 0; clear:right;}
a {text-decoration:none; color:#333;}
a:hover {}
hr {height:10px; border:0; background:url(dotted-line.png) center left repeat-x; margin:20px 0;}
a:visited, a:link {outline:none;}
a img {border:0;}
p.err {color:red; margin-bottom:10px}

strong {font-weight:bold; color:inherit; font-style:inherit;}
em {color:#000}
input {margin:0; padding:0;}
form p { margin:0; padding:0;}
ul { list-style-position:inside; margin:0; padding:0; }

label {}

.hide {display:none}
.err {color:#f12 !important; }
strong.err {font-size:inherit; padding:0;}
h3.err {font-size:30px; padding:0;}

h4 {background:url(center-line.png) center repeat-x; line-height:1em; text-align:center; padding:0; margin-bottom:20px;}
h4 span {background:#fff; padding:0 10px; vertical-align:middle;}

/*---------------------------------------------*\
                   general  
\*---------------------------------------------*/
.anchor {position:absolute; left:0; top:0; width:100%; height:100%;}
::-webkit-input-placeholder { /* WebKit browsers */
    color:    #666;
    text-align:center;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:    #666;
    opacity:  1;
    text-align:center;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:    #666;
    opacity:  1;
    text-align:center;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    color:    #666;
    text-align:center;
}


/*---------------------------------------------*\
                   wrapper  
\*---------------------------------------------*/

#wrapper {width:1125px; margin:20px auto}

/*---------------------------------------------*\
                   login 
\*---------------------------------------------*/
#login {position:absolute; top:50%; left:0; padding:0; width:100%; margin:0 auto; text-align:center; margin-top:-250px; }
#login-content {width:240px; margin:0 auto;}
#login h4 {margin-bottom:20px; margin-top:20px;}
#login form p {width:185px; margin:0 auto; text-align:center;}
#login input {margin:0; height:25px; padding:0 10px; width:165px; margin-bottom:20px; background:#e0e0e0; border:0; }
#login button.submit {border:0; width:100%; background:url(center-red-line.png) center repeat-x; text-align:center; margin-top:20px;}
#login button.submit span {padding:0 10px; color:#0055a0; background:#fff; font-size:26px; text-transform:uppercase; cursor:pointer}
#login button:hover {opacity:.8; }

#login input[type='submit'] {padding:10px; text-transform: uppercase;  color:#000}
#login input[type='submit']:hover {cursor:pointer;}
#login .err {font-style:italic; padding:10px 0;}
#pwd, #usr {padding:10px; width:100%}

/*---------------------------------------------*\
                   header
\*---------------------------------------------*/
#header {position:relative; top:0; left:0; overflow:hidden; margin-top:25px; height:150px;}
#header #logo {position:relative; top:0; left:0;}

#header #profilo {position:absolute; top:0; right:0; width:790px; background:url(dotted-line.png) bottom center repeat-x; padding-bottom:23px; text-align: right;}
#header #profilo .evento {float:left;}
#header #profilo .welcome {margin-right:20px; text-transform:uppercase}
#header #profilo .profile {color:#e4191a; margin-right:20px; text-transform:uppercase }
#header #profilo .logout {display:inline-block; width:23px; height:23px; background:url(logout.png) no-repeat; text-align: left; text-indent:-99999px}
#header #profilo a:hover {opacity:.7}

#header #menu {position:absolute; top:60px; right:0;}
#header #menu ul li {display:inline-block; padding:0 10px}
#header #menu ul li a {text-transform: uppercase; color:#666; font-size:18px; border-bottom:4px solid #fff}
#header #menu ul li.active a {border-bottom:4px solid #e4191a}
#header #menu ul li a:hover {border-bottom:4px solid #f2f2f2}
#header #menu ul li.last {margin-right:0; padding-right:0;}

/*---------------------------------------------*\
                   header
\*---------------------------------------------*/
#footer {width:410px; float:right; text-align:right; height:60px; margin-bottom:100px; padding-top:10px; margin-top:140px; background:url(dotted-line.png) repeat-x; }
#footer p, #footer span  {text-align:right; font-size:18px; color:#666}
#footer span  {border-bottom:4px solid #e4191a}


/*---------------------------------------------*\
                 profilo
\*---------------------------------------------*/
#content-profilo {margin:0px auto;}
#content-profilo .name {font-size:55px; text-align: center; text-transform:uppercase;}

#content-profilo table {border:1px solid #eaeaea; margin-top:40px}
#content-profilo table .intestazione {font-weight: bold; border-right:1px solid #eaeaea}
#content-profilo table tr.alternated {background:#F5F5F5}
#content-profilo table td {padding:10px}

.profile-list p {text-align:center; font-size:20px; margin-top:20px;}
.profile-list strong {display:block; font-size:20px;}

#content-profilo .edit-profilo {margin:40px 0px}
#content-profilo .edit-profilo a {margin-right:25px; border-bottom:4px solid #fff;}
#content-profilo .edit-profilo .active { border-bottom:4px solid #e4191a}

#formEdit textarea {width:270px; height:100px; padding:5px; margin-bottom:20px}
#formEdit label, #formEdit legend {font-weight: bold; color:#000; text-align: left}
#formEdit input, #form-password input {margin-bottom:20px; padding: 10px; background:#fff; width:250px}
#formEdit input[type='submit'], #form-password input[type='submit'] {margin-top:20px; width:auto}
#formEdit input[type='checkbox'] {width:auto; margin-right:10px}

.readonly input {background:#eee !important;}

#content-profilo .confirm {padding:20px; background:#EEFFCC; border:1px solid #559911; text-align: center; margin-bottom: 20px}
#content-profilo .error {padding:20px; background:#ef4358; border:1px solid #FF1144; color:#000; text-align: center; margin-bottom: 20px}

#form-photo input[type='submit'],#form-photo input[type='file'] {margin-right:20px; width:auto;padding: 10px; background:#FAFAFA;}
.delete {margin-top:20px; display: inline-block; color:red; margin-top:30px; text-decoration:underline;  }

/*---------------------------------------------*\
                 home
\*---------------------------------------------*/

#countdown {width:405px; margin:0 auto; padding-bottom:80px; }
#countdown.bilbao {background:url(countdown_bilbao.png) bottom center no-repeat; }
#countdown .dicit {font-size:30px; color:#666; width:100%; text-align:center}
#countdown .days {font-size:380px; width:100%; text-align:center; opacity:.5; color:#666; font-family:Helvetica, Arial; line-height:1em; vertical-align:middle; padding:0; margin:0; overflow:hidden; height:320px;}
#countdown .to {font-size:30px; color:#666; width:100%; text-align:center}
#countdown .to strong {color:#e4191a; font-size:30px; }

/*
.img-home-left, .content-home {float:left;}
.img-home-left {width:400px; margin-right:50px}
.content-home {width:500px}
.content-home p {line-height: 25px}
.img-home-bottom {margin-top:50px}
*/

#home table td {padding-right:45px; vertical-align:top; text-align:justify; width:33%; }
#home table td.last {padding-right:0;}


#teaser {width:80%; text-align:center; padding:10%;}
#teaser h5 {width:100%; margin:0 auto; font-size:25px; text-align:center; font-weight:900; color:#ccc; margin-bottom:30px; text-transform:initial; }
#teaser h1 {width:100%; margin:0 auto; font-size:65px; text-align:center; font-weight:900; color:#000; margin-bottom:30px;}
#teaser img {width:100%;}


/*---------------------------------------------*\
                 information
\*---------------------------------------------*/
#information {overflow:hidden; margin-top:0px; width:100%; }
#information div {float:left; width:27%; margin-right:6% }
#information div h3 {color:#e4191a; font-size:26px}
#information div.last {margin-right:0px}

/*---------------------------------------------*\
                 presentation/download
\*---------------------------------------------*/
#download {border-color:#ccc; border-collapse:initial !important; border-spacing:initial !important}
.download {min-height:100px;}
.download img {float:left; margin-right:20px; width:79px; }
.download .content {float:left; width:400px;}
.download .content a {font-size:18px; display:block; color:#666}
.download .data {color:#e4191a; width:auto; display:inline-block; padding-bottom:5px; margin-bottom:5px; text-transform:uppercase; background:url(dotted-line-red.png) bottom left no-repeat; padding-right:20px; }

/*---------------------------------------------*\
                 agenda
\*---------------------------------------------*/
#programma {overflow:hidden; margin-bottom:0;}
.giorno {overflow:hidden; width:27%; float:left; margin-right:6%;}
/*.giorno_1 {width:450px;}
.giorno_1 ul .evento {width:360px !important;}
.giorno.last {margin-right:0;}

.giorno .numero-giorno {font-size:24px; line-height:1em; margin-bottom:0; text-transform: uppercase}
.giorno .data {color:#e4191a; width:auto; display:inline-block; padding-bottom:10px; background:url(dotted-line.png) bottom center repeat-x; padding-right:20px; }

.giorno ul {}
.giorno ul li {overflow:hidden; padding:0px 0px; vertical-align:top;}
.giorno ul li p {margin:0; padding:0; }
.giorno ul .ora, .giorno .evento {float:left; }
.giorno ul .ora {border-bottom:1px dotted red; width:35px; text-align:center;}
.giorno ul .evento {margin:10px; margin-top:0; width:200px;}
*/

.giorno h3 {line-height:1em; margin-bottom:0; text-transform: uppercase; color:#e4191a; font-size:26px}
.giorno table {width:100%; margin-bottom:30px;}
.giorno table tr td {border-bottom:1px solid #ccc; padding:10px 0;}
.giorno table tr td:first-child  {color:#0055A0; padding-right:10px; width:35px;}


#content-agenda {overflow:hidden; margin-top:0px; clear:left;}
#content-agenda div {float:left; width:325px; margin-right:45px; text-align:justify}
#content-agenda div.last {margin-right:0;}
#content-agenda div * {text-align:justify}

/*---------------------------------------------*\
                 who is who
\*---------------------------------------------*/
#filtri {padding:10px 0px; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc;}
#filtri ul li {display:inline-block; margin-right:20px; text-transform: uppercase; font-size:15px}
#filtri ul li p {font-size:15px}
#filtri ul li p.marcato {font-weight:bold;}
#filtri ul li p:hover {color:#C90027; cursor:pointer}

#lista-utenti {margin-top:30px; overflow:hidden; min-height:600px}
#lista-utenti .col1,#lista-utenti .col2, #lista-utenti .col3 {width:335px; float:left; }
#lista-utenti .col2 {margin:0px 60px}

#lista-utenti .utente {width:220px; margin:0 auto; margin-bottom:30px; padding-bottom:30px; border-bottom:1px dotted #ccc;}
#lista-utenti .utente * {text-align:center;}
#lista-utenti .utente a {display:block}
#lista-utenti .utente em {font-style:italic; color:#666}
#lista-utenti .utente .avatar {display:inline-block; float:none; margin-left:30px;}
#lista-utenti .utente .nome {margin:0; font-size:18px; text-transform:uppercase;}
#lista-utenti .utente .lavoro {color:#e4191a; margin:0;}
#lista-utenti .utente .hobby {color:#97999A;  padding-bottom:10px}
#lista-utenti .utente .indirizzo {margin:10px 0px; overflow:hidden; }
#lista-utenti .utente .indirizzo p,#lista-utenti .utente .telefono p {margin-left:10px}
#lista-utenti .utente .telefono {}
#lista-utenti .utente .hobby {text-align:center}
#lista-utenti .utente .hobby strong {color:#666;}
#lista-utenti .utente .hobby hr{width:45px; margin:0 auto; padding-top:15px; margin-bottom:10px; }

/*---------------------------------------------*\
                 partecipate
\*---------------------------------------------*/
#inserisci-commento {overflow:hidden}

.avatar {float:left; margin-right:20px; display:inline-block; }
.avatar a:hover, a:hover .avatar {opacity:.8}
.avatar img {margin:0 auto; display:inline-block; width: 105px; height: 105px; border-radius: 150px; padding:4px; border:1px solid #333; background:#fff; margin-bottom:10px; }

.avatar.small img {width:80px; height:80px; border-radius:80px;}
.avatar.big img {width:160px; height:160px; border-radius:160px;}
.avatar.profile {float:none; margin:0;}
.avatar.profile img {width:250px; height:250px; border-radius:250px; margin:0;}

#inserisci-commento #content-form {width:910px; float:left; margin-left: 20px; overflow:hidden;}
#inserisci-commento #content-form textarea {width:888px; height:135px; padding:10px}


.post-controls { position:relative; left:0; top:0; height:65px;}
.add_foto_trigger {float:right; cursor:pointer; text-transform:uppercase; width:100px; display:block; background:url(dotted-line.png) bottom right no-repeat; padding-bottom:10px; }
.add_foto_content {display:none; }
.add_foto_wrapper input {width:400px;}
.add_foto_wrapper {float:right;  height:auto; overflow:hidden;}
#invia_commento {display:block; width:100%; text-align:right; background:#fff !important; padding:0; border:0; color:#e4191a; text-transform:uppercase; cursor:pointer;}


.confirm {padding:20px; background:#EEFFCC; border:1px solid #559911; text-align: center; margin-bottom: 20px}

#lista-commenti {margin-top: 30px; padding:0 30px; padding-right:60px;}
#lista-commenti .commento {overflow:hidden; padding: 20px 0px; width:100%; position:relative }
#lista-commenti .commento img, #lista-commenti .commento .content-commento {float:left}
#lista-commenti .commento .content-commento {margin-left: 20px; width:905px;}

#lista-commenti .commento .elimina-commento {padding:0px 20px; display:inline-block; position:absolute; right:0; top:20px; background:#E41819; color:#fff; text-transform:lowercase}
#lista-commenti .commento .content-commento  .aggiorna-commento {padding:10px; border:1px solid #ccc; display:inline-block; margin: 20px 0px}
#lista-commenti .commento .content-commento  .aggiorna-commento:hover, #lista-commenti .commento .elimina-commento:hover {cursor:pointer}
#lista-commenti .commento .content-commento  .aggiorna-commento, #lista-commenti .commento .elimina-commento {display:none}
#lista-commenti .commento .content-commento .modifica-commento {color:#ddd; text-transform: lowercase; float:right; margin-right:160px}

#lista-commenti .commento .content-commento .editabile {padding:5px; margin-top:10px; border:1px dotted #ccc}

#lista-commenti .commento .content-commento .info-commento {color:#888888; text-transform:uppercase}
#lista-commenti .commento .content-commento .info-commento a:hover {text-decoration:underline; color:#999}
#lista-commenti .commento .content-commento .info-commento .data {color:#e4191a;}

#lista-commenti .commento .content-commento .foto-post img {max-width:450px; height:auto; border: 1px solid #ddd; padding:10px; max-height:300px}


.image-titled {position:relative;}
.image-titled .titles {text-align:right; position:absolute; bottom:30px; right:30px;}
.image-titled .titles h2 {display:inline-block; text-align:right; background:#fff; padding:5px 10px; margin-bottom:5px; font-size:44px;}
.image-titled .titles h3 {display:inline-block;  text-align:right; background:grey; color:#fff; padding:5px 10px;  font-size:30px;}