body {
  padding: 0;
  margin: 0;
  background-color: #f3f3f3;
}
body, input, select, button {
  font-family: sans-serif;
}
*, ::after, ::before {
  box-sizing: inherit !important;
}

#wrapper {
  width: 100%;
}

#nav {
  width: 100%;
  height: 74px;
  position: fixed;
  top: 0;
  left: 0;
  border-bottom: 1px solid #e99924;
  background: url('../images/bg-nav.png') repeat center;
  z-index: 10;
}

#inner-nav {
  width: 1000px;
  height: 100%;
  margin: 0 auto;
  display: flex;
} #inner-nav div {
  float: left;
}

#logo-blok {
  height: 100%;
}

#logo {
  height: 100%;
}

#search-blok {
  display: flex;
  height: 36px;
  padding: 19px 0;
  margin: 0 auto;
} #search-blok input {
  border: 1px solid grey;
  background-color: #00000021;
  color: #d0d0d0;
  width: 330px;
  font-size: 20px;
  border-radius: 50px;
  height: 34px;
  margin: 0;
  padding: 0;
  padding-left: 15px;
  padding-right: 15px;
} #search-blok input:focus {
  outline: none;
}

#cat-blok {
  height: 100%;
  width: 150px;
}

#main {
  width: 1000px;
  margin: 0 auto;
  margin-top: 74px;
  display: grid;
}
#extra {
  margin-top: 10px;
}
#container {
  margin-top: 10px;
}

.tool {
  background-color: #ffffffa1;
  display: flex;
  width: 100%;
  border-top: 1px solid #bfbfbf;
  border-bottom: 1px solid #bfbfbf;
  margin-bottom: 30px;
  color: #4a4a4a;
}
.tool-blok-shell {
  display: flex;
  padding: 10px 0;
  height: 171px;
} .tool .tool-blok-shell:nth-child(1) {
  width: 33%;
} .tool .tool-blok-shell:nth-child(2) {
  width: 50%;
} .tool .tool-blok-shell:nth-child(3) {
  width: 17%;
} a.tool-blok-shell {
  cursor: pointer;
  color: #4a4a4a;
} a.tool-blok-shell:hover {
  color: #4a4a4a;
  text-decoration: none;
} a.tool-blok-shell:hover img {
  transform: scale(1.1);
} a.tool-blok-shell:hover h2 {
  text-decoration: underline;
}
.tool-image {
  display: block;
  /*width: 33%;*/
  width: 100%;
  height: 100%;
  border-right: 1px solid #bfbfbf;
} .tool-image img {
  transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  -moz-transition: all .2s ease-in-out;
  -webkit-transition: all .2s ease-in-out;
  display: block;
  width: 82%;
  margin: 0 auto;
  margin-top: 10px;
}
.tool-text  {
  display: block;
  /*width: 50%;*/
  width: 100%;
  height: 100%;
  border-right: 1px solid #bfbfbf;
}
.tool-title {
  width: 90%;
  margin: 0 auto;
  border-bottom: 1px solid #bfbfbf;
} .tool-title h2 {
  padding: 37px 0;
  text-align: center;
  font-size: 33px;
  margin: 0;
} .tool-info {
  width: 80%;
  margin: 0 auto;
} .tool-info p {
  margin: 12px 0;
  padding: 10px 5px;
}
.tool-buttons {
  /*width: 17%;*/
  width: 100%;
  height: 100%;
} .tool-buttons button {
  font-weight: bold;
  color: #fbfbfb;
  border-radius: 5px;
  display: block;
  width: 100px;
  height: 35px;
  margin: 33px auto;
  border: 0 solid black;
  cursor: pointer;
} .tool-buttons button:focus {
  outline: none;
}
.verwijder {
  background-color: #dc3545;
} .verwijder:hover {
  background-color: #bd3542;
}
.edit {
  background-color: #597eaa;
} .edit:hover {
  background-color: #496990;
}

#footer {
  width: 100%;
}

#Voegtoe table {
  margin: 0 auto;
}
