/*=============== GOOGLE FONTS ===============*/

/* @import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;300;400;600;700&display=swap'); */

@font-face {
    font-family: "MongoDBValueSerif";
    src: url("https://static.igem.wiki/teams/4781/wiki/fonts/mongodbvalueserif-regular.woff2") format('woff');
}

@font-face {
    font-family: "euclidCircular";
    src: url("https://static.igem.wiki/teams/4781/wiki/fonts/euclidcirculara-regular-webxl.woff2") format('woff');
}

/*=============== VARIABLES CSS ===============*/
:root {
    /*========== Colors ==========*/
    /*Color mode HSL(hue, saturation, lightness)*/
    --first-color: #ffffff;
    --first-color-light: hsl(0, 0%, 74%);
    --black-color: hsl(0, 0%, 0%);
    --dark-font: #001E2B;
    --body-color: hsl(0, 0%, 100%);
    --text-color: #5d6c74;

    /* ========== fonts ========= */
    --body-font: euclidCircular;
    --heading-font: MongoDBValueSerif;
}


body {
    font-family: var(--body-font);
    color: var(--text-color);
    background-color: var(--body-color);
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100vh;
    background-size: 3em 3em;
    background-attachment: fixed;
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow-x: hidden;
    /* font-family: "MongoDBValueSerif"; */
}


a {
    text-decoration: none;
}

ul {
    list-style: none;
}

img {
    max-width: 100%;
}

/* *{
    border-radius: 10px;
} */

table {
    border-collapse: collapse;
    margin: 20px auto;
    width: 100%;
}

.table {
    width: 90%;
}

th,
td {
    border: 1px solid #ccc;
    padding: 8px;
    text-align: left;
    position: relative;
}

th {
    background-color: #f2f2f2;
}

tr:hover {
    background-color: #f5f5f5;
}