/* CSS Document */

html {
    scroll-behavior: smooth;
}

body {
    background-color: #E1E1E1; 
    font-family: 'Playfair Display', serif;
}

.home {
    display: block;
    padding: 0;
    margin-left: 1.1cm;
    }
    
.nav-link {
    color: #9B5A77 !important; 
    min-height: 1cm !important;
    align-items: center;
    font-size: 14pt;
    padding-top: 40px;
    margin-left: 30px;
    margin-right: 30px;
}


.nav-link li {
    margin-left: 10px;
    margin-right: 10px;
}

.nav-link:hover {
    color: #584B54 !important; 
}

.column {
    border-bottom: 1px solid #9B5A77;
    margin-top: 5px;
    margin-bottom: 1cm;
}

h1 {
    padding-bottom: 20px;
    color: #9B5A77;
    margin-top: 0.1px;
    font-size: 40pt;
    font-family: 'Playfair Display', serif;
}

.col-sm {
    min-width: 20%;
    height: 12cm;
    box-sizing: border-box;
    border: 2px solid #9B5A77;
    padding: 20px;
    margin-top: 1cm;
}

a:link {
    text-decoration: none !important;
}

h2 {
    color: #9B5A77;
    text-align: center;
    font-size: 40pt;
}

h3 {
    color: #9B5A77;
    text-align: center;
    font-size: 20pt; 
    font-weight: 500;
    padding: 20px;
    text-decoration: none;
}

h6 {
    color: #9B5A77;
    text-align: left;
    font-size: 12pt; 
    font-weight: 500;
    padding: 20px;
    letter-spacing: 2px;
    margin-left: 0.5cm;
    margin-right: 0.5cm;
}

h4 {
    color: #9B5A77;
    text-align: left;
    font-size: 12pt; 
    font-weight: 500;
    padding: 20px;
    letter-spacing: 2px;
    margin-left: 0.7cm;
    margin-right: 0.5cm;
}

h5 {
    color: #9B5A77;
    text-align: left;
    font-size: 12pt; 
    font-weight: 500;
    padding: 19px;
    letter-spacing: 2px;
    margin-left: 0.8cm;
    margin-right: 0.5cm;


}
.column1 {
    border-bottom: 1px solid #9B5A77;
    margin-top: 1.5cm;
    margin-bottom: 1cm;
}

.mx-auto {
    display: block;
    margin-left: 15cm;
    max-width:30%;
    height: auto;
}

.row3 {
    display: flex;
    justify-content: center;
    height: 1cm;
    flex: 33.33%;
    margin-top: 1cm;
    margin-left: 50px;
    margin-right: 50px;
}

.column8 {
    width: 2cm;
    height: 6cm;
    padding: 1px;
    margin-right: 1px;
    margin-left: 1px;
    text-align: center;
    justify-content: center;
    align-content: center;  
 
}

.edam {
    border-top: 2px solid #9B5A77;
    border-bottom: 2px solid #9B5A77;
    font-size: 8pt;
    color: #584B54;
    letter-spacing: 1px;
    padding-bottom: 1px;
    margin-left: 90px;
    margin-right: 90px;
    margin-top: 1cm;
    margin-bottom: 1px;
    align-content: center;
    justify-content: center;
    text-align: center;
}   

h3:hover {
    color: #DBBBCA !important;
    text-decoration: underline !important; 
    text-decoration-color:  #DBBBCA ;
}

h3:active {
    color: #DBBBCA !important;
    text-decoration:underline !important; 
    text-decoration-color:  #DBBBCA ;
}

h3:link {
    color: #DBBBCA !important;
    text-decoration: underline !important; 
    text-decoration-color:  #DBBBCA !important;
}

h3:visited {
    color: #DBBBCA !important;
    text-decoration: underline  !important; 
    text-decoration-color:  #DBBBCA ;
}

.responsive {
    max-width: 100%;
    justify-content: center;
    align-content: center;
}

@media (max-width: 1199.98px) {
    .responsive-font-example {
      font-size: 30px;
    }
  }

  @media (min-width: 1200px) {
    .responsive-font-example {
      font-size: 40pt;
    }
  }

  @media only screen and (max-width: 600px) {

    .col-sm {
       height: min-content;
    }

    h2 {
        font-size: 25pt;
    }
    
    h3 {
        font-size: 16pt;
    }

    h4, h5, h6 {
        font-size: 11pt;
    }

  }

  @media only screen and (max-width: 1000px) {

    h2 {
        font-size: 22pt;
    }
    
    h3 {
        font-size: 14pt;
    }

       h4, h5, h6 {
        font-size: 8pt;
        min-height: min-content;
        max-width: max-content;
        }

    .col-sm { 
        max-height: min-content;
     }

  }

  @media only screen and (min-width: 1020px) {

    h2 {
        font-size: 22pt;
    }
    
    h3 {
        font-size: 14pt;
    }

       h4, h5, h6 {
        font-size: 10pt;
        min-height: min-content;
        max-width: max-content;
        }

    .col-sm {
        max-height:11cm;
   
     }
  }

  