h1,
h2,
h3,
h4,
h5,
h6,

/* CSS for start-start page */

ul {
    margin: 0;
    padding: 0;
}

body {
    margin: 0%;
    background-color: #E7E7E9;
}

.content_all {
    min-height: 100vh;
    background-image: url(../img/bg.webp);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.content__container {
    padding: 0% 0 0 0%;
    margin: 10% auto 5% auto;
    text-align: center;
    font-size: 1rem;
}

.me {
    font-family: 'Quicksand';
    font-style: normal;
    font-weight: 600;
    font-size: 4.375rem;
    line-height: 70px;
    letter-spacing: 0.395em;
    /*text-transform: uppercase;*/
    font-feature-settings: 'tnum' on, 'lnum' on;
}

.quote {
    bottom: -720px;
    right: 15px;
    padding: 0px;
    position: relative;
    font-family: 'Khand';
    font-style: normal;
    font-weight: 400;
    font-size: 1.25rem;
    letter-spacing: 0.3em;
    color: #BDB4B4;
    text-align: right;
    height: fit-content;
}


/* CSS for project page */

main {
    display: flex;
    flex-direction: column;
}

section {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.project {
    display: flex;
    width: 49vw;
    margin: 1% 0px 1% 0px;
    align-items: center;
    flex-direction: column;
}

.p_name {
    font-size: 1.5rem;
    font-family: 'Courier New', Courier, monospace;
    font-style: italic;
    text-align: center;
    padding-bottom: 1.5%;
}

.p_description {
    font-size: 1.1rem;
    font-family: Quicksand;
    font-weight: 400;
    padding-left: 2%;
}

.p_image {
    align-items: center;
}

.links {
    display: flex;
    justify-content: space-between;
}
.click-zoom input[type=checkbox] {
  display: none
}

.click-zoom img {
  margin: 100px;
  transition: transform 0.25s ease;
  cursor: zoom-in;
  
}

.click-zoom input[type=checkbox]:checked~img {
  transform: scale(3);
  cursor: zoom-out;
  width: auto;
  position: center;
}

/* media queries */

@media only screen and (max-width: 768px) and (orientation: portrait) {
    .content__container {
        padding: 0% 0 0 0%;
        margin: 3% auto 3% auto;
        text-align: center;
        font-size: 1rem;
    }
    .me {
        font-family: 'Quicksand';
        font-style: normal;
        font-weight: 600;
        font-size: 2.5rem;
        letter-spacing: 0.395em;
        text-transform: uppercase;
        font-feature-settings: 'tnum' on, 'lnum' on;
        opacity: 80%;
    }
    .project {
        width: auto;
    }
}