/*.process{
    height: 14vw;
    width: 19vw;
    border-radius: 8vw 0;
    font-size: 2.4vw;
    text-align: center;
    margin: 0 1vw;
    color: rgb(34, 34, 34);
    border-color: rgb(34, 34, 34);
    border-style: solid;
    border-width: 0.7vw;
}
.process_text{
    margin: 3.3vw 2vw;
}
.capture{
    background-color: rgba(228, 168, 39, 0.75);
}
.analyze{
    background-color: rgba(38, 131, 198, 0.75);
}
.solve{
    background-color: rgba(69, 183, 91, 0.75);
}*/
.navbar{
    display: flex;
    justify-content: space-between;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 100px;
    padding: 0 7% 0 2%;
    align-items: center;
    background-color: rgb(34, 34, 34);
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    font-size: 22px;
    z-index: 1;
}
.creditBar{
    display: flex;
    justify-content: space-around;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 50px;
    align-items: center;
    background-color: rgb(34, 34, 34);
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    color: #d0d5e7;
    z-index: 1;
}
body{
    background-image: url(/img/halfmoon_lg2.png);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: 80vw;
    background-position-x: -13vw;
    background-position-y: -8vw;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    margin: 0px;
}
.navbarlink{
    background-color: rgb(38 131 198);
    text-decoration: none;
    border-radius: 25px;
    width: 125px;
    min-width: 100px;
    height: 45px;
    border-width: 4px;
    border-color: #d0d5e7;
    border-style: "shadow";
    font-size: 15px;
}
.transparency-wrap {
    position: relative;
    padding: 8px;
}
.transparency-wrap:before {
    content: ' ';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 130%;
    opacity: 0.65;
    background-color: white;
    background-position: 50% 0;
    background-size: cover;
}
.transparency-content {
    position: relative;
    min-height: 1000px;
}
/*.grid-container {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    grid-template-rows: repeat(3, 1fr);  
    /*background-color: rgba(38, 131, 198, 0.75);*//*
    padding: 3% 0;
    margin: 5% 10%;
    align-items: center;
    justify-items: center;
    gap: 0.7vw;
    z-index: 0;
    border-radius: 10vw 0 10vw 0;
}
.grid-item{
    background-color: rgba(34, 34, 34, 0.95);
    color: #d0d5e7;
    padding: 0px;
    width: 100%;
    height: 100%;
    position: relative;
}
.grid-item-1 {
    grid-column: 2/span 2;
    grid-row: 1;
    top: 0px;
    left: 0px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6vw 0 0 0;
    font-family: cursive;
}
.grid-item-3 {
    grid-column: 2/span 2;
    grid-row: 2/span 2;
    top: 0px;
    left: 0px;
}
.grid-item-4 {
    grid-column: 4 /span 4;
    grid-row: 1 /span 3;
    top: 0px;
    left: 0px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0 0 6vw 0;
}
.p-special{
    margin-block-start: 0.5em;
    margin-block-end: 0.5em;
    margin: 1vw;
    font-size: 1.7vw;
    text-align: center;
}
.p-title{
    font-size: 3.5vw;
    margin-top: 4vw;
    margin-bottom: 0px;
}
.img-step{
    width: 95%;
    max-height: 95%;
    border-radius: 0 0 5vw 0;
}