@font-face {
  font-family: 'UTM Aptima';
  src: url('../fonts/UTMAptima.woff2') format('woff2'),
    url('../fonts/UTMAptima.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

.main-w {
  background: #323236;
  min-height: 500px;
  background-size: cover;
}
body {
  color: #fff;
  font-family: 'UTM Aptima';
}
.max-width {
  max-width: 720px;
}
h1,
h2 {
  font-size: 1.2rem;
  font-weight: bold;
  padding-top: 10px;
  padding-bottom: 10px;
}
p {
  line-height: 2;
  font-size: 1.1rem;
}
.max-width-800 {
  max-width: 900px;
  margin: 0 auto;
}
.max-width-800 img {
}
.img-float-right {
  float: right;
  margin-left: 20px;
  margin-bottom: 10px;
  margin-top: 15px;
  width: 100%;
  max-width: 400px;
  margin-right: -80px;
}
.text-justify {
  text-align: justify;
}
.mg-t-100 {
  font-weight: bold;
  background: #0000002e;
  /* z-index: 1111; */
  position: sticky;
  padding: 20px;
  border-radius: 5px;
  border: solid #333 1px;
  font-style: italic;
  margin-left: -82px;
  margin-right: -82px;
}

.text-giovanni {
  width: 50%;
  margin-top: -200px;
}
.text-align-right {
  text-align: right;
}
.text-align-center {
  text-align: center;
}
.h-0 {
  height: 0;
}
.first-letter-style{
  font-size: 25px;
  font-weight: bold;
}
.span-first-letter-style {
  font-size: 65px;
    color: red;
    font-weight: bold;
    float: left;
    padding-right: 5px;
    line-height: 50px;
}
@media (max-width: 768px) {
  .img-float-right {
    float: none;
    margin-left: 0;
    margin-bottom: 0;
    margin-top: 0;
    width: 100%;
    margin-right: -80px;
  }
  .mg-t-100{
    margin-left: 0;
    margin-right: 0;
  }
  .fix-thumnail img {
    text-align: center;
  }
}