@font-face {
    font-family: "Biko";
    src: url("../fonts/Biko_Regular.otf");
}

@font-face {
    font-family: "Biko-Bold";
    src: url("../fonts/Biko_Bold.otf");
}

@font-face {
    font-family: "Biko-Black";
    src: url("../fonts/Biko_Black.otf");
}

@font-face {
    font-family: "Geologica-Bold";
    src: url("../fonts/Geologica-Bold.ttf");
}

@font-face {
    font-family: "Geologica-Medium";
    src: url("../fonts/Geologica-Medium.ttf");
}

@font-face {
    font-family: "Geologica-Regular";
    src: url("../fonts/Geologica-Regular.ttf");
}

@font-face {
    font-family: "Geologica-Thin";
    src: url("../fonts/Geologica-Thin.ttf");
}

body {
    padding-top: 90px;
    padding-bottom: 30px;
    padding-left: 30px;
    padding-right: 30px;
    background-color: #F3F3F3;
}

h1 {
    color : #003049;
    font-family: "Geologica-Medium";
    font-size: 64;
    text-align: center;
}

h2 {
    color : #000000;
    font-family: "Geologica-Regular";
    font-size: 32;
    text-align: center;
}

p {
    color : #000000;
    font-family: "Geologica-Thin";
    font-size: 24;
}

.wip_container {
    display: grid;
    grid-template-columns: 1fr;
    justify-items: center;
}

.wip_container div {
    margin: 0% 4% 2% 4%;
    background-color: #94CA7E;
    padding: 20px;
    width: 40%;
    color: #1f2220;
    text-align: center;
}

.img_button {
    display: grid;
    grid-template-columns: 1fr;
    justify-items: center;
}

.img_button div {
    padding: 10px;
    float: left;
    width: 50%;
    margin: 0% 4% 2% 4%;
    position: relative;
    text-align: center;
}

.img_button div img {
    width: 100%;
    height: 250px;
}

.img_button div div {
    position: absolute;
    top: 50%;
    left: 30%;
    transform: translate(-50%, -50%);
}

.img_button div div h1 {
    color: #FFFFFF;
    font-size: 6vw;
    font-family: "Geologica-Bold";
    text-shadow: 3px 3px 3px black;
}

#kleding_individueel {
    margin-left: auto;
    margin-right: auto;
    border-collapse: collapse;
}

#kleding_individueel th {
    font-family: "Geologica-Regular";
    font-size: 30;
    color : #000000;
    padding: 10px;
}

#kleding_individueel td {
    font-family: "Geologica-Regular";
    text-align: left;
    background-color: #BABAFF;
    padding: 10px;
    color : #000000;
    font-size: 20;
}

#kleding_individueel .alt-row:nth-of-type(odd) td {
    background-color: #809EC2;
}

.admin_div {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    width: 70%;
    margin: auto;
}

.admin_div div {
    margin: 0% 4% 2% 4%;
    background-color:  #94CA7E;
    padding: 20px;
    width: 80%;
    color: #000000;
    float: left;
    border-radius: 20px;
    text-align: center;
    font-family: "Geologica-Thin";
    font-size: 25;
}

#button_rem_edit input{
    font-size: 20;
    background-color: #94CA7E;
    padding: 20px;
    border-radius: 30px;
    text-align: center;
    font-family: "Geologica-Bold";
    border: 0px;
}

#button_rem_edit  input:hover {
    background-color: #29ba52;
}