body {font-family: 'Open Sans', sans-serif; margin: 0; padding: 0 3px;}
div, input{-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; margin: auto; }
@font-face {
font-family: 'photograph_signatureregular';
    src: url('css/fonts/photograph-webfont.woff2') format('woff2'),
         url('css/fonts/photograph-webfont.woff') format('woff');
}

.wrapper { width: 100%;    margin: 0 auto;}
h2 { text-align: left;}
h1, h2, h3 {
    text-shadow: 2px 2px 2px rgba(150, 150, 150, 1);
}
.upload {width: 30px; height: 30px;  background: url(../img/upload.png) no-repeat center center; cursor: pointer; background-size: contain; margin: auto;}

.addsm {
    height: 24px;
    width: 24px;
    background: url(../img/addsmenu.png) no-repeat center center;
    cursor: pointer;
    background-size: contain;
}
.tblsubmenu {width: 100%;}
.tblsubmenu tr{border-bottom: 2px solid rgb(175, 178, 187); cursor: pointer;}
input.autoupdate{width: 98%;}

    .sezioneheader { text-align:left; font-size:24px; color: #000000; margin: 0 0 0 10px; 
background: #FFFFFF;
text-shadow: 1px 0px 1px #CCCCCC, 0px 1px 1px #EEEEEE, 2px 1px 1px #CCCCCC, 1px 2px 1px #EEEEEE, 3px 2px 1px #CCCCCC, 2px 3px 1px #EEEEEE, 4px 3px 1px #CCCCCC, 3px 4px 1px #EEEEEE, 5px 4px 1px #CCCCCC, 4px 5px 1px #EEEEEE, 6px 5px 1px #CCCCCC, 5px 6px 1px #EEEEEE, 7px 6px 1px #CCCCCC;}
img.avatlist { width: 100px; height: 100px;  border-radius: 50%;} 
.usereri {width: 350px; background: #f1f1f1; -webkit-border-radius: 20px; float: left; cursor: pointer;
-moz-border-radius: 20px;
border-radius: 20px; margin: 10px 10px 0 0;}
table.tbluser { margin: 0 0 auto 0;}
table.tbluser td{width: 100px; padding-left: 5px; }
table.tbluser th{padding-left: 5px; font-size: 16px; text-align: left; }

.fotoprev {
    width: 80px;
    margin: auto;
    text-align: center;
    cursor: pointer;
    border: 2px inset gray;
}
.readonly { background: #efefef;}
.uname {text-align: center; color: crimson; font-weight: bold; }

.sezione {width:280px; margin:4px auto; border: 1px solid black; float: left;}
.sezione th{color: #0071c1;padding: 2px 6px; font-size: 13px;  background: #f0f0f18a;}
.sezione td {font-weight: normal; font-size: 100%;}
.sezione td.primo {font-weight: bold; }
.sezione td.primo::before {   content: '*';}
.sezione th span {float: right; color: crimson;}
.eti { width: 99%; background: lavender; border-radius: 8px; cursor: move; margin: 6px auto;}
.eti td{ text-align: left; font-size: 12px; padding: 2px 0 2px 6px;}
.dragarea {height: 50px; border: 1px dotted grey; background: #43e9ac2b; line-height: 45px; font-style: italic; }
.noval {   background: url(../img/document_blank.png) no-repeat center center;
    margin: auto;
    width: 40px;
    height: 40px;
    cursor: pointer;
    background-size: contain;
}
.pdf {   background: url(../img/pdf-icon.png) no-repeat center center;
    margin: auto;
    width: 30px;
    height: 30px;
    cursor: pointer;
    background-size: contain;
}
.euro {   background: url(../img/euro1.png) no-repeat center center;
    margin: auto;
    width: 20px;
    height: 20px;
    cursor: pointer;
    background-size: contain;
}

.draggable {margin: auto;}
.primo { font-weight: bold;}
.primo::before {   content: '*';}

.wrap-collabsible {position: relative;}
input.toggle[type='checkbox'], input.atoggle[type='checkbox'] {
  display: none;
}
.accordion-wrapper {margin: 20px auto;   font-weight: bold; font-size: 110%;    color: #15AF96;    text-align: center;
    border-top: 3px solid #15AF96; border-bottom: 3px solid #15AF96; padding: 5px;}
.acclbl-toggle {display: block; font-weight: bold; font-size: 1.2rem;
text-transform: uppercase; text-align: center; padding: 6px; cursor: pointer; border-radius: 7px; transition: all 0.25s ease-out;}

.acclbl-toggle:hover {  background: #e8e8e8;}

.acclbl-toggle::before {
  content: ' ';
  display: inline-block;
border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 5px solid currentColor;

  vertical-align: middle;
  margin-right: .7rem;
  transform: translateY(-2px);

  transition: transform .2s ease-out;
}
.atoggle:checked + .acclbl-toggle::before {
  transform: rotate(90deg) translateX(-3px);
}

.atoggle:checked + .acclbl-toggle {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
   background: #e8e8e8;
}

.lbl-toggle {float: right;cursor: pointer; width: 38px; height: 36px; background: url(../img/settings.png) center bottom no-repeat; background-size: 30px; transition: all 0.55s ease-out;}
/*.toggle:checked + .lbl-toggle{ border: 1px solid gray;  border-top: none;}*/
.collapsible-content {  max-height: 0px;  overflow: hidden;  background: white;position: absolute; bottom: 0; right: 0; width: 40px;
  transition: max-height .25s ease-in-out;
}
.toggle:checked + .lbl-toggle + .collapsible-content {
  max-height: 100%; border: 1px solid gray; 
  /*border-bottom: none;*/
}
.presume th{ padding: 0 4px; font-size: 85%;}
.presume { margin: 5px auto;}
.percbar {width: 80px; border: 1px solid gray; height: 18px; line-height: 18px; font-size: 11px; font-weight: bold;}
.percfatti { float: left; height: 100%; border-right:1px solid gray;  background: lime; line-height: 18px; font-size: 11px;}

.accordion-content {  max-height: 0px;  overflow: hidden;  background: white; 
  transition: max-height .25s ease-in-out;
  color: black; overflow: auto;
}
.atoggle:checked + .acclbl-toggle + .accordion-content {
  max-height: 100%;  padding: 15px 5px; 
}

.loading {position: absolute; top: 0; width: 100%; height: 100%; z-index: 10; background: white url(../img/loading.gif) no-repeat center center;  z-index: 20; display: none;}
.modaldiv {position: absolute; top: 0; width: 100%; height: 100%; z-index: 10; background-color: rgba(0, 0, 0, 0.73);}
.divhead{background: white; width: 100%; padding: 10px; text-align: center; font-size: 20px; color: crimson; font-weight: bold;}
.nascosto {display: none;}
table { border-collapse: collapse;    margin: auto; }
.mainh1 { margin: 20px auto;  font-family: 'photograph_signatureregular'; font-size: 500%; text-align: center; color: #00546d;}
.mainh2 {  margin: -80px auto 0 auto; font-family: 'photograph_signatureregular'; font-size: 300%; text-align: center;}
.centered { width: 80%; text-align: center; margin: auto;}
.centeredmodulo { max-width: 320px; text-align: center; margin: auto;}
.centerdiv { margin: 15px;    cursor: pointer;    display: inline-block; }
.commenti { margin:20px auto; text-align: justify; color: gray; font-size: 22px; color: #00546d;}
.evidence { color: black; margin-top: 5px; font-weight: bold;}
.linespacer {vertical-align: middle; margin: 30px auto;}
.newshead { font-weight: bold; color: #003342;}
.navigate { cursor: pointer;}
.newsdetts { font-size: 80%;}
.updown {
    height: 18px;
    width: 18px;
    background: url(../img/updown.png) no-repeat center center;
    cursor: move;
    background-size: 16px 16px;
    padding-right: 5px;
}
.updown tr{ cursor: move; }
.deldiv:hover {
    margin: auto;
    width: 16px;
    height: 20px;
    background:url(img/dele_on.png) no-repeat center center;
    background-size: contain;
}

 .whitetblform td, .whitetblform th { text-align: left; white-space: nowrap; padding: 5px 10px 0 0;}    
 .cv {text-align: left;}
 .carica {font-weight: bold;}  
 a { color: brown; font-weight: bolder; text-decoration: none;}
 a:hover {color: crimson;}
 .compenso { margin: auto;}
  .compenso th{ text-align: left; background: #a3a2a21c; padding: 2px 5px; border-bottom: 1px solid gray;}
  .compenso td{ text-align: right; padding: 2px 5px; border-bottom: 1px solid gray;}
   .bpopable{ display:none;-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px; background: white;
    padding: 30px; }
 
 .waiting {width:25px;height: 25px;background: url(../img/waiting.png) no-repeat center center; cursor: pointer; background-size: contain;}  
.delete, .deleteline{padding: 3px; width:18px;height: 18px;background: url(../img/ico_del_off.png) no-repeat center center; cursor: pointer;}
.delete:hover, .deleteline:hover{background: url(../img/ico_del_on.png) no-repeat center center;}
.edit {background: url(../img/ico_edit_off.png) no-repeat center center;  height: 18px; width: 18px; cursor: pointer; }
.edit:hover {background: url(../img/ico_edit_on.png) no-repeat center center;  height: 18px; width: 18px; cursor: pointer;}
.pagato {background: url(../img/pagato.png) no-repeat center center;  height: 25px; width: 25px; cursor: pointer; background-size: contain;}
.dettagli {background: url(../img/dettagli.png) no-repeat center center;  height: 25px; width: 25px; cursor: pointer; background-size: contain;}
.add {
    margin: auto;
    width: 16px;
    height: 20px;
    background:url(../img/add.png) no-repeat center center;
    background-size: contain;
    cursor: pointer;
}

table.scheda1 {margin: 20px auto; min-width: 230px;}
table.scheda1 th{ color: #0071c1; text-align: left; padding: 2px 6px; font-size: 13px; background: #f0f0f18a; border-bottom: 1px solid black;}
table.scheda1.thcentered th { text-align: center;}
table.scheda1 td {font-size: 12px; text-align: left; border-bottom: 1px solid black; padding: 2px 4px;}

.deldiv {
    margin: auto;
    width: 16px;
    height: 20px;
    background: url(img/dele_off.png) no-repeat center center;
    background-size: contain;
}
.deldiv .absoluteicon, .absoluteicon {position: absolute; top: 10px; right: 10px; z-index: 10;}

.notafull {background: url(../img/full.png) no-repeat center center;  margin: auto; width: 25px; height: 20px; cursor:pointer; background-size: contain;}
.notaempty {background: url(../img/blank.png) no-repeat center center;  margin: auto; width: 25px; height: 20px; cursor:pointer; background-size: contain;}
.movefolder {
    margin: auto;
    width: 36px;
    height: 36px;
    background:url(../img/movefolder.png) no-repeat center center;
    background-size: contain;
    cursor: pointer;
}
.footer { background: black; width: 100%; text-align: center; padding: 20px 0; position: fixed;
    bottom: 0;}
.social-icons {
    margin: 0 auto;
}
.social-icons td {
    width: 60px;
    height: 60px;
}
.sicon {
    float: left;
    position: relative;
    width: 60px;
    height: 60px;
    margin: 10px;
    padding: 0;
    background: none;
}
.sicon a {
    display: block;
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
    border-radius: 10px;
    background-color: #fff;
    background-size: 70%;
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
}
.icon__name {
    position: absolute;
    top: 50%; left: 0;
    width: 100%;
    margin-top: -7px;
    color: #fff;
    font-size: 13px;
    text-align: center;
    -webkit-transition: all .3s ease-out;
    transition: all .3s ease-out;
    opacity: 0;
    -webkit-filter: blur(25px);
    filter: blur(25px);
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    will-change: transform;
}
.icon--facebook a {
    background-color: #3b5998;
    background-image: url(../img/facebook-128.png);
    background-size: 70%;
}
.icon--twitter a {
    background-color: #00aced;
    background-image: url(../img/twitter-128.png);
    background-size: 70%;
}
.icon--instagram a {
    background-color: #5c3d2e;
    background-image: url(../img/instagram-128.png);
    background-size: 70%;
}
.icon--youtube a {
    background-color: #c9317d;
    background-image: url(../img/youtube_v2-128.png);
    background-size: 70%;
}
.icon--spotify a {
    background-color: #80b719;
    background-image: url(../img/spotify-128.png);
    background-size: 70%;
}
.sicon a:hover {
    background-color: #222;
    background-size: 0%;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
}
.sicon:hover .icon__name {
  -webkit-transition: all .3s ease-out;
  transition: all .3s ease-out;
  opacity: 1;
  -webkit-filter: blur(0);
          filter: blur(0);
}

.fsett {
    width: 95%;
    margin: 10px auto; padding: 10px;
    border: 1px solid #92a0a9;
    color: #090f40;
}
.fsett legend {
    font-weight: bold;
    font-size: 15px;
    color: #133a96;
    padding: 0 5px;
    text-align: left;
}
.error { border: 1px solid red;}
.mybtn {
    margin:auto;
    font-size: 12px;
    line-height: 20px;
    text-align: center;
    color: black;
    cursor: pointer;
    font-weight: bold;
    background: url(img/btnbk.jpg) repeat-x left top;
    border: 1px solid gray;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.mybtn:hover {
    background: url(img/btnbk_h.jpg) repeat-x left top;
}

.flatbtn {
    background-color: #516d9a;
    color: white;
    padding: 4px 8px;
    cursor: pointer;
    font-weight: bold;
    text-align: center;
    border-radius: 5px;
    letter-spacing: 1px;
    display: table;
    margin: 10px auto 5px auto;
    display: block;
}
.flatbtn:hover {
    background-color: #8e9fbb;
}

.album {
    background: url(img/album.png) no-repeat center center;
    width: 260px;
    height: 260px;
    background-size: contain;
    position: relative;
}
.albumprev {
    width: 183px;
    height: 171px;
    position: absolute;
    top: 12%;
    left: 15%;
}
.albumtitle {
    width: 200px;
    height: 30px;
    position: absolute;
    bottom: 25px;
    left: 12%;
    font-weight: bold;
    color: #047071;
    font-size: 12px;
    text-align: center;
    text-shadow: 1px 1px 2px rgba(150, 150, 150, 1);
}
.mediabox {
    float: left;
    padding: 10px 20px;
    font-size: 13px;
    position: relative;
}
.mediadiv, .ytframe {
    position: relative;
    width: 100px;
    height: 100px;
    margin: 5px 0;
    background-size: cover;
    -webkit-box-shadow: 5px 5px 10px 0px rgba(50, 50, 48, 0.53);
    -moz-box-shadow: 5px 5px 10px 0px rgba(50, 50, 48, 0.53);
    box-shadow: 5px 5px 10px 0px rgba(50, 50, 48, 0.53);
}

.ytframe {
    width: 330px;
    height: 200px;
}

.mediatext {
    position: absolute; color: darkblue;    width: 150%;  left: -25px;  bottom: -20px;   text-align: center;   font-size: 11px;
}

.composer {
    padding: 5px 0 3px 30px;
    font-weight: bold;
    color: #ca4848;
    text-align: left;
    font-size: 18px;
    text-shadow: 1px 1px 2px rgba(150, 150, 150, 1);
}
.brani { padding: 0 0 3px 60px; font-style: italic; font-size: 15px; text-align: left; color: #003c69;}
.specialleft { text-align: left; max-width: 500px;margin: auto; }
#logoimg{ width: 120px;}
@media (min-width: 1200px) {

	/* Structure > 1200px */
 
	#wrapper 		{width: 100%;margin: 0 auto;}
 .logo_link {
    position: absolute; left: 10px; top: 10px;
}
#menudiv{ height: auto;}
    #logoimg{ width: 260px;}
.smallmodule{ width: 400px;}
    .flexslidere {min-height: 440px;}
    .icon-h { height: 35px; width: auto; }
    .search ul li a{font-size: 1.6em;}
    .search .sb-icon-search {font-size: 1em;}
    .social-icons{    width: 60px;    height: 60px;}

}
@media (min-width: 768px) and (max-width: 980px) {

	/* Structure 768 to 1000 */
  #wrapper 		{width: 100%;margin: 0 auto;}
.centered, .centeredmodulo { width: 95%;}
.commenti { font-size: 18px;}
#logoimg{ width: 120px;}
 .mainh1 { margin: 30px auto ;}
    .smallmodule{ width: 400px;}
	  .icon-h { height: 25px; width: auto; }
      .profileimg {width: 50%} 
  .search ul li a,.search .sb-icon-search {font-size: 1.4em;}
  .social-icons, .sicon{    width: 40px;    height: 40px;}
  .icon__name {font-size: 12px;}
}


@media (max-width: 767px) {
/* Structure  < 767 */
	body{padding:2px; }
    .logo_link { position: absolute; right: 10px;}
    #logoimg{ width: 120px;}
    #wrapper {width: 100%;margin: 0 auto;}
.centered, .centeredmodulo { width: 100%; padding: 0 5px;}
.commenti { font-size: 14px;}
   .mainh1 { margin: 40px auto 0 auto; font-size: 200%;}
   #menudiv{ height: 1px;}
    #contentfull 		{width: 100%;float:left;}
	  .icon-h { height: 18px; width: auto; }
	/* Header */
	.btn-responsive-menu{display:block;}
	/* Sidebar */
    .smallmodule{ width: 100%;}
          table.tbluser { width: 100%; }
      table.tbluser td{width: 80px; padding-left: 5px; }
   .usereri { float: none; width: 95%; margin: 10px auto 0 auto;}
   img.avatlist { width: 80px; height: 80px;  border-radius: 50%;}
	.widget:first-child{margin-right:4%;!important}
	.profileimg {width: 50%}
    .pagefotoimg {width: 100%}
	#site-title a {font-size:25px;margin-left:10px;}
	#footer p     {margin-left:10px;}
    .search ul li a,.search .sb-icon-search {font-size: 1em;}
        .social-icons,.sicon  {    width: 30px;    height: 30px;}
        .icon__name {font-size: 10px;}
.ytframe {width: 250px;  height: 150px}
    .mediabox {float:left; padding: 10px; font-size: 11px;}
    #videolist .mediabox { float:none}
    .pagetitle { font-size: 18px;}
    .brani { padding: 0 0 3px 10px; font-style: italic; font-size: 11px; text-align: left;}
    .composer {font-size: 15px;  }
 #wrapper,#wrapperpage,#centerdiv,#main,#content,#contentfull,#sidebar, #footer	{-moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;}
  .footer {padding: 8px 0; position: fixed;
    bottom: 0;}
.newshead { font-size: 80%;}
}

@media (max-width: 480px) {
	  .icon-h { height: 16px; width: auto; }
      .specialleft { width: 100%;margin: auto; padding: 0 6px; zoom:87%;}
            table.tbluser { width: 100%; }
      table.tbluser td{width: 80px; padding-left: 5px; }
   .usereri { float: none; width: 95%; margin: 10px auto 0 auto;}
   img.avatlist { width: 80px; height: 80px;  border-radius: 50%;}
}