@import url('https://fonts.googleapis.com/css2?family=Lexend+Deca:wght@300;400;600&display=swap');



html {
  margin: 0px;
  padding: 0px;
}


body {
font-family: 'Open Sans', sans-serif;
  
    color: #000033;
  overflow-x: hidden;
  padding: 0px 30% 0px 30%;
  margin:  2% 0% 0px 0%;

}

.bio{
  opacity:0.8;
  display: block;
  margin-left: 0;
  margin-right: auto;
  margin-top:10px;
  width: 50%;
}

.foto {
  width: 100%;
}

.main {
  margin-bottom: 100px;
}



h1 {
  
    line-height: 37px;
  text-align: left;
  letter-spacing: 0px;
  text-transform: lowercase;
  margin-bottom: 0px;
font-weight: 600;
}

.external-link{
 text-decoration:underline
}

#title{
  margin-top:30px;
   line-height:20px;
  font-size: 14px;
  font-weight:600;
  text-transform:lowercase;
  text-overflow: ellipsis
}

.linea{
  position:relative;
  margin-top:-50px;
  margin-bottom:40px;
  font-size:8px;
  font-weight:200;
 width:101%;
  white-space: nowrap;
  overflow: hidden;
 
}

#linea1{
 opacity:0;
}

#linea2{
  margin-top:300px;
 margin-bottom:0px;
 line-height:5px;
 opacity:0.5
}

#copyright{
 opacity:0.8;
  font-size: 10px;
  font-weight: 300;

margin-bottom:15px;

 text-transform:uppercase
}

h2 {
   font-size: 12px;
  font-weight: 300;
  text-align:left;
  padding-left: 0px;
  padding-right: 0px;
  letter-spacing: 0px;
 
}

#back {

  font-size: 12px;
  font-weight: 300;
  text-align:left;
margin-bottom:20px;
 cursor:pointer;
}

.italic{
font-style:italic;

}

h3 {
  
 font-weight: 300;
  font-size: 12px;
  line-height: 37px;
  text-align: left;

     text-transform: lowercase;
  margin-top: 40px;
  margin-bottom: 0px;
 
}

.description{
  font-size: 12px;
  text-align:left
}

.des0{
    font-size: 14px;
  font-weight:400;
  text-transform:uppercase;
  margin-bottom:0px;
  margin-top:10px;
  
}

.des1{
  font-size: 12px;
  margin-top:0px;
   margin-bottom:30px
}

.des2{
  font-size: 12px;
  margin-top:0px;
   margin-bottom:30px
}

.linkpage{
  float:left;
  margin-right:16px;
  margin-top:0px;
    margin-bottom:0px;
}

.active{
  font-weight: 600;
}

.sel{
  font-weight: 400;
}

.menu{
  margin-bottom: 20px;
}



.work{
  margin-left:6px;
  margin-top:0px;
    margin-bottom:0px;
height:28px;
  text-transform:capitalize;
   cursor:pointer;
 padding:0px;
}

#summary{

  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  grid-auto-rows: minmax(100px, auto);
}

.preview{
  margin-bottom:60px;
  cursor:pointer;
}

.preview:hover{
 opacity:0.7
}

.previewImg{
  width:100%
}
.previewTitle{
  text-align:center;
  line-height:unset;
 margin-top:0px;
  text-transform:capitalize;
  font-size:11px;
}

.year-group{
    margin-top:18px;
  margin-bottom:-10px;
}

#works{
  margin-top:110px;
  margin-bottom:110px;
  display:none;

}


.title {
  margin: 5px 0px 0px 0px;
  text-transform: uppercase;
  
    
}

.quote{
  margin-top:30px;
  margin-bottom:30px;
   
  font-weight: 400;
  font-size:20px;
  text-transform:uppercase;
  text-align:left;
   padding-left: 20px;
   padding-right: 20px;
  
  
}




.legendBox{

  width:80%;
  margin-left:10%;
   
  margin-top:80px;
}

.legend{
  width:50%;
  float:left;

}

.legend > img{

  width:45px;
  margin-bottom:15px;
    margin-top:0px;
}

.info {
  margin-top: 13px;
  line-height: 17px;
 font-size: 12px;
}

.aboutText {

   
  margin-top: 120px;
  margin-bottom: 30px;
  font-size: 12px !important;
  font-weight:100;
 margin-left:0px;
  margin-right:150px;;
}

#exhibition{
  font-size: 12px; 
}

a {
  text-decoration: none;
     color: #000033;
  cursor: pointer;
}

.contact {
  font-size: 15px;
  margin: 0px;
  margin-top: 8px;
 font-weight:300;
  padding: 0px;
}

#ig {
  margin-bottom: 60px;
}


.video{
  width:100%;
 background-color:#000;
}

#video-videoAltro{
  height:310px;
  background-color:#000;
}

@media only screen and (min-width: 1100px) and (max-width: 1650px) {
  body {
    padding: 0px 20% 0px 20%;
  }
}

@media only screen and (min-width: 700px) and (max-width: 1100px) {
  body {
    padding: 0px 20% 0px 20%;
  }
}

@media only screen and (max-width: 700px) {

  .aboutText {

 margin-left:0px;
  margin-right:10px;;
}

 #back{
  font-size:12px;
 }

  .work{
 
  margin-top:0px;
    margin-bottom:0px;
  text-transform:uppercase;
    height:20px;
  font-size:9px;
  line-height:12px;
}
  
.year-group{
  height:20px;
  margin-top:0px;
  margin-bottom:12px;
}

#works{
  margin-top:100px;
padding-right:5px;
  margin-bottom:100px;
}
  
  body {
    padding: 0px 0% 0px 0%;
    margin:  5% 5% 0px 5%;
  }

  .main {
    margin-left: 0px;
    margin-right: 0px;
    padding: 0px;
  }

  h1 {
    font-size: 20px;
  }

  h2 {
    font-size: 12px;
    
  }

  h3 {
    font-size: 12px;
  }
  .main {
    margin-bottom: 70px;
  }

  .title {
    margin-top: 2px;
   font-size: 10px;
  }

  .aboutText {

  font-size: 12px;
 
}

  .linkpage{
 
  margin-right:18px;

}

  .info {
font-size: 12px;
  line-height: 14px;

  margin-top: 9px;
 
}

 .previewTitle{
  font-size:10px;
}

}