/* -------- main part -------- */
body {
  background-color: white;
/*  background-color: #326598; */
/*  color: black; */
  font-family: 'Bodoni Moda';
/*  font-size: 18px; */
  }
h2 {
  text-align: center;
}
h4 {
  text-align: center;
  margin-top: 0px;
  margin-bottom: 0px;
}
b strong {
  font-weight: 800;
}

a { 
  text-decoration: none;
  outline-color: red;
  outline-width: 2px;
}
/* aggiunto outline per accessibilità */

a[href^="http://"]:not([href*="http://civis.g4a.it"]):after,
a[href^="https://"]:not([href*="https://civis.g4a.it"]):after, 
a[href^="//"]:not([href*="//civis.g4a.it"]):after {
 content: " " url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAIpJREFUeNqEkIEJwCAMBGPpEs7hHK6hY+gauoZr6Bo6RtqEWkxb6EMQnuM/USEirIoxSmOKwDkhBEwp4VPkb4801Xun9xW4e+9FldYarLUvkBPPOp4JGWOgtSaSt6VWQKUU9nPOEiSIgAmNMdadFTjn7utqrXwh6fLvH9nXhamW5ksMnpfDnw4BBgBfunO056MmqAAAAABJRU5ErkJggg==);
}

/*
a[href^="http"]:after {
     content: " " url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAVklEQVR4Xn3PgQkAMQhDUXfqTu7kTtkpd5RA8AInfArtQ2iRXFWT2QedAfttj2FsPIOE1eCOlEuoWWjgzYaB/IkeGOrxXhqB+uA9Bfcm0lAZuh+YIeAD+cAqSz4kCMUAAAAASUVORK5CYII=);
}
*/
a:link {
  color: #009966;
}
/* visited link */
a:visited {
  color: #009966;
}
/* mouse over link */
a:hover {
  color: #00aaee;
}
/* selected link */
a:active {
  color: #009966;
  outline-color: red;
  outline-width: 3px;
}

hr {
/*  border-top: 1px solid #326598; */
  border-bottom: 0px dotted #bbb;
  margin-left: 0px;
  margin-right: 0px;
  padding-left: 0px;
  padding-right: 0px;
}

button {
  background-color: #101010;
  width: 95%;
  margin-top: 24px;
  margin-left: 2.5%;
  margin-right: 2.5%;
  border: none;
  color: white;
  padding: 10px 30px;
  font-family: "Bodoni Moda";
  cursor: pointer; 
  font-size: 20px; 
  outline-color: red;
  outline-width: 3px;
}

/* dark background on mouse-over */
button:hover {
  background-color: #FFC800;
}

button:active {
  outline-color: red;
  outline-width: 3px;
}

/* -------- definition list -------- */
  dl {
    display: flex;
    flex-flow: row wrap;
/*    border: solid #333;
    border-width: 1px 1px 0 0; */
    width: 85%;
    margin-left: auto;
    margin-right: auto;
    border-top: 1px solid black !important; 
  }
 dl.sub {
    width: 100%;
    padding-top: 0px;
    padding-bottom: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
  }
  dt {
    flex-basis: 20%;
/*    padding: 2px 4px; */ /* originale */
  margin: 1px;
/*  background-color: #003366; */
  background-color: #101010;
  padding: 4px;
    text-align: right;
    color: white;
  }
  dt.sub {
    flex-basis: 20%;
  margin: 1px;
/* -  background-color: #003366; - */
  background-color: #101010;
  color: white;
  padding: 4px;
    color: #fff;  
  text-align: left;
  }
  dd {
    flex-basis: 70%;
    flex-grow: 1;
    margin: 1px;
    padding: 2px 4px;
/* -   background-color: #5083b6; - */
/*    background-color: #efefef; */
    border-bottom: 1px solid black; 
  }
 /* dd:first-of-type {
      border-top: 1px solid black !important; 
  } */
  dd::after {  /* clears proceeding dt(s) ensuring that the next dd will be after next dt */
    content: "";
    display: table;
    clear: left;
  } 
/* -------- table -------- */
table {
  width: 95%;
  margin-left: auto;
  margin-right: auto;
  border-collapse: collapse;
}
table.stretta {
  width: 33%;
  margin-left: auto;
  margin-right: auto;
}

ul.stretta {
  width: 50%;
  margin-left: auto;
  margin-right: auto;
  text-align: left;
}

/* compressione tabella su cellulare */
@media screen and (max-width: 480px) { 
	.wtabr {
  		transform:matrix(0.70, 0.0, 0.0, 0.95, -75, -25) !important;
  		width: 100%;
  /*  		display: flex; */
	}
  /*          matrix(scaleX(), skewY(), skewX(), scaleY(), translateX(), translateY()) */
  .wtabr img {
    transform:matrix(1.44, 0.0, 0.0, 1, -5, 0) !important;
  }
}


tr {
/*  background-color: #efefef; */
/*  background-color: #5083b6; */
border-bottom: 1px solid;
}
th {
  background-color: #101010; 
/*  background-color: #003366; */
/* vvv color added */
  color: #ffffff;
  padding: 4px;
}
td {
  padding: 4px;
/* vvv color added */
  color: #050505;
}
/* -------- custom testi -------- */
.titolodiv {
/*  background-color: #003366; */
  background-color: #101010;
  width: 100%;
  text-align: center;
  padding: 0.6%;
  margin-right: 0px;
  margin-left: 0px;
  margin-top: 0px;
}
.titolodivsch {
/*  background-color: #003366; */
  background-color: #101010;
  width: 100%;
  text-align: center;
  padding: 0.6%;
  margin-right: 0px;
  margin-left: 0px;
  margin-top: -40px;
}
.titolo {
/*  color: #639C00; */
  color: white;
  font-weight: bold;
  font-size: 125%;
  margin-top: 10px;
}
.titolodiv p {
/*  margin-top: 1.5%; */
  margin-top: 30px;
}
.titolo_principale { /* cambiare in scheda principale */
/*  color: #639C00; */
  color: white;
  font-weight: bold;
  line-height: 120%;
  padding-top: 8px;
  font-size: 150%;
  margin-top: 10px;
  margin-bottom: 5px;
}
.dataril {
/*  color: #5083b6; */
/*  color: #eae000; */
/*      color: #eaeaea;    */
/*  font-size: 80%; */
  color: white;
  padding-bottom: 0px;
  margin-bottom: 0px;
}
.aggregato {
  width: 100%;
  text-align: center;
}
dd.sect {
  flex-basis: 70%;
  flex-grow: 1;
  margin: 1px;
  padding: 2px 4px;
  /* background-color: #003366; */
  background-color: #101010;
  color: white;
  /*    border-bottom: 1px solid #333; */
}
.wide { width: 100%; }
.wideshut {
  width: 100%;
  display: none;
}
.wh { color: white; }
/* -------- custom immagini -------- */
img.ridotta {
  max-width: 100%;
}
.schemar {
  display: block;
  margin-top: 2%;
/*  margin-bottom: 2%; */
  margin-left: auto;
  margin-right: auto;
  max-width: 100%;
/*  border-style: groove;
  border-width: 3px; */
/*  border-color: #002856; */
/*  background-color: #8098AF; */
  background-color: #efefef;
}
p.schemart {
  text-align: center;
  font-size: 90%;
}
.schema_container {
  display: block;
  margin-top: 2%;
  margin-bottom: 2%;
  margin-left: auto;
  margin-right: auto;
}
.schema_elemento {
  float:left;
  max-width: 100%;
/*  border-style: groove;
  border-width: 3px; */
  margin: 2.5px;
  background-color: #efefef;
}
/* -------- floating photos -------- */

@media (max-width: 480px) {
.fotox {
/*  float: left; */
  display: block;
  width: auto;
  margin-left: auto;
  margin-right: auto;
  margin-top: 25px;
/*  margin-bottom: 15px; */
  padding: 10px;
  min-height: 250;
/*  border: 1px solid black; */
  text-align: center;
	}
}
@media (min-width: 480px) {
.fotox {
  float: left;
/*  width: 480px; */
  display: block;
/*  margin: 15px 15px 15px 20px; */
  margin-left: auto;
  margin-right: auto;
  margin-top: 25px;
/*  margin-bottom: 15px; */
  padding: 15px;
/*  border: 1px solid black; */
  text-align: center;
  min-height: 400px;
	}
}

.fotox img {
  max-width: 320px;
  max-height: 320px;
}

.caption {
  padding-top: 2px;
  display: block;
  max-width: 320px;
  font-size: 80%;
}
.nota {
    width: 100%;
    text-align: center;
    font-size: 85%;
}
.clearfix::after {
  content: "";
  clear: both;
  display: table;
}
.clearfloat { clear: both; }
.subz {
  font-size: 150%;
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-top: 5px;
  margin-bottom: 5px;
  padding: 15px;
}
/* -------- custom pannello dettaglio -------- */
.dettaglio {
/*  background-color: white; */
  background-color: #fefefe;
  text-align: center;
  width: 5%;
}
td.dettaglio:hover {
  background-color: #d9d7d7 !important; 
}
td.dettaglio:visited {
  background-color: #eee !important;
}
img.dettaglio {
  margin-left: auto;
  margin-right: auto;
}

/* --------- tooltip ------------------ */
h2.ulx {
  margin-bottom: -15px;
}
h4.ulx {
  font-weight: bold;
  font-size: 120%;
  margin-bottom: -15px;
}
h2.ulx::after {
/*	border-bottom: 1px dotted grey; */
content: " ☜";
}
h2.ulx:hover {
	color: #009966;
}
.tooltip {
  position: relative;
/*  display: inline-block; */
/*  border-bottom: 1px dotted black; */
margin-bottom; 0px;
}
.tooltip .tooltiptext {
  visibility: hidden;
/*  width: 240px; */
  background-color: #555;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 8px;
/*  position: absolute; */
  z-index: 1;
/*  bottom: 125%; */
  opacity: 0;
  transition: opacity 0.3s;
}
.tooltip .tooltiptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}
a.tooltip {
	color: aquamarine;
}
.tooltip:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
}
/* ---- markdown tendina ------ */

.mdheader {
        margin-left: 5%;
}
.mdheader img {max-width: 90%;}

.button_grp {
	margin-left: auto;
	margin-right: auto;
}

/* ------- footer ------- */
.footer1 {
  width: 100%;
  background-color: #222;
  margin-bottom: 0px;
  padding-bottom: 0px;
}
.contlogoge {
  display: inline-block;
  margin-left: 2%;
}
.flageu {
  height: 68px;
  padding-left: 12px;
  padding-right: 12px;
}
.contlogoge {
  display: inline-block;
  margin-left: 2%;
}
.logocom {
  height: 68px;
}
.descrcomge {
  display: inline-block;
  color: white;
  font-size: 1.4vh;
  padding-left: 8px;
}
.linkasit {
  text-decoration: none;
  color: white;
}
.contlogounesco {
  display: inline-block;
  margin-left: 2%;
}
.logounesco {
  display: block;
  height: 100px;
  transform: translate(0, 28%);
}
.descrunesco {
  display: inline-block;
  color: white;
  font-size: 1.4vh;
  padding-left: 8px;
}
.concharta {
  display: inline-block;
  color: white;
  margin-left: 2%;
}
.attribcharta {
  font-size: 1.4vh;
}
.logocharta {
  width: 75px;
  margin-bottom: 4px;
}
.nocookie {
  color: white;
  font-size: 80%;
  text-align: center;
  padding-bottom: 6px;
}
a.Openbtb {
	height: 100%;
	valign: middle;
}
