A Material Day Skin

<div id="bghead"></div>


<!-- FF Avatar Pack -->
<script type="text/javascript">
var FFAV_settings = {
"FFAV_default": 'http://i.imgur.com/vPo6IP3.png', // Avatar di default
"FFAV_stats": 0, // 0 = Disattiva Avatar nelle Statistiche
"FFAV_lastpost": 1, // 0 = Disattiva Avatar accanto all'ultimo messaggio
"FFAV_tagboard": 0, // 0 = Disattiva Avatar in TagBoard
"FFAV_quote": 1, // 0 = Disattiva Avatar accanto alle Citazioni
};
</script>

<!-- SCRIPT COLORI --!>
<script type="text/javascript">var nb_scs_obj = '{"skinArrays" : { "array1": ["#42aad6","#f0689d","#d43c3e","#e26446","#e4b23c","#5fa848","#426b8e","#7251cd","#5eb889","#695c4f","#333535"], "array2": ["#F44336","#E91E63","#9C27B0","#673AB7","#3f51b5","#2196F3","#03A9F4","#00bcd4","#009688","#4CAF50","#8BC34A","#FFC107","#FF9800","#FF5722","#795548","#9E9E9E","#607D8B", "#4285F4"]}, "skinSettings" : { "color_1": {"type": "hex", "name": "Colore", "set": "skinArrays.array2", "def": "#3f51b5"} }, "dynCss":" .button.flat.dynamic {color: @color_1} .focus {background: @color_1} .block {background: @color_1} .profile .tabs {background: @color_1}.darkbar .forminput {color: @color_1}.profile .tabs li a {background: @color_1} .title {background: @color_1} a {color: @color_1}body > div:first-of-type{background: @color_1} div#bghead {background: @color_1}.credits {background: @color_1}.focus{background: @color_1 !important}.focus:nth-child(even){background: @color_1 !important}.chat_conversation_active {background: @color_1 !important} .chat_discussion_you > div {background: @color_1}.chat_conversation_input > textarea, #chat_contact_request_message{border:1px solid @color_1 !important}.chat_conversation_input > textarea:focus, #chat_contact_request_message:focus{border:2px solid @color_1 !important}*::selection {background-color: @color_1}#chat_main, #chat_show {background: @color_1 !important}.chat_conversation_input_options_emoticons { background: url(http://image.forumfree.it/9/2/4/9/2/7/4/1423496651.png) @color_1 no-repeat !important;}.fab.f-up {background-color: @color_1}.fast.send .forminput {color: @color_1}#f_up {background: @color_1}.mback {background: @color_1}#pan1:checked ~ #active label:nth-child(1), #pan2:checked ~ #active label:nth-child(2), #pan3:checked ~ #active label:nth-child(3), #pan4:checked ~ #active label:nth-child(4) {background: @color_1}.stats .mback .mtitle {color: @color_1}.button.dynamic{background: @color_1}.button.credits {background: @color_1}.sb_users_online_span b{background: @color_1"}'</script>
<script type="text/javascript" src="http://ffscript.avatar-random.com/ace/skincss_change.js"></script>
<!-- FINE SCRIPT -->

<!-- Colora il menu utente -->
<script type="text/javascript">
document.body.children[0].style.transition="background 0.3s ease";

function updateFunction() {
if (document.body.scrollTop > 40 || document.documentElement.scrollTop > 40)
colorIn();
else colorOut();
}

function colorIn(){
var element = document.getElementById('bghead'),
style = window.getComputedStyle(element),
background = style.getPropertyValue('background');
document.body.children[0].style.background=background;
}

function colorOut(){
document.body.children[0].style.background="rgba(0, 0, 0, 0.2)";
}

function scrollFunction(){
if(document.body.scrollTop >= 260 ||
document.documentElement.scrollTop >= 260)
{
if(document.body.children[0].className.indexOf("shadowed") == -1)
document.body.children[0].className+=' shadowed';
}
else
{
document.body.children[0].className=document.body.children[0].className.replace(' shadowed','');
}
}

setInterval( updateFunction, 10);
window.onscroll = scrollFunction;
</script>

<!-- CREDITS -->
<div class="button raised credits">
<div class="center" fit><div align="center" style="font-size: 13px; margin-top:5px;"><b>A Material Day</b>, creata da MasterC22 e YoDevil - Tutti i diritti riservati&nbsp;-&nbsp; Basata sulla skin <b>FFPlay</b>.</div>
<paper-ripple fit></paper-ripple>
</div> </div></div>
<!-- FINE CREDITS -->
<script type="text/javascript" src="http://ffb.forumfree.net/js/avatar_pack.js"></script>

/* ------ START ------ */

/* A Material Day skin, by MasterC22 & YoDevil */

/*---------------MODIFICHE PER L'UTENTE---------------*/
/* Modifiche al logo */
.logo {margin-bottom: 20px; margin-top: 20px;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26) !important;
border-radious: 2px}

/* Colori legenda utenti */
.daconvalidare {font-style: italic; color: #607D8B}
.amministratore {color: #4285F4; font-weight: bold}
.moderatore {color: #3F51B5; font-weight: bold}
.utente {color: #607D8B}
.gruppo1 {color: #607D8B}
.gruppo2 {color: #607D8B}
/*eccetera*/
/*---------------MODIFICHE PER L'UTENTE---------------*/

/* Selezione Testo */
*::selection {background-color: #3F51B5; color: #FFF !important; opacity: .9}

/* Tema Chat Hangouts */
div.chat_conversation_header {border-bottom: 1px solid #DDD}
.chat_unread_messages {border-radius: 1px!important}
.chat_online_counter {font-weight: 100!important; font-family: roboto!important}
.chat_conversation_main::before {background: none !important}
.chat_conversation_input > textarea {padding: 0 !important; resize: none}
.chat_conversation_main {background: #EEEEEF !important; margin-bottom: auto !important}
.chat_conversation_active {background: #3F51B5 !important}
#chat_contact_request_form input, .chat_conversation_input .textinput {margin: 5px auto !important; background: #FFFFFF !important; color: #666 !important; outline: none}
#chat_show {box-shadow: none !important; border-radius: 0 !important}
#chat_main *, #chat_show * {outline:none !important}
#chat_main, #chat_show {background: rgb(108, 198, 68) !important; color: #FFF!important; box-shadow: 0 0 1px rgba(0, 0, 0, .2), 0 2px 10px rgba(0, 0, 0, .2)!important; right: 0 !important}
.chat_friend_list {padding: 5px 0 20px 0; position: relative}
.chat_friend_list > .chat_avatar {float: left!important; margin-right: 4px!important; z-index: 9!important; cursor: pointer!important; border-radius: 100px !important; height: 30px!important; width: 30px!important}
.chat_friend_offline_list > .chat_avatar {opacity: 0.7}
.chat_friend_online_list > .chat_nick_list > a {color: #3F7296 !important}
#chat_contacts_manager {text-align: center}
#chat_contacts_requests, #chat_contacts_incomings {text-align: left !important}
#chat_contacts_request_button {padding: 8px!important;
color: #212121!important;
background: transparent !important;
transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
font-family: "Roboto";
font-weight: 600;
text-transform: uppercase!important;
border: none!important;
height: 36px;
font-size: 13px!important;
width: auto!important;
box-shadow: none!important;
border-radius: 0!important;
border: none!important}
#chat_contacts_request_button:hover {background: rgba(153, 153, 153, 0.2)!important;
color: #212121!important}
#chat_contacts_request_button:active {background: rgba(153, 153, 153, 0.4)!important}
#chat_contact_request_send {background: #D5D5D5 !important;
color: #666 !important}
#chat_contact_request_send:hover {background: #CCC !important;
color: #666 !important}
#chat_contacts_incomings_header > span:before,
#chat_contacts_requests_header > span:before {content: none !important; background: url(http://icons.iconarchive.com/icons/oxygen-icons.org/oxygen/16/Actions-list-add-user-icon.png) no-repeat !important; padding: 9px !important; display: inline-block; margin: 0 5px !important}
#chat_friends_header p {color: #757575! important; font-size: 11pt !important; padding-left: 20px}
#chat_friends_header p::before {content: none !important; background: url(http://icons.iconarchive.com/icons/oxygen-icons.org/oxygen/16/Places-user-identity-icon.png) no-repeat !important; padding: 8px 9px !important; margin: auto !important; display: inline-block}
.chat_message:first-of-type {padding-top: 0 !important}
.chat_message:last-of-type {padding-bottom: 15px !important}
.chat_conversation_header span {line-height: 25px;
height: 25px;
margin: 0 !important;
font-size: 14px;
color: #212121 !important;
font-weight: bold;
display: inline-block;
max-width: 400px;
overflow: hidden;
text-overflow: ellipsis;
word-break: break-word;
white-space: nowrap}
.chat_conversation_toolbox {position: absolute; right: 30px}
.chat_conversation_toolbox > li {border-radius: 0!important; padding: 0 !important; margin-left: 0 !important; background: transparent !important; border: 0 !important; text-align: center; vertical-align: middle; margin-top: 14px}
.chat_conversation_toolbox_profile_forumfree a,
.chat_conversation_toolbox_profile_forumcommunity a,
.chat_conversation_toolbox_profile_blogfree a {display: none}


.chat_conversation_toolbox_ignore a {font-size: 0;
height: 24px!important;
width: 24px!important;
background: url(http://i.imgur.com/ouFvPsZ.png) no-repeat !important;
padding: 12px!important;
margin-right: 15px}

.chat_conversation_close {margin: 0!important}
.chat_conversation_close span {background: url(http://i.imgur.com/zn5f8c4.png) no-repeat !important;
height: 24px !important;
width: 24px !important;
padding: 0!important}
.chat_discussion {padding: 1px; padding-left: 15px; position: relative; min-height: 55px}
.chat_discussion:last-child {border-bottom: 0}
.chat_discussion > div {border-radius: 2px; margin: 3px 3px 3px 52px; color: #333; background: #FFF; position:relative; border-style: solid;
border-width: 15px 0 0 15px;
border-color: transparent transparent transparent #EEEEEF}
.chat_discussion_you > div {border-radius: 2px; margin: 3px 52px 3px 3px; color: #333; background: #3F51B5; position: relative; border-style: solid;
border-width: 15px 15px 0 0;
border-color: transparent #EEEEEF transparent transparent}
.chat_discussion > div:before {content: none; width: 0; height: 0; border-top: 7px solid transparent; border-bottom: 7px solid transparent; border-right: 7px solid #DDD; position: absolute; left: 65px; top: 10px}
.chat_discussion_you > div:before {top: 5px !important; right: -7px; left: auto !important; border-right: 0 !important}
.chat_message_avatar {display: block !important; background: #FFF !important; -webkit-border-radius: 90px !important; -moz-border-radius: 90px !important; border-radius: 90px!important; width: 45px !important; height: 45px !important; margin-top: 3px !important; margin-left: 0 !important}
.chat_discussion_you > .chat_message_avatar {float: right !important; margin-top: 5px !important; margin-right: 5px !important}
.chat_nick {display: none !important; position: absolute; bottom: 20px; left: 75px; color: #111 !important; font-weight: bold; text-shadow: #CCC 1px 1px 2px !important; font-size: 14px !important}
.chat_discussion_you .chat_nick {height: 1px !important; display: none !important; text-shadow: none !important; color: #FFF !important; bottom: 20px; left: 0; box-shadow: 0 0 0}
.chat_time {display: block !important; position: absolute; right: -4px; bottom: -6px; width: 50px; text-align: center; color: #111 !important; font-weight: bold ! important; text-shadow: #CCC 1px 1px 2px !important; font-size: 11px !important; background: none !important}
.chat_discussion_you .chat_time {text-shadow: none !important; color: #FFF !important; right: -10px; bottom: -6px}
.chat_message {border-radius: 0 !important; margin: 0; padding: 2px 12px !important; color: #222; font-size: 12px !important; font-family: verdana !important}
.chat_discussion_you .chat_message {color: #FFF}
.chat_message:only-child, .chat_message:only-of-type {padding: 2px 1px}
#chat_audio_button {left: -10px !important; z-index: 1}
.chat_conversation_input_options_emoticons {background: url("http://image.forumfree.it/9/2/4/9/2/7/4/1423496651.png") #3F51B5 no-repeat !important; width: 24px !important; height: 24px !important; margin: 7px 0 !important; border-radius: 100px !important}
.chat_conversation_input_options_emoticons:active {border: 0 !important}
.chat_conversation_input_options_emoticons_box {bottom: 49px !important;
padding: 0 !important;
width: auto !important;
height: auto !important;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26)!important;
background: #FFF !important}
.chat_conversation_input_options_emoticons_box > ul {padding: 0 !important}
.chat_conversation_input_options_emoticons_box > ul > li {display: inline-block !important; float: none !important}
.chat_conversation_main::-webkit-scrollbar,
#chat_contacts_manager::-webkit-scrollbar,
#chat_friends_list::-webkit-scrollbar {display: none}
#chat_conversations {background: #EEEEEF !important}
.chat_discussion a {color: #9E9E9E !important}
.chat_discussion_you a {color: #FFF !important}
.chat_conversation_active > .chat_nick_list > a {color: #FFF !important}
.chat_conversation_active > .chat_friend_service_list {color: #FFF !important}
#chat_window {box-shadow: 0 0 4px rgba(0, 0, 0, .14), 0 4px 8px rgba(0, 0, 0, .28)!important}

/* WebChat a sinistra + font Helvetica */
#chat_main, #chat_show {background: #3F51B5 !important; border-radius: 0 !important; right: auto !important; left: 0 !important; font-family: roboto}
#chat_notify_message {right: auto !important; left: 0 !important; margin-left: 100px !important; font-family: helvetica}
#chat_notification {right: auto !important; left: 0 !important; margin-left: 75px !important; font-family: helvetica}
.chat_start_button {font-family: helvetica !important; padding: 1px !important; float: left;
margin-left: 10px!important}

#chat_settings_button {font-family: roboto !important; font-weight: 100!important; padding: 3px !important}
#chat_main {font-family: helvetica !important}
#chat_conversations {font-family: helvetica !important}
#chat_settings_container {float:none!important}
#chat_settings_menu {right: 0; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); !important; background-color: #FFFFFF!important; border-radius: 2px; border: none!important}

/* Header */
div#bghead {background: #3F51B5;
height: 300px;
width: 100%;
position: absolute;
top: 0;
box-shadow: 0 0 4px rgba(0, 0, 0, .14), 0 4px 8px rgba(0, 0, 0, .28)}

/* Google Fonts */
@font-face {font-family: 'Roboto';
font-style: normal;
font-weight: 400;
src: local('Open Sans'), local('OpenSans'), url(http://themes.googleusercontent.com/static/fonts/opensans/v6/cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff) format('woff')}
@font-face {font-family: 'roboto';
font-style: normal;
font-weight: 600;
src: local('Open Sans Semibold'), local('OpenSans-Semibold'), url(http://themes.googleusercontent.com/static/fonts/opensans/v6/MTP_ySUJH_bn48VBG8sNSnhCUOGz7vYGh680lGh-uXM.woff) format('woff')}
@font-face {font-family: 'roboto';
font-style: normal;
font-weight: 700;
src: local('Open Sans Bold'), local('OpenSans-Bold'), url(http://themes.googleusercontent.com/static/fonts/opensans/v6/k3k702ZOKiLJc3WVjuplzHhCUOGz7vYGh680lGh-uXM.woff) format('woff')}

/* Body */

body {background: #EEEEEF; background-color: #EEEEEF; font: 76%/1.6em "Roboto", sans-serif; background-attachment: scroll; background-repeat: no-repeat; background-position: center; background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; color: #212121}
a {text-decoration: none; color: #437CC4}
a:hover {color: #252525}

.nav {font: 15px roboto;
letter-spacing: .05em;
border-radius: 2px}
.nav a {color: #212121; vertical-align: middle!important}
.nav li {cursor: pointer}


.side_topics {width: 275px}
.side_topics a, .side_topics span {font-size: 13px !important}

.footer {margin: 15px auto; font-size: 12px; color: #999}
.footer a {color: #999}
textarea, input, select, button {font-family: 'Roboto'}
#prefooter {text-align: justify; font-size: 13px; width: 900px; padding-top: 20px; border-top: 2px solid #CCC}

/* MENU principale */
.menuwrap span {z-index: 1!important}
.menuwrap a {color: #FFF}
li#changestylesmenu.menu.csm_butt {margin-top: 1%!important}
body > div:first-child {position: relative}
.menuwrap {background: rgba(0, 0, 0, 0.25); overflow: visible}
.menuwrap .menu > a {height: 40px}
.menuwrap > .left > li > a, .menuwrap > .right > li > a {line-height: 40px; font-size: 11px; font-weight: bold}
.menuwrap li {line-height: 40px}
.menuwrap a {margin: 0}
.menuwrap .icon a {padding: 0 6px}
body > div:first-of-type {background: #3F51B5}

div.menuwrap {width: 1000px;
/*padding-top: 10px;
padding-bottom: 10px; */
height: 40px !important;
overflow: visible;
background: transparent}

/*bottoni ff*/
#m_up a {padding: 0 11px 0 0}
#c_up {position: absolute; right: 10px; bottom: 10px; opacity: 1}
#f_up {display: inline; position: fixed; bottom: 20px; right: 20px; opacity: 1; background: #3F51B5; height: 64px; width: 64px; border-radius: 32px;
-moz-user-select: none;
-khtml-user-select: none;
-webkit-user-select: none;
-o-user-select: none;
user-select: none}
.p_up:hover, #c_up:hover, #f_up:hover {text-decoration: none; border: 0}

/* esci e news */
.menuwrap b {color: #404040}

/* numero msg e link REGISTRATI */
.menuwrap em {margin-top: 5px; height: 20px; color: #212121; font-size: 11px; background: #FFFFFF; padding: 2px 4px; border-radius: 2px; font-weight: 600; height: 15px; line-height: 15px; letter-spacing: 0 !important}

.menuwrap .nick, .menuwrap .nick a {margin-left: .9em; text-transform: uppercase; font-size: 13px; color: #FFF; margin-right: 15px}
.menuwrap form {padding: 0 11px 0 5px}

/* Effetto menu utente */
.menuwrap li > ul {margin-top: -5px; -webkit-transition:all .1s linear; -moz-transition:all .1s linear; -o-transition:all .1s linear; display: block !important}
.menuwrap li:hover > ul {margin-top: 0; opacity: 1; visibility: visible; box-shadow: 0 8px 17px rgba(0, 0, 0, .2)}
.menu ul {display: block; visibility: hidden; opacity: 0}

/* Avatar Drop Down */
.menuwrap > .left > li:first-child > a > .avatar {margin-left: 10px; line-height: normal; overflow: hidden; width: 30px; height: 30px; position: absolute; top: 5px; border-radius: 100px;
-webkit-transition: all 0.7s ease; -moz-transition: all 0.7s ease; -o-transition: all 0.7s ease; background: rgba(0, 0, 0, .2); z-index: 9 !important}
.menuwrap > .left > li:first-child:hover > a > .avatar {margin-left: 10px; top: 103px; width: 100px; height: 100px}
.menuwrap > .left > li:first-child > ul {z-index: 1; padding-left: 120px}
.menuwrap .nick {margin-left: 3.6em !important}

/* MENU contestuale(dropdown) */
.menu > a:hover, .menu:hover > a {color: #FFFFFF; background: none}
.menu ul {width: 200px; padding-top: 1px; border-radius: 0 0 2px 2px; background: #FFF; box-shadow: 0 8px 17px rgba(0, 0, 0, .2)}
.right .menu ul {margin-left: -20px}
.menu li {padding: 3px 4px; line-height: 140%; text-shadow: 0 1px 0 #FFF}
.menu li strong {padding: 3px 8px; color: #404040}
.menu li a {padding: 3px 3px !important; font-size: 13px; color: #404040; transition: background 0.2s}
.menu li a:hover, .menu li:hover > a {text-shadow: none !important; background: rgba(0, 0, 0, .08)}

/* SUB MENU contestuale(dropright) */
/* Sposta msg pvt */
.submenu.alternative ul {border-top: 1px solid #080808; margin-top: -2px}
.submenu.alternative li:first-child {padding: 3px 4px; border-top: 0}

/* LOGIN VELOCE */
.menuwrap label, .menuwrap form a {padding: 0; font-size: 10pt}
.menuwrap input {padding: 3px; font: 9.5pt helvetica; color: rgba(0, 0, 0, .50); background: #FFFFFF; border: 0; border-radius: 2px}
.menuwrap input:hover {cursor: pointer; color: #212121}
.menuwrap input:focus {cursor: default; color: #212121}
.menuwrap input[type=submit] {color: #212121; background: #FFFFFF; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); border: 0}
.menuwrap input[type=submit]:hover {cursor: pointer}

/* CERCA */
.menuwrap .search input {text-align: left;
border-radius: 2px;
padding-left: 35px;
margin-left: 5px;
color: #FFF;
background: rgba(255, 255, 255, .15) url(http://upload.forumfree.net/i/ff9767406/a_material_day/icns/menuwrap/search.png) no-repeat 5% 50%;
width: 100px;
height: 22px;
-webkit-transition: background 0.2s ease}

.menuwrap .search input:hover {background: rgba(255, 255, 255, .25) url(http://upload.forumfree.net/i/ff9767406/a_material_day/icns/menuwrap/search.png) no-repeat 5% 50%}

.menuwrap .search input:focus {background: #FFF url(http://upload.forumfree.net/i/ff9767406/a_material_day/icns/menuwrap/search_blk.png) no-repeat 0.3% 50%;
color: #212121;
outline: none;
position:absolute;
width: 100%;
z-index: 9;
height: 40px;
top: 0;
left: 0;
margin: 0;
padding: 0;
padding-left: 35px;
font-size: 18px;
border-radius: 0;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
-webkit-transition: background 0.2s}


/* Container */
.container {top: 64px; padding: 40px; padding-top: 10px; background: #FAFAFA; box-shadow: 0 0 2px rgba(0, 0, 0, .12), 0 2px 4px rgba(0, 0, 0, .24); margin-bottom: 90px}

.container, .tabs.top, .tabs.bottom {max-width: 920px}

/* TABS(definizioni valide per tutti i tabs, interni ed esterni al container) */
.tabs {font-family: 'roboto', Tahoma, Verdana, Arial, Serif; letter-spacing: .05em; font-size: 13px}
.tabs li {vertical-align: bottom; margin-left: 5px}
.tabs li:first-child {margin: 0}

.tabs a {display: block; margin: 0; padding: 2px 10px; text-decoration: none; font-weight: bold; color: #FFF; background: #5C6BC0; border-bottom: 0; border-radius: 5px 5px 0 0}
.tabs a:hover, .tabs .current a {color: #444; background: #5C6BC0; border-bottom: 0}

/* TABS disposti attorno il container */
/* 30px come il margin del container */
.tabs.top {text-align: right; position: relative; top: 30px}
/* 31= 30px come il margin del container e 1px per nascondere il bordo del container di 1px */
.tabs.bottom {text-align: right; position: relative; bottom: 31px}

/* come colorare i tabs attorno il container in modo diverso uno dall'altro */
#tab_r1 a {background: #8CBA41; border-color: #ECF2E3; color: #FFF}
#tab_r1 a:hover {background: #9CCA51}

#tab_r2 a {background: #5D89B2; border-color: #E4ECF3; color: #FFF}
#tab_r2 a:hover {background: #6D99C2}

#tab_r3 a {background: #EB8022; border-color: #F3EBE4; color: #FFF}
#tab_r3 a:hover {background: #FB9032}

.tabs.left a {background: #F2F2F2}
.tabs.left a:hover {background: #FBFBFB}

/* RIGHE di COLORE(NON!) ALTERNATO*/
.list > *, table.mainbg tr, .profile .skin_tbl {background: #FFF}
.list > *:nth-child(even), table.mainbg tr:nth-child(even) {background: #FFF}
.big_list > *:first-child {border-top: 1px solid #DDD}
.big_list > * {background: #FFF; border-bottom: 1px solid #DDD}
.big_list > *:last-child {border: none; border-radius: 0 0 2px 2px}
.forum .xx, .forum .yy, .forum .zz, .cp .xx, .cp .yy, .cp .zz {font-size: 13px}

/* HOMEPAGE */
.skin_tbl {box-shadow: none; background: #EEE; -webkit-transition: all 0.3s ease; width: 920px}

/* BOX SHADOW BLOCCHI */
.tag .skin_tbl, .board .skin_tbl.box_minus, .forum .skin_tbl, .cp .skin_tbl, .send .skin_tbl, .profile .skin_tbl, .online .skin_tbl {box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26) !important; border-radius: 2px}


.mback:active {box-shadow: 0 0 4px rgba(0, 0, 0, .14), 0 4px 8px rgba(0, 0, 0, .28);
margin-left: -6px !important;
width: calc(100% + 12px) !important;
-webkit-transition: all 0.2s ease}
.mback {box-shadow: 0 0 2px rgba(0, 0, 0, .12), 0 2px 4px rgba(0, 0, 0, .24);
background: #3F51B5;
height: 41px;
border-radius: 1px;
position: relative;
-webkit-transition: all 0.2s ease;
overflow: hidden;
transition-delay: 0.2s;
-moz-user-select: none;
-khtml-user-select: none;
-webkit-user-select: none;
-o-user-select: none;
user-select: none}
.skin_tbl.box_minus > .mback {margin-left: -4px;
width: calc(100% + 8px)}
.skin_tbl.box_plus > .mback {margin-left: 0;
width: 100%}
.mback_left {width: 5%; background: url('http://image.forumfree.it/9/2/4/9/2/7/4/1423781510.png'); background-repeat: no-repeat; background-position: center}
.mback_right {width: 38px; text-align: left !important}
.topic .mback_left, .topic .mback_right {display: none}

.mtitle {text-align: left; padding: 5px 11px; font-size: 14px; font-weight: normal; color: #FFF; background: transparent !important}
.title, .darkbar {background: #ECECEC !important; font-weight: bold; font-size: 12px; margin-top: 3px}
.board .skin_tbl.box_minus {margin-bottom: 42px}

/* FIX MTITLE */
.board .mtitle, .forum .mtitle, .stats .mtitle, .send .mtitle {margin-left: 10px; white-space: nowrap}
.topic .mtitle {margin-left: 10px; white-space: nowrap}
.stats .mback {display: none}


/* .on .off .annuncio .importante .calda .chiusa .spostata */
/* se non si specifica .forum ha effetto anche sul blog */
.forum .annuncio {background: #E5F1F5}
.forum .annuncio:nth-child(even) {background: #EEF8FB}
.forum .importante {background: #E8F2E9}
.forum .importante:nth-child(even) {background: #F0FAF1}
.board .off .aa, .board .off img {-webkit-transition: all 0.2s linear; -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; opacity: .8}
.board .off:hover .aa, .board .off:hover img {opacity: 1}



/* SELEZIONE RIGA: MultiQuote e Moderazione */
/*.topic .focus {opacity: .6} <- default */
.focus .nick a {color: #3F51B5}
.focus .color a {color: #FFF}
.focus .color {color: #FFF}
.focus a {color: #FFF}
.focus {color: #FFF !important; background: #3F51B5 !important; transition: all .2s}
.focus:nth-child(even) {color: #FFF !important; background: #3F51B5 !important}
.cp .focus *, .forum .focus *, .blog .focus .title2, .blog .focus .tags * {color: #FFF !important; text-shadow: 0 0 2px #4096BC}
.forum .zz input {top: 40% !important}
.web {font-size: 14px; font-weight: bold}
.desc {font-weight: normal; font-size: 11px}
.spostata .web a {color: #31666E; font-style: italic}

.board .web a {font-size: 14px; color: #272729; font-weight: bold; margin-top: 4px}
.board .desc {text-align: justify; font-weight: normal; font-size: 13px; margin-top: 8px; margin-bottom: 8px; margin-right: 10px}
.forum .web a {font-size: 14px; color: #272729; font-weight: normal}
.forum .desc img {max-width: 200px; height: auto; margin: 2px; padding: 2px; background: #FFF; border: 1px solid #D3D3D3}

/* Control Panel: Messenger, UserCP e ModCP */
.cp .tabs {text-align: left}
.cp .tabs .current a {font-size: 13px; font-weight: bold; color: #FFF; text-shadow: 0 -1px 0 #777; background: #9C9C9C !important; border: 0; border-bottom: 1px solid #9C9C9C}
/* edit avatar */
.tabs2 div:hover {background: #E0E0E0}
.tabs2 .current div {background: #FFF !important}

/* non voglio che l'angolo in alto a sinistra di skin_tbl sia arrotondato perch&#233; ci sono dei tab */
#msg .cp .skin_tbl, #user .cp .skin_tbl {border-radius: 0 5px 5px 5px}
#msg .cp .sunbar.top, #user .cp .sunbar.top {border-radius: 0 5px 0 0}

#msg .cp .sunbar, #user .cp .sunbar, #send .send .sunbar {padding-left: 2%; padding-right: 2%; text-align: right}

/* INBOX: lista messaggi privati */
#msg .cp .web {font: 14px verdana}
#msg .cp .post {background: #F5F5F5}

/* RISPOSTA RAPIDA */
.fast.send .mainbg > ul > li:last-child .right {right: 20px} .fast.send .mainbg > ul > li:nth-child(2) {left: 1px}
.fast.send .mainbg > ul > li:first-child .left {right: 135px; top: 24px; bottom: 24px !important}
.fast.send .codebuttons:nth-child(1), .fast.send .codebuttons:nth-child(2), .fast.send .codebuttons:nth-child(3) {display:inline-block; color: #212121; background: #FFF; border-radius: 4px; margin-top: 20px}
.fast.send .mainbg > ul > li:last-child .left, .fast.send .mainbg > ul > li:first-child div + div {display: none}
.fast.send .mainbg > ul > li:first-child .left, .fast.send .mainbg > ul > li:nth-child(2), .fast.send .mainbg > ul > li:last-child .right {position:absolute; top: 3px; margin-left: 4px}
#topic .topic > div > div > .buttons, .current_forum {display: none}
#topic .topic > .bottom > .left {display:none}

.fast.send .mback {display: none}
.fast.send .skin_tbl {height: 70px; position: relative; background-color: #FFF}
.fast.send .forminput {padding: 8px;
color: #3F51B5;
margin-top: 15px;
background: transparent !important;
transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
font-family: "Roboto";
font-weight: 600;
text-transform: uppercase;
border: none}
.fast.send .forminput:hover {background: rgba(153, 153, 153, 0.2)!important}
.fast.send .forminput:active {background: rgba(153, 153, 153, 0.4)!important}
.fast.send .codebuttons {display: none}
.fast.send .textinput {margin: 2px; overflow:hidden; width: 640px !important; height: 47px; resize:none; outline: none; border: solid 1px #DDD; border-radius: 2px}

/* SONDAGGI */
/* line height &#232; utile per centrare il testo verticalmente */
.bar {background: #CBEDFF; height: 15px; line-height: 15px; font-size: 10px; color: #212121 !important; border-radius: 3px}
.bar div {background: #70C6EC; border-radius: 3px 0 0 3px}
.max .bar {background: #CCF1D3}
.max .bar div {background: #76CD87}

/* DISCUSSIONI */
.topic .mtitle {font-weight: normal} .topic .mdesc {font-weight: normal}

.topic .mback {box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26) !important}


.post {background: #FFF; margin-top: 20px; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); padding: 6px; border-radius: 2px}

.topic .title.top {box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); margin-top: 0 !important}
.topic .title.bottom {display: none}

.post:first-child {border: 0; border-radius: 0 0 2px 2px; margin-top: 0}
.post:last-child {border-radius: 2px 2px 0 0}
.post:nth-child(even) {background: #FFFFFF}

.post .center .left {padding: 0 10px}
.post .center .right {padding: 10px 0; border-top: 1px solid #DDD !important}
.post .center .left {padding: 0 10px}
.post .right {padding-left: 10px !important; padding-right: 10px !important}
.post .bottom {font-size: 12px}

.color {font-size: 13px; line-height: 1.7em; color: #333333; padding-right: 5px; text-align: justify}
.color a {color: #146AAE}
.color a:hover {border-bottom: 1px dotted #95DDFF}
.color hr {height: 0; border: 0; border-top: 1px dashed #646464}
.color a[href ^="http://"] {background:url(http://digilander.libero.it/Roxrite/Altro/Icone/links.png) center right no-repeat; padding-right: 13px; text-decoration:none; border-bottom: 1px dotted #222}
.edit {font-size: 12px; color: #BBB; color: rgba(0, 0, 0, .5)}
.fancyborder {border: 1px dotted #CBC8B9 !important; background: #F6F6F2}
.bottomborder {border-bottom: 1px dashed #A9C7AF}

.post .nick {text-align: left; font-weight: bold; font-size: 15px}
.post .nick a {position: absolute; margin-left: 54px; margin-top: 30px; z-index: 2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; -o-text-overflow: ellipsis; max-height: 22px; max-width: 100px}

.topic > .skin_tbl {background:none}

/* Riquadro avatar */
.details img[alt="Avatar"] {border-radius: 2px 2px 2px 2px}
.post .avatar {display: inline-block; float: left; margin-left: 5px; margin-top: 4px}
.post .avatar img {display: inline-block; height: 48px; width: 48px; border-radius: 100%;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26)}
.post .avatar > *, .post .avatar > * > * {width: 48px; height: 48px}

/* avatar e altri dettagli */
.post .details {position: relative; overflow: visible !important; padding: 5px; color: #344A67; font-size: 12px; width: 170px; background: #EDEDED; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); margin-left: -16px}

.u_group > dt, .details p, .post .u_title, .post .u_rank, .post .u_location {display:none !important}

.post .u_group {text-align: left; position: absolute; margin-left: 62px; margin-top: 28px; color: #555 !important}
.u_posts {padding-top: 62px}
.u_reputation dd {color: #344A67 !important}
.u_posts, .u_location, .u_reputation, .u_joined, .u_status {text-align: left; padding-left: 2px; line-height: 1.4em}
.u_reputation dd, .post .u_group, .u_posts dt, .u_reputation dt, .u_location dt, .u_joined dt, .u_status dt {font-weight: normal !important}

/* online, offline, anonimo */
.u_status {text-align: left; padding-left: 2px; margin-top: -14px}
.box_online .u_status dd {color: green}
.box_offline .u_status dd {color: #C06060}
.box_anonimo .u_status dd {color: #7D7D7D}


/* CITAZIONI, SPOILER e CODICI annidati */

/* 1&#176; livello */
.quote, .code {padding: 5px; font-size: 13px; font-weight: normal; color: #64676F; background: #E6E6EB; border-left: 3px solid #C6C6D1}

/* 2&#176; livello */
.quote .quote, .quote .code, .spoiler .quote, .code .code {color: #333; background: #EEE}

/* 3&#176; livello */
.quote .quote .quote, .quote .quote .code,
.spoiler .quote .quote, .spoiler .quote .code,
.quote .spoiler .quote, .quote .code .code {color: #212121; background: #DDD}

/* 4&#176; livello */
.quote .quote .quote .quote, .quote .quote .quote .code,
.spoiler .quote .quote .quote, .spoiler .quote .quote .code,
.quote .spoiler .quote .quote, .quote .spoiler .quote .code,
.quote .quote .spoiler .quote, .quote .quote .code .code,
.quote .quote .quote .code {color: #333; background: #EEE}

.quote_top, .code_top {font-size: 12px; color: #666; margin: 1em}

/* 1&#176; livello */
.quote_top:before, .spoiler .code_top:before {color: #CCC; content:'&#8220;'; position: relative; top: 16px; margin-right: 5px; font-size: 40px; font-family: 'Times New Roman'; font-weight: bold}
.code_top:before {color: #CCC; content:'<!'; position: relative; top: 1px; margin-right: 5px; font-size: 17px; font-family: arial; font-weight: bold}
.code_top:after {color: #CCC; content:'>'; position: relative; top: 1px; margin-left: 6px; font-size: 17px; font-family: arial; font-weight: bold}
.spoiler .code_top:after {content: none}

/* 2&#176; livello */
.quote .quote_top:before, .quote .code_top:before, .quote .code_top:after,
.spoiler .quote_top:before, .code .code_top:before, .code .code_top:after {color: #FDFDFD}

/* 3&#176; livello */
.quote .quote .quote_top:before, .quote .quote .code_top:before, .quote .quote .code_top:after,
.spoiler .quote .quote_top:before, .spoiler .quote .code_top:before, .spoiler .quote .code_top:after,
.quote .spoiler .quote_top:before, .quote .code .code_top:before, .quote .code .code_top:after {color: #CCC}

/* 4&#176; livello */
.quote .quote .quote .quote_top:before, .quote .quote .quote .code_top:before, .quote .quote .quote .code_top:after,
.spoiler .quote .quote .quote_top:before, .spoiler .quote .quote .code_top:before, .spoiler .quote .quote .code_top:after,
.quote .spoiler .quote .quote_top:before, .quote .spoiler .quote .code_top:before, .quote .spoiler .quote .code_top:after,
.quote .quote .spoiler .quote_top:before, .quote .quote .code .code_top:before, .quote .quote .code .code_top:after,
.quote .quote .quote .code_top:before, .quote .quote .quote .code_top:after {color: #FDFDFD}

/* TAGBOARD e SHOUTBOX */
.tag {font-family: roboto}
.tag .skin_tbl {border-top: 1px solid rgba(0, 0, 0, .02) !important; background: #EEEEEE !important}
.tag .mback {display:none}
.shout_hr_resize {display:none}
.shoutbox .avatar > img {height: 30px !important; width: 30px !important; border-radius: 15px; border:none !important; padding: 0; margin: 2px}
.msg_online .avatar > img, .msg_offline .avatar > img {background:none}
.shout_msg .when, .shout_msg_loading .when {margin-top: 7px}
.shoutbox .sb_msg_edit, .shoutbox .sb_msg_delete, .shoutbox .sb_user_ip {margin-top: 8px}
.shoutbox .top .right {margin-left: 5px}
.shout_msg > * {vertical-align:middle}
.shoutbox .sb_sending textarea {width: 99%; min-width: 99% !important; resize:none; height: 30px !important; border-radius: 4px; border: 1px solid rgba(236, 236, 236, 0.2)}
.sb_icons input {background: url(http://i.imgur.com/18oRW1P.png);
height: 20px;
background-size: 20px 20px;
background-repeat: no-repeat;
width: 20px;
text-indent: -9999px}
.sb_voice_input {background: transparent !important}
.sb_code {background: url(https://google.github.io/material-design-icons/content/svg/ic_text_format_24px.svg) no-repeat center center !important}
.sb_users_online {background: url(http://i.imgur.com/BL6UQEz.png) no-repeat center center !important}
.sb_tool_pref {background: url(http://i.imgur.com/mxAlGDl.png) no-repeat center center !important}
.sb_admin {background: url(http://i.imgur.com/mt7oG8q.png) no-repeat center center !important}
.sb_users_online_span b {padding: 0 2px !important; margin: -3px}
.sb_shout_credits {display:none}

/* LISTA UTENTI ONLINE */
.online li {font-size: 13px}
.online .yy a {font-weight: bold}
.statsblock img {border-radius: 100%}
.statsblock.lastuser b {width: 160%}

/* Statistiche */
.stats {box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26)}
.stats .aa {width: 0; display:none}
.stats .zz {width: 100%; padding: 4px 0 !important; text-align:center}
.stats .mback {visibility: hidden}
.stats .mback .mtitle {visibility:visible; color: #4285F4; text-align:center; margin-left: 0!important}
.stats .skin_tbl {background: #FFF}
.stats .skin_tbl.bottom {border-top: 1px solid #DDD}
ul.stats.list {box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26)}

/* Pre Gruppi*/
.stats} .groups span {padding: 1px 8px; display: inline-block}
.stats .groups dd:after {display: none}
.stats .groups dd:before {display: none}
.stats .groups:before {display:none}
.stats * {list-style-type: none}
.stats .groups dd:last-child:after {display: none}



/* simbolo tra un nick e il successivo */
.users li:before {content:' - '; color: #AAA; font-weight: bold} .users li:first-child:before {content: none}
.users a:hover {border-bottom: 1px dotted #999}

/* REGISTRAZIONE RAPIDA */
.reg {margin-bottom: 30px; padding: 2px; background: #888; border: 1px solid #DDD; border-radius: 5px}
.reg .skin_tbl {border: 0}

/* AVVISI */
/* pop up */
.popup > div {background: #FBFBFB}
#redirect .info {border: 1px solid #FFF}

.navsub .info {font-size: .8em}
.alert, .info {border-radius: 5px}
.alert {padding: 5px; font-size: 13px; font-weight: normal; background: #F2D9D9; border-radius: 3px; border: 2px solid #FDFDFD; box-shadow: 0 8px 17px rgba(0, 0, 0, .2); color: #C00 !important; text-shadow: 1px 1px 0 #F4E0E0}
.info {padding: 5px; font-size: 13px; font-weight: normal; background: #D9E1F2; border-radius: 3px; border: 2px solid #F9F9F9; color: #146AAE !important; text-shadow: 1px 1px 0 #E1EBF9}
.alert a, .info a {color: #FFF !important; text-shadow: none; font-weight: bold}

/* PROFILO */

.profile .skin_tbl {height: 190px; padding-top: 40px}
.profile .main_list {height: 180px}
.profile .avatar img {border-radius: 100%;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
height: 110px;
width: 110px}
.profile .skin_tbl {background: #FFF}
.profile {position:relative}
.profile .tabs {border-radius: 0;
color: #FFF !important;
background: #3F51B5;
height: 40px;
line-height: 34px;
position: absolute;
width: 920px;
border-bottom: 1px solid #DDD}
.profile .tabs li a {border-radius: 0;
color: #FFF;
border-bottom: 2px transparent solid;
text-transform: uppercase;
font-size: 12px;
font-family: "Roboto";
font-weight: 400;
transition: border .2s}
.profile .tabs li a:hover, .profile .tabs .current a {border-bottom: 2px #FFF solid}
.profile h2 {margin-top: 1.5%; padding: 10px; background-color: #FFF; border-radius: 3px}
.profile .nick {line-height: 1em; margin: 5%; color: #212121; font: 16px 'Trebuchet MS', Tahoma, Verdana, Arial, Serif; font-weight: bold; text-shadow: none}
.profile dl, .profile dl a {font-size: 13px}
/* non voglio che l'angolo in alto a destra di skin_tbl sia arrotondato perch&#233; ci sono dei tab */
.profile .left {position: relative; vertical-align: middle!important}
#profile .box_offline .u_status dd:before, #profile .box_online .u_status dd:before, #profile .box_anonimo .u_status dd:before, .profile .u_status, .profile .u_reputation {display:none !important}

/* NUMERI PAGINA indicati accanto al TITOLO di un TOPIC */
.pages2 {font-size: 11px} .pages2:before, .pages2:after {content: none}
.pages2 li {margin: 0 .2em; padding: 0}
.pages2 li:first-child a {background: transparent; border: 0}
/* indicando a:link e a:visited i numeri rimangono colorati di nero anche se la riga viene selezionata e ha classe .focus */
.pages2 a:link, .pages2 a:visited {opacity: .6; padding: 1px 4px; color: #212121!important; text-shadow: none !important; background: #CCC; border: 1px solid #AAA; border-radius: 100px}
.pages2 a:hover {opacity: .9}

/* NUMERI PAGINA esterni alle tabelle */
.top .pages {text-align: center; padding-bottom: 15px}
.bottom .pages {text-align: center; padding-top: 20px}
.left .pages {padding: 0}

.pages {font-size: 13px}

.pages li {margin: 0 .2em; padding: 0; vertical-align: middle}
.pages .current:before, .pages .current:after, .pages .lastpost:before, .pages .lastpost:after {content: none}

.pages li a, .pages .current {padding: 0; font-size: 13px; color: #7D7D7D; border: 1px solid #D9D9D9; background: linear-gradient(#FFF,#EEE); display: inline-block; width: 28px; height: 26px; font-weight: normal; line-height: 26px}
.pages li a:hover {border: 1px solid #C8C8C8}
.pages .current {background: #5E98D9; color: #FFF; text-shadow: 0 1px 0 rgba(0, 0, 0, .13); box-shadow: inset 0 1px 5px rgba(0, 0, 0, .3), 0 1px 0 #FFF; border: 1px solid rgba(0, 0, 0, .35)}

.pages .jump a, .pages .lastpost a {display: inline-block; height: 26px; text-align: center; line-height: 26px}
.pages .jump a {width: 72px}
.pages .lastpost a {width: 132px}


/* INPUT e BOTTONI */
.textinput {padding: 3px; font: 13px 'Roboto'; color: #222; background: #FFF; border: 1px solid #CCC; border: 1px solid rgba(0, 0, 0, .2)}
textarea.textinput {line-height: 130%; font: 13px 'Roboto'}
.forminput {padding: 2px; font: 12px 'Roboto'; color: #222; background: #FFF; border: 1px solid #CCC; border: 1px solid rgba(0, 0, 0, .2)}
.codebuttons {font: 12px 'Roboto'; background: #E3E4E7; padding: 4px; border: 0; color: #646464; text-align: center}

/* form di accesso a Inbox, Sent Items... */
.sunbar .forminput {color: #FFF; background: #666; border: 1px solid #555; padding: 0; box-shadow: none}
.sunbar .forminput:hover {background: #555; border-color: #444}

/* form sotto bottone Nuova Disc. */
.navsub form {font-size: .8em}
.navsub .forminput {color: #212121; background: #DDD; border: 1px solid #BBB}
.navsub .forminput:hover, .navsub .forminput:focus {background: #E5E5E5}

/* form di ordinamento in fondo alle sezioni */
.title .forminput {padding: 2px; color: #212121; background: #CCC; border: 1px solid #BBB}
.title .forminput:hover {background: #DDD}
.title input.forminput {font-weight: bold; color: #FFF; background: #888; border: 1px solid #666}
.title input.forminput:hover {background: #70C6EC; border-color: rgba(82, 168, 236, .75)}
div.title.bottom.reserved {background: #FFF!important}


/* bottone invio risposta */
.darkbar .forminput:hover, .fast.send .forminput:hover {background: rgba(153, 153, 153, 0.2)!important}
.darkbar .forminput:active {background: rgba(153, 153, 153, 0.4)!important}
.darkbar .forminput {padding: 8px;
color: #3F51B5;
background: transparent !important;
transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
font-family: "Roboto";
font-weight: 600;
text-transform: uppercase;
border: 0;
float: right}


/* bottone preview */
.darkbar {text-align:right;
height: 40px}
.darkbar button.forminput {color: #212121;
background: transparent !important;
transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
font-family: "Roboto";
font-weight: 600;
text-transform: uppercase;
border: 0;
float: left}
.darkbar button.forminput:hover {background: rgba(153, 153, 153, 0.2)!important}
.darkbar button.forminput:active {background: rgba(153, 153, 153, 0.4)!important}

/* Nuova Disc. e Rispondi */
.buttons {padding: 20px 2px} .sidebar .buttons {padding: 10px 0 0 0}
.buttons a {border: 0; margin-left: 12px}
.buttons a:first-child {margin: 0}

/* bordo e sfondo dei bottoni viene assegnato a '.buttons span' invece che a '.buttons a' perch&#195;&#169; nel caso in cui nel pannello amministrativo delle immagini venissero messi dei bottoni, gli effetti sarebbero applicati anche a loro, ma questo non lo vogliamo */
.buttons span {padding: 8px; color: #212121; background: transparent!important; transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; font-family: "Roboto"; font-weight: 600; text-transform: uppercase}
.buttons span:hover {background: rgba(153, 153, 153, 0.2)!important}
.buttons span:active {background: rgba(153, 153, 153, 0.4)!important}

/* MP, E-mail, Web... */
.mini_buttons a {border: 0; line-height: 2.5em; font-weight: bold; font-size: 13px}
.post .mini_buttons a {line-height: 1em; font-size: 13px}

/* .mini_buttons > * seleziona anche il bottone di Facebook */
.mini_buttons > * {margin-left: 10px}
.post .mini_buttons > * {margin-left: 12px}
.post .bottom .mini_buttons > * {margin-left: 14px}
.mini_buttons > *:first-child {margin: 0 !important}

/* scritta multiquote */
.title2 label {font-weight: bold}

/* Risposta */
#loading .top, .summary .list .top {color: #404040; border-bottom: 1px solid #404040}
#loading .bottom, .summary .list .bottom {border-top: 1px solid #404040}
.fast.send .sunbar {text-align: center; font-size: 10pt; font-weight: bold; color: #404040; text-shadow: 0 1px 0 #FFF; background: linear-gradient(#F3F3F3,#E8E8E8); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .65)}
.sunbar {text-align: center; font-size: 10pt; font-weight: bold; color: #404040; text-shadow: 0 1px 0 #FFF; background: linear-gradient(#F3F3F3,#E8E8E8); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .65)}
.sunbar.top {border-radius: 5px 5px 0 0}
.sunbar.bottom {border-radius: 0 0 5px 5px}
.sunbar a {color: #5C9CE5}
.sunbar a:hover {color: #4C82BF}
.summary .skin_tbl {border: 0}
.summary .list > * {border-top: 1px dotted #FFF}
.summary .list > *:first-child {border: 0}
.summary .list {font-size: 10pt}
.summary .quote, .summary .code {font-size: 9pt}

/* @FONT-FACE */
@font-face {font-family: 'BackSpace';
font-style: normal;
font-weight: 200;
src: local('Exo ExtraLight'), local('Exo-ExtraLight'), url(http://themes.googleusercontent.com/static/fonts/exo/v1/z1hPnoJcXaXYata_d2utlw.woff) format('woff')}

/* SLIDESHOW A SCORRIMENTO AUTOMATICO */
#slideshow {width: 600px; height: 300px; margin: 10px auto; text-align: center; margin-bottom: -94px; margin-right: 12px}
#slideshow input {display: none}
#mask {width: 100%; overflow:hidden}
#slides {border-radius: 2px; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); background-color: #FFF; padding: 10px; height: 180px}

.slide_content {position: relative; width: 500%; -webkit-transition: all 800ms cubic-bezier(0.670, 0.000, 0.170, 1.000); -moz-transition: all 800ms cubic-bezier(0.670, 0.000, 0.170, 1.000); -ms-transition: all 800ms cubic-bezier(0.670, 0.000, 0.170, 1.000); -o-transition: all 800ms cubic-bezier(0.670, 0.000, 0.170, 1.000); transition: all 800ms cubic-bezier(0.670, 0.000, 0.170, 1.000)}

#pan1:checked ~ #slides .slide_content {margin-left: 0}
#pan2:checked ~ #slides .slide_content {margin-left: -100%}
#pan3:checked ~ #slides .slide_content {margin-left: -200%}
#pan4:checked ~ #slides .slide_content {margin-left: -300%}

.pannello {width: 20%; float: left; font-size: 13px; color: #646464; text-shadow: 0 1px 1px rgba(255, 255, 255, .7)}

#active {margin-top: 5px}
#active label {display: inline-block; width: 14px; height: 14px; border-radius: 100px; background: #D3DDEA; margin: 5px; cursor: pointer; margin-top: 8px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease}
#active label:hover {background: #D3DDEA}

#pan1:checked ~ #active label:nth-child(1),
#pan2:checked ~ #active label:nth-child(2),
#pan3:checked ~ #active label:nth-child(3),
#pan4:checked ~ #active label:nth-child(4) {background: #D3DDEA; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease}

.slideimg {height: 168px; width: 287px !important; margin-top: 4px}

.lastcomm {width: 275px; height: 192px; background-color: #FFF; padding: 4px 0 4px 10px; margin-top: 5px; border-radius: 2px; color: #848484; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26)}

/* LISTA IN ORDINE ALFABETICO */
#alf {font-size: 24px; color: #444645}
#alf a {color: #8F9092}
#alf a:hover {color: #444645; border: none}



/* ANIMAZIONE TARGHETTE */
.web a:link img, .web a:visited img {-webkit-transition: all 0.2s linear; -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; opacity: .8}
.web a:hover img .logo:hover {opacity: 1}
.off a:link img, .off a:visited img {-webkit-transition: all 0.2s linear; -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; opacity: .8}
.off a:hover img .logo:hover {opacity: 1}

/*CREDITS*/
.credits {background: #3F51B5; bottom: 0; height: 60px; color: #FFF}

/*Cambio colori: stile finestra*/
.info {height: auto !important}
.info#currentpal {display: none !important}
.popup {border: 3px solid #FFF !important;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26) !important;
border-radius: 3px !important;
-moz-border-radius: 2px !important}

/*Classe shadowed per aggiungere facilmente ombre da js*/
.shadowed {box-shadow: 0 0 4px rgba(0, 0, 0, .14), 0 4px 8px rgba(0, 0, 0, .28)}

/*POLYMER*/

/* SECTION */
section > * {margin: 13px}

/* FAB */
.fab {position: relative;
display: inline-block;
width: 46px;
height: 46px;
border-radius: 50%;
color: #FFF;
overflow: hidden;
transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1);
transition-delay: 0.2s;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26)}

.fab.all {background-color: #3F51B5}

.fab.f-up {background-color: #3F51B5; width: 64px !important;
height: 64px !important}

.fab.slide {background-color: #3F51B5; width: 10px !important; height: 10px !important}

.fab:active {box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2);
transition-delay: 0s}

.fab > img::shadow path {fill: #FFF}

/* Button */
.button {display: inline-block;
position: relative;
min-width: 120px;
min-height: 32px;
line-height: 32px;
border-radius: 2px;
font-size: 0.9em;
background-color: #FFF;
color: #646464;
-moz-user-select: none;
-khtml-user-select: none;
-webkit-user-select: none;
-o-user-select: none;
user-select: none}

.button > paper-ripple {border-radius: 2px;
overflow: hidden}

.button.narrow {width: 60px}

.button.grey {background-color: #EEE}

.button.blue {background-color: #4285F4;
color: #FFF}

.button.green {background-color: #0F9D58;
color: #FFF}

.button.dynamic {background-color: #3F51B5;
color: #FFF}

.button.credits {background: #3F51B5; width: 749px;
margin-bottom: 10px; height: 40px; color: #FFF}

.button.raised {transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1);
transition-delay: 0.2s;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26)}

.button.raised:active {box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2);
transition-delay: 0s}


.button.flat {padding-left: 8px;
padding-right: 8px;
margin-left: 4px;
margin-right: 4px;
color: #212121;
background: transparent !important;
transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
font-family: "Roboto";
font-weight: 600;
text-transform: uppercase;
font-size: 12px;
min-height: 36px;
min-width: 64px;
vertical-align: middle;
line-height: 36px}

.button.flat.dynamic {color: #3F51B5}
.button.flat.dynamic:hover {background: rgba(153, 153, 153, 0.1)!important}
.button.flat.dynamic:active {background: none!important}

.button.flat:hover {background: rgba(153, 153, 153, 0.2)!important}
.button.flat:active {background: rgba(153, 153, 153, 0.4)!important}

.button.flat.disabled {color: rgba(33, 33, 33, 0.26)}
.button.flat.disabled:hover {background: none!important}
.button.flat.disabled:active {background: none!important}

.button.flat.colored {color: #03A9F4}
.button.flat.colored:hover {background: rgba(153, 153, 153, 0.1)!important}
.button.flat.colored:active {background: none!important}
/* FINE POLYMER */

/* Avatar accanto all'ultimo messaggio */
.ffav_lastpost {display:inline-block; vertical-align:top; max-width: 30%}
.ffav_lastpost > *, .ffav_lastpost > * > *, .ffav_lastpost > * > * > *, .ffav_lastpost > * > * > * > * {height: 50px !important; width: 50px !important}
.ffav_lastpost img {margin: 5px 0 0;
padding: 1px;
border-radius: 100%;
background: #FFF}
.ffav_lastpost-detalis {font-size: inherit; color: inherit; display:inline-block; margin: 0 0 0 10px; max-width: 60%}
.forum .zz .ffav_lastpost-detalis .when > *, .forum .zz .ffav_lastpost-detalis .who > * {display: inline-block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100%}

/* Avatar accanto alle citazioni */
#ffav_quote {padding-left: 83px !important; padding-bottom: 25px !important}
.quoteentry img {width: 60px; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1); height: 60px; float: left; margin-top: 10px; margin-left: 30px; padding: 1px; border: 1px solid #D5D5D5; background: #FFF}


/* ------ END ------ */

A_STAR:<img src="http://img.forumfree.net/style_images/52/star.png" width="15" height="15" alt="">
FEMALE_STAR:<img src="http://img.forumfree.net/index_file/star_f.png" width="15" height="15" alt="">
MALE_STAR:<img src="http://img.forumfree.net/index_file/star_m.png" width="15" height="15" alt="">
F_NAV:<img src="http://i.imgur.com/n9dFrPY.png" alt="F_NAV">
F_NAV_SEP:<img src="http://img.forumfree.net/style_images/52/nav_sep.png" alt="F_NAV_SEP">
C_ON:<img src='http://i.imgur.com/v5GthzP.png' width='24' height='24' alt='C_ON'>
C_OFF:<img src='http://i.imgur.com/wZYs98U.png' width='24' height='24' alt='C_OFF'>
C_ON_RES:<img src='http://i.imgur.com/v5GthzP.png" width='24' height='24' alt='C_ON_RES'>
C_OFF_RES:<img src='http://i.imgur.com/wZYs98U.png' width='24' height='24' alt='C_OFF_RES'>
C_LOCKED:<img src='http://i.imgur.com/v5GthzP.png' width='24' height='24' alt='C_LINK'>
F_ACTIVE:<div></div>
F_STATS:<div></div>
A_POST:<span>NUOVA DISCUSSIONE</span>
A_REPLY:<span>RISPONDI</span>
A_POLLONLY_B:<span><img src="http://img.forumfree.net/style_images/52/t_poll.png" alt="A_POLLONLY_B"> A_POLLONLY_B</span>
A_LOCKED_B:<span><img src="http://img.forumfree.net/style_images/52/t_closed.png" alt="A_LOCKED_B"> A_LOCKED_B</span>
M_REPLY:<img src="http://upload.forumfree.net/i/ff9767406/a_material_day/icns/message_draw.png" alt="M_REPLY"> M_REPLY
M_DELETE:<img src="http://upload.forumfree.net/i/ff9767406/a_material_day/icns/delete.png" alt="M_DELETE"> M_DELETE
M_ADDMEM:<img src="http://upload.forumfree.net/i/ff9767406/a_material_day/icns/account_plus.png" alt="M_ADDMEM"> M_ADDMEM
M_UNREAD:<img src="http://img.forumfree.net/style_images/52/f_norm.png" alt="M_UNREAD">
M_READ:<img src="http://img.forumfree.net/style_images/52/f_norm_no.png" alt="M_READ">
B_PIN:<img src="http://img.forumfree.net/style_images/52/f_pinned.png" alt="B_PIN">
B_ANNUNCIO:<img src="http://img.forumfree.net/style_images/52/annuncio.png" alt="B_ANNUNCIO">
B_NEW:<img src="http://img.forumfree.net/style_images/52/f_norm.png" alt="B_NEW">
B_NORM:<img src="http://img.forumfree.net/style_images/52/f_norm_no.png" alt="B_NORM">
B_HOT:<img src="http://img.forumfree.net/style_images/52/f_hot.png" alt="B_HOT">
B_HOT_NN:<img src="http://img.forumfree.net/style_images/52/f_hot.png" alt="B_HOT_NN">
B_POLL:<img src="http://img.forumfree.net/style_images/52/f_poll.png" alt="B_POLL">
B_POLL_NN:<img src="http://img.forumfree.net/style_images/52/f_poll_no.png" alt="B_POLL_NN">
B_MOVED:<img src="http://img.forumfree.net/style_images/52/f_moved.png" alt="B_MOVED">
B_LOCKED:<img src="http://upload.forumfree.net/i/ff9767406/a_material_day/icns/lock.png" alt="B_LOCKED">
NEW_POST:<img src="http://img.forumfree.net/style_images/52/newpost.png" alt="NEW_POST">
PAG:<img src="http://img.forumfree.net/index_file/pages.gif" width="11" height="11" alt="PAG">
CAT_IMG:<img src="http://img.forumfree.net/index_file/post.gif" width="8" height="9" alt="view post" title="view post">
THUMBS_UP:http://img.forumfree.net/index_file/thumbs_up.png
THUMBS_DOWN:http://img.forumfree.net/index_file/thumbs_down.png
P_DELETE:<img src="http://upload.forumfree.net/i/ff9767406/a_material_day/icns/delete.png" alt="P_DELETE"> P_DELETE
P_EDIT:<img src="http://upload.forumfree.net/i/ff9767406/a_material_day/icns/message_draw.png" alt="P_EDIT"> P_EDIT
P_QUOTE:<img src="http://upload.forumfree.net/i/ff9767406/a_material_day/icns/account_plus.png" alt="P_QUOTE"> P_QUOTE
P_MSG:<img src="http://img.forumfree.net/style_images/52/p_msg.png" alt="P_MSG"> P_MSG
P_EMAIL:<img src="http://img.forumfree.net/style_images/52/email.png" alt="P_EMAIL"> P_EMAIL
P_CONTACTS:<img src="http://img.forumfree.net/style_images/52/p_contacts.png" alt="P_CONTACTS"> P_CONTACTS
P_WEBSITE:<img src="http://img.forumfree.net/style_images/52/p_www.png" alt="P_WEBSITE"> P_WEBSITE
EMOTICONS:http://img.forumfree.net/style_images/1/icon1.gif
EMOTICONS2:http://img.forumfree.net/style_images/1/icon11.gif
LOADING:http://4.bp.blogspot.com/-L2Td-3QtUTo/UcbAvCQTYvI/AAAAAAAAAUM/Z4_GBilAu9g/s1600/spinner_64_3f4fa14117c586c002a98cd7c5fbb2d3.gif
PREVIEW:http://img.forumfree.net/index_file/preview.png
FULL_EDITOR:http://img.forumfree.net/index_file/full.png
HELP:http://img.forumfree.net/index_file/help.png
COLOR:http://upload.forumfree.net/i/ff9767406/a_material_day/icns/invert_colors.png
HTML:http://img.forumfree.net/index_file/html.png
ATTACHMENT:http://img.forumfree.net/index_file/attachment.png
ONLINE:Online
OFFLINE:Offline
ANONIMO:Anonimo
P_UP:<img src="http://img.forumfree.net/style_images/52/p_up.png" width="16" height="16" alt="Top">
F_UP:<div class="fab f-up"> <img src="http://i.imgur.com/5wVIud1.png"><paper-ripple class="f-up-button" fit></paper-ripple> </div>
F_UP_SHOW:1
C_UP:<img src="http://img.forumfree.net/index_file/up_c.png" width="18" height="18" alt="Top">

/* FFMOBILE MATERIALDAY SKIN */

#html_home {margin:auto}

body {font: 14px/150% 'Roboto', Trebuchet MS, Tahoma, Sans-serif; color: #616161; background-color: #ECECEC}
a {color: #000; text-decoration: none} a:hover {color: #001868}
.last-post a *, .web * {color: #4285F4 !important}
.male {color: #146AAE} .female {color: #CC6688}

.footer {color: #333}
.footer a {font-weight: bold; color: #333}

/* SIDEBAR */
.user_details .avatar img, .user_details .avatar {width: 75px;
height: 75px;
border-radius: 50px}
li.user_details a.nickname {padding: 0!important}
li.user_details {background: url(http://upload.forumfree.net/i/ff9767406/a_material_day/mobile/userbg.png)no-repeat;
height: 110px;
display: block;
width: auto !important;
padding-left: 16px!important; padding-top: 16px!important}
.sidebar {background-color: #FFF;
box-shadow: 0 0 4px rgba(0, 0, 0, .14), 0 4px 8px rgba(0, 0, 0, .28)}
.sidebar a {color: #212121}
.sidebar li {line-height: normal; color: #212121}
.side_title {background-color: #FFF;
color: #363636;
border-top: 1px #E0E0E0 solid;
padding-left: 16px}
#overlay {background-color: rgba(0, 0, 0, 0.2)}
li.user_details a.nickname {display: inline !important}
#left > ul {overflow:none}
.submenu > li {min-height: 38px!important; line-height: 28px!important; padding: 5px 5px 5px 12px!important; color: #212121!important}

/*Classe shadowed*/
.shadowed {box-shadow: 0 2px 5px rgba(0, 0, 0, 0.26)}

/*.submenu > li, .login > li, #ff_links, .search {border-bottom: 1px solid #DDD} */
#ff_links, .search {border-top: 0}
/* menu utente */
.menu > li {color: #999}
.menu .nickname {margin-top: 10px;
font-size: 18px;
color: #FFF !important}
.sidebar em {font-weight: bold; color: #FFF; background-color: #4285F4}
/* login */
.login input {color: #444; border: 1px solid #DDD}
.login input[type=submit] {background: #0085B2; color: #FFF; font-weight: bold} .login input[type=submit]:hover {background: #006789}
/* cerca */
.search {background-color: #FFF}
.search input {padding-left: 10px;
padding-right: 10px;
margin-top: 8px;
color: #212121!important;
font-weight: bold!important;
font-size: 12px!important;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
border-radius: 2px!important;
background: none!important}

/* NAV */
.menuwrap_bg {background-color: #4285F4}
.menuwrap em {background-color: #BCE8F1}
div.menuwrap_bg {height: 56px}
nav {height: 56px}
nav button {height: 56px}
#side_left_button span {background:url('http://image.forumfree.it/9/2/4/9/2/7/4/1423781510.png'); margin-top: 0 !important}
/* nome forum */
#nav-title span {color: #FFF; font-size: 18px; font-weight: normal}

/* HEADER, LOGO */
.header {background: #4285F4;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26)}
.logo {padding-top: 8px; background-position: center center; background-repeat: no-repeat; background-size: contain}

/* SEZIONI */
.list-group > *, .stats_bottom li, .u_info dl {background-color: #FFF; padding: 8px 16px 8px 16px}
.stats_list > li:last-child {border-bottom: 0}
.title {text-align: left;
font-weight: normal;
font-size: 14px;
background: #ECECEC;
margin-top: 7px;
top: -2px;
color: #999;
font-weight: normal;
font-family: "Helvetica"}

.web a {font-size: 19px; font-weight: bold} .forum .web a {font-size: 17px}

.list-group-item {box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.26); border-top: 1px solid #DDD}

/* mantenere "!important" per evitare problemi di visualizzazione */
.desc, .desc * {color: #777 !important}
.last-post {color: #888}
.board .last-post a, .board .last-post a * {font-size: 14px !important; font-weight: normal}
.forum .last-post {margin-top: 7px}
.board {box-shadow: none}
.topics, .replies, .views {font-size: 12px; color: #535353}
span.timeago {color: #999 !important} .topic .timeago {color: #666}
.no-time {font-style:italic; color: #999}
.popupago {text-align: center; background-color: #000; color: #FFF; border-radius: 5px}

/* sottosezioni */
.reserved-link {font-size: 13px; color: #333}

/* .on, .annuncio, .importante */
.on {border-left: 5px solid #4285F4}
.annuncio {background-color: #F7F3E1; border-top: 1px solid #FFF; border-bottom-color: #E2D9AE}
.importante {background-color: #EAF0FA; border-top: 1px solid #FFF; border-bottom-color: #C5D0E0}

/* SELEZIONE RIGA: Moderazione */
li.selected {background-color: #479CFC !important; border-bottom-color: #2684F0 !important} .selected *, .selected .web *, .selected .desc, .selected .desc *, .selected .last-post * {color: #FFF !important}

/* MESSENGER */
#mp-option label, #mp-delete {background-color: #FFF; color: #007299; font-weight: bold; font-size: 14px}
#mp-option label {border-right: 1px solid #DDD}

/* DISCUSSIONI, ARTICOLI */
.details a, .cancelled {font-size: 18px; font-weight: bold; color: #4285F4}
.cancelled {padding-left: 5px; font-weight: normal; color: #444}
.topic .group {color: #999; font-size: 13px}
.color {color: #3F3F3F; text-align: justify}
.color a {font-weight: bold; text-decoration: underline}
.edit {font-size: 10px; font-style: italic; color: #666}
.topic .option, .article .option {background-color: #EEE; border-top: 1px solid #CCC}
.topic .like {color: #666}
/* etichette, firma ffmobile*/
.tags, .ffmsign {font-size: smaller; font-style: italic}
.tags {margin-bottom: 0}
.tags a, .ffmsign a {text-decoration: none; font-weight: normal}
/* alert, info, success */
.alert {background-color: #F2DEDE; color: #B94A48; border-color: #EED3D7}
.info {background-color: #D9EDF7; color: #3A87AD; border-color: #BCE8F1}
.success {background-color: #DFF0D8; color: #468847; border-color: #D6E9C6}
.alert a, .info a, .success a {color: #3A87AD; text-decoration: none; font-weight: bold} .alert a {color: #B94A48} .success a {color: #468847}
/* allegati */
.attachment {text-align: center; position: relative}
.attachment > a {display: inline-block; padding: 7px}

/* popup moderazione post */
.topic .pop ul {background-color: #EEE; border: 1px solid #CCC; box-shadow: 0 0 5px rgba(0, 0, 0, .3)}
.topic .pop li, .pop #t_like {border-color: #CCC} .topic .pop li:last-child {border: 0}
.topic .pop a {font-size: 14px; color: #333}

/* ONLINE, OFFLINE, ANONIMO */
.online {background-color: #6FC400}
.offline {background-color: #E74C3C}
.anonimo {background-color: #BDC3C7}

/* SONDAGGIO */
.poll-bar {background-color: #D0E3ED; border-radius: 2px; color: #002C44}
.poll-bar div {background-color: #68BADD; border-radius: 2px 4px 4px 2px; color: #003A54}
.poll-max .poll-bar div {background-color: #088CC8}

/* PAGINAZIONE */
.pages, .nolink:hover {border: 1px solid #CCC; background-color: #FFF !important}
.pages li a {color: #666; font-size: 17px; box-shadow: 1px 0 0 #CCC, inset 1px 0 0 #CCC}
.pages li > a:first-child {box-shadow: -1px 0 0 #CCC}
.pages li a:hover {background-color: #EEE}

/* CITAZIONI, SPOILER e CODICI annidati */
.quote_top, .quote, .code_top, .code {margin: 10pt 0 0; border-left: 3px solid #6999B5}
.quote_top, .code_top {font-size: 11px; color: #518CAC; padding-left: 7px}
.code {font-family: 'Courier New', Sans-serif}
.quote_top a {padding: 0 10px; background: transparent url('http://img.forumfree.net/index_file/q.png') center no-repeat; text-decoration: none}
.quote, .code {padding: 5px 0 5px 10px; margin-top: 0; font-size: 9pt; line-height: 120%; color: #656565; text-align: justify}

/* PROFILO */
header.profile {padding: 15px 0; color: #FFF}
.profile .avatar {border-radius: 90px; border-width: 5px; margin-bottom: 20px; background-color: #FFF}
.u_nick {font-size: 25px; font-weight: bold; color: #FFF}
.u_group {font-size: 15px}
.u_stats > table td {border-left: 1px solid #DDD}

.profile .title, li.u_info, li.u_signature, li.u_friends {margin: 0 7px; border: 1px solid #CCC}
.profile .title {margin-top: 7px; padding: 3px 8px; font-weight: bold; border-bottom: 0}
.u_info dl {padding: 4px 7px} .u_info dl:last-child {border-bottom: 0}
/* miniature avatar amici */
.friend_avatar {border: 1px solid #8A8A8A; border-radius: 5px}
.friend_avatar img {border-radius: 5px}
.friend_nickname {background: #222; color: #FFF; font-size: 10px; line-height: 15px; text-align: center; border-radius: 0 0 3px 3px}

/* STATISTICHE */
.stats {text-align: center; color: #888; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26) !important}
.user_online a, .groups_list a {font-weight: bold}
.groups_list {padding: 10px 5px}
.stats_list {text-align: left} .stats_list > li {padding: 3px 10px; font-weight: bold}

/* INPUT e BOTTONI */
.codebuttons, .forminput, .textinput, #allegati input {font-size: 1em; margin: 3px; padding: 5px 8px; background-color: #F0F0F0; color: #222; border: 1px solid #CCC; border-radius: 3px}
/* mantenere separato il selettore per evitare problemi di visualizzazione */
#allegati input::-webkit-file-upload-button {font-size: 1em; margin: 3px; padding: 5px 8px; background-color: #F0F0F0; color: #222; border: 1px solid #CCC; border-radius: 3px}
.codebuttons:hover, #send-button:hover {background: #4285F4;
border-color: #4285F4;
color: #FFF}
.textinput {margin: 10px 0;
font-size: 18px;
background-color: transparent;
border: 1px #DDD solid;
border-radius: 0;
width: 100%}
/* bagliore azzurro */
.textinput:focus {outline: none}

#mod_options {color: #777; border: 1px solid #CCC; padding: 3px}
#send-button {background: #EEE; font-size: 15px; color: #444; font-weight: bold}

.buttons a {padding: 7px 0; color: #212121; font-weight: bold; font-size: 14px; text-transform: uppercase}
.buttons a:hover {background-color: rgba(0, 0, 0, 0.06)}

a.new-topic {color: #212121;
text-transform: uppercase;
background-color: transparent}
a.new-topic:hover {background-color: rgba(0, 0, 0, 0.06);
color: #212121}
a.reply {color: #4285F4}
a.delete {background-color: #C25554; color: #FFF}
a.delete:hover {background-color: #A53635}


over {background-color: #A53635}



/* ShoutBox */
.shoutbox .list-group {border-top: 1px #DDD solid}
.shoutbox .bottom {box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.26)}
.list-group {margin: 0!important}

/* Utenti Connessi */
li.user_online {border-top: 1px #DDD solid;
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.26)}

/* PULSANTE POLYMER */
.fab {position: absolute;
bottom: 10px;
right: 10px;
display: inline-block;
width: 46px;
height: 46px;
border-radius: 50%;
color: #FFF;
transition: box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1);
transition-delay: 0.2s;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26)}

.fab.all {background-color: #4285F4}

.fab.action {position: fixed;
bottom: 16px;
right: 16px;
background-color: #4285F4;
width: 56px !important;
height: 56px !important;
z-index: 9;
-webkit-transition: all .2s cubic-bezier(.4, 0, .2, 1);
transition: all .2s cubic-bezier(.4, 0, .2, 1)}

.fab.action:hover {background-color: #DB4437}

.fab.action img {-webkit-transition: all .2s cubic-bezier(.4, 0, .2, 1);
transition: all .2s cubic-bezier(.4, 0, .2, 1)}
.fab.action:hover img {-webkit-transform:rotate(180deg); -webkit-transition: all .2s cubic-bezier(.4, 0, .2, 1);
transition: all .2s cubic-bezier(.4, 0, .2, 1); opacity: 0}

.fab:active {box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2);
transition-delay: 0s}

.fab > img::shadow path {fill: #FFF}

/*WIP*/
.sub-fab {position: absolute;
display: inline-block;
overflow: hidden;
width: 56px;
height: 56px;
background: url(http://i.imgur.com/3BdewyA.png);
border-radius: 100%;
color: #FFF;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
transition: visibility .4s, opacity .4s, all .2s;
visibility: hidden;
opacity: 0;
background-repeat: no-repeat;
background-size: 80% 80%;
background-position: center;
-webkit-transform:rotate(-180deg)}

.fab.action:hover .sub-fab {visibility:visible; opacity: 1; z-index: 9; -webkit-transform:rotate(0deg)}

.sub-btn {position: absolute;
display: inline-block;
overflow: hidden;
height: 20px;
width: 20px;
border-radius: 100%;
bottom: 80px;
margin-left: 17px;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
background: #4285F4;
transition: visibility .4s, opacity .4s, all .2s;
-webkit-transition: visibility .4s, opacity .4s, all .2s;
-moz-transition: visibility .4s, opacity .4s, all .2s;
-o-transition: visibility .4s, opacity .4s, all .2s;
visibility: hidden;
opacity: 0;
background-repeat: no-repeat;
background-size: 70% 70%;
background-position: center}
.fab.action:hover .sub-btn {visibility: visible;
opacity: 1;
height: 40px;
width: 40px;
margin-left: 8px}

.fab-panel {position:fixed; margin: 0; padding: 0; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; background: #EEE; visibility:hidden; opacity: 0; transition:visibility .2s, opacity .2s; z-index: 8}
.fab.action:hover ~ .fab-panel {visibility:visible; opacity: 0.8}

.sub-txt {position: fixed;
margin: 0;
line-height: 15px; /*40 - 1(border) - 8*2(margin top e bottom) - 4*2(padding)*/
right: 80px;
background: #FFF;
border-radius: 3px;
color: #787878;
font-weight: bold;
box-shadow: 0 1px 1px rgba(0, 0, 0, .3);
border-top: solid 1px #EEE;
padding: 4px 8px;
margin: 8px 0;
text-align: right}

.sub-menu {position: absolute;
bottom: 0}
.fab.action:hover .sub-menu {bottom: 0; -webkit-transition: all 0.2s ease}

<link rel="import" href="http://www.polymer-project.org/components/paper-ripple/paper-ripple.html">
<link rel="import" href="http://www.polymer-project.org/components/core-icons/core-icons.html">
<link rel="import" href="http://www.polymer-project.org/components/font-roboto/roboto.html">



<div class="fab action">
<paper-ripple class="sub-fab" fit></paper-ripple>
<div class="sub-menu">

<a class="sub-btn" style="bottom:80px; background-image: url(http://i.imgur.com/sL3UF9J.png)">
<p class="sub-txt">Descrizione </p> </a>


<a class="sub-btn" style="bottom:140px; background-image: url(http://i.imgur.com/sL3UF9J.png)">
<p class="sub-txt">Descrizione </p> </a>



<a class="sub-btn" style="bottom:200px; background-image: url(http://i.imgur.com/sL3UF9J.png)">
<p class="sub-txt">Descrizione </p> </a>


<a class="sub-btn" style="bottom:200px; background-image: url(http://i.imgur.com/sL3UF9J.png)">
<p class="sub-txt">Descrizione </p> </a>

</div>
<img src="http://i.imgur.com/vYFSwan.png"><paper-ripple class="fab-button" fit></paper-ripple>
</div>
<div class="fab-panel"></div>

<script type="text/javascript">
function scrollFunction(){
if(document.body.scrollTop >= 82 ||
document.documentElement.scrollTop >= 82)
{
if(document.body.children[0].children[1].className.indexOf("shadowed") == -1)
document.body.children[0].children[1].className+='shadowed';
}
else
{
document.body.children[0].children[1].className=document.body.children[0].children[1].className.replace('shadowed','');
}
}

window.onscroll = scrollFunction;
</script>