body {
    background: url("/images/bg.png");
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    margin: 0;
    font-family: verdana;
    display: grid;
    grid-template-columns: 200px 2.5fr 2fr;
    grid-template-rows: auto;
  }


    .logo-div {
      grid-column: 2;
      grid-row: 1;
      margin: auto;
    }
    
    #logo-pic { 
      max-width: 100%;
    }


    .introbox {
      grid-column: 2;
      grid-row: 2 / span 5;
      background-color: #f9f9f9;
      border-radius: 15px;
      padding: 3%;
      box-shadow: 5px 3px 10px #3c3c3c;
    }
    
    #introtxt {
      text-align: center;
      font-size: 13.5px;
    }


    .katz-div {
      grid-column: 1;
      grid-row: 1;
      margin: 12%;
    }
    
    #katz-icon {
      max-width: 95%;
    }


    .linktxt {
      grid-column: 1;
      grid-row: 2;
      margin: 3% auto;
      text-align: center;
      background-color: #f9f9f9;
      border-radius: 15px;
      padding: 7%;
      box-shadow: 5px 3px 10px #3c3c3c;
    }


    .buttons-dni {
      grid-column: 1;
      grid-row: 3;
      max-width: 75%;
      margin: 5% 3%; 
    }
    
    .buttons-art {
      grid-column: 1;
      grid-row: 4;
      max-width: 75%;
      margin: 5% 3%;
    }
    
    .buttons-sw {
      grid-column: 1;
      grid-row: 5;
      max-width: 75%;
      margin: 5% 3%;
    }
    
    #button-123 {
      text-align: center;
      background-color: #f9f9f9;
      color: #3c3c3c;
      border-radius: 20px;
      padding: 12px 25px;
      box-shadow: 5px 3px 10px #3c3c3c;
      margin: 3%;
      min-width: 80%;
      display: inline-block;
    }
    #button-123:hover {
      opacity: 0.8;
      transition-duration: 0.2s;
    }
    #button-123:active {
      transition-duration: 0s;
      transform: translate(1px,3px);
      box-shadow: 3px 1px 6px #3c3c3c;
      color: #3c3c3c;
    }


@media screen and (max-width:720px) {
    
    body {
      display: block;
    }
    
    #logo-pic {
      margin: 3%;
      max-width: 94%;
    }
    
    .introbox {
      margin: 3% auto;
      max-width: 90%;
    }
    
    .katz-div {
      margin: auto;
      max-width: 50%;
    }
    
    .linktxt {
      margin: 3% auto;
      max-width: 50%;
      padding: 3%;
    }
    
    .buttons-dni {
      margin: auto;
      text-align: center;
      max-width: 75%;
    }
    
    .buttons-art {
      margin: auto;
      text-align: center;
      max-width: 75%;
    }
    
    .buttons-sw {
      margin: auto;
      text-align: center;
      max-width: 75%;
    }
}