/* ADDED */

.fa, .fa-brands, .fa-duotone, .fa-light, .fa-regular, .fa-solid, .fa-thin, .fab, .fad, .fal, .far, .fas, .fat {
    color: #ffffff!important;
}
footer {
  background-color: #121315;
  color: #ffffff;
  font-size: 16.5px;
}
footer * {
  box-sizing: border-box;
  border: none;
  outline: none;
  font-size:1em;
}
.row.primary {
  padding-top:3em;
  display: grid;
  grid-template-columns: 2fr 2fr;
  align-items: stretch;
}
.column {
  width: 100%;
  display: flex;
  flex-direction: column;
  padding: 0 2em;
  min-height: 15em;
  padding-bottom:2em;
}
ul {
  list-style: none;
  display: flex;
  flex-direction: column;
  padding: 0;
  margin: 0;
}
li:not(:first-child) {
  margin-top: 0.8em;
}
ul li a {
  color: #ffffff;
  text-decoration: none;
}
ul li a:hover {
   color: #45a049;
}
.about p {
  text-align: left;
  line-height: 2;
  margin: 0;
}
input,
button {
  width: 100%; /* Full width */
  padding: 12px; /* Some padding */ 
  border: 1px solid #ccc; /* Gray border */
  border-radius: 4px; /* Rounded borders */
  box-sizing: border-box; /* Make sure that padding and width stays in place */
  margin-top: 6px; /* Add a top margin */
  margin-bottom: 16px; /* Bottom margin */
  resize: vertical; /* Allow the user to vertically resize the textarea (not horizontally) */
}
button {
  background-color: #45a049;
  color: #ffffff;
}
div.social {
  display: flex;
  justify-content: space-around;
  font-size: 3.6em;
  flex-direction: row;
  margin-top: 1em;
}
.social i:hover {
    color: #45a049;
}
.row.secondary {
  display: flex;
  justify-content: space-around;
  text-align: center;
}
.row.secondary i {
  font-size: 1.8em;
  color: #45a049;
}
.row.secondary div {
  padding: 1em 0;
  width: 100%;
}
.row.secondary div:hover {
  background-color: #25262e;
}
.copyright {
  padding: 0.3em 1em;
  background-color: #25262e;
}
.copyright p {
  font-size: 1em;
  text-align: center;
}
@media screen and (max-width: 850px) {
  .row.primary {
    grid-template-columns: 1fr;
  }
  .row.secondary {
    flex-direction: column;
  }
}

/* OLD STARTS HERE */

@font-face {
    font-family: 'architectsdaughter';
    src: url('webfont/architectsdaughter-webfont.woff2') format('woff2'),
         url('webfont/architectsdaughter-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

body, html{
  background-color:#ffffff;
  color:#000;
  font-family: 'architectsdaughter';
  font-size:16px!important;
  padding:0;
  margin:0 auto;
  text-align:center;
  font-size:1em;
  max-width:1400px;
}

h1{
  font-size:3.2em;
  font-weight:600;
  color:#0dbb0c;
  text-align:center;
  margin:0;
  line-height:1.2em;
}

h2{
  font-size:1.6em;
  font-weight:600;
  color:#0dbb0c;
  text-align:center;  
  margin:0;
  line-height:1.2em;
}

h3{ 
  font-size:1.2rem;
  text-align: center;
  font-weight:600;
  margin:0;
  line-height:1.2em;
}

a{
  text-decoration:none;
  color:#fff;
}

.groen{
  color:#0dbb0c;
}
#34_inhoud{
  width:70%;
  margin:20px auto;
  padding:0;
}

#hele_inhoud{
  width:100%;
  padding:0;
}

.rechter_menu{
  transition: transform .7s ease-in-out;
}

.rechter_menu:hover{
  transform: rotate(20deg);
}

.laptop_langzaam {
  position: absolute;
  top: 10%;
  right: 11%;
  width:22%;
}

.laptop_langzaam:hover {
  position: absolute;
  top: 5%;
  right: 1%;
  width:42%;
}

.andijker {
  position: absolute;
  top: 62%;
  right: 4%;
  width:30%;
}

.andijker:hover {
  position: absolute;
  top: 42%;
  right: 0%;
  width:53%;
}


/* AFSPRAAK.PHP-> */

/* Style inputs with type="text", select elements and textareas */
input[type=text], select, textarea {
  width: 100%; /* Full width */
  padding: 12px; /* Some padding */ 
  border: 1px solid #ccc; /* Gray border */
  border-radius: 4px; /* Rounded borders */
  box-sizing: border-box; /* Make sure that padding and width stays in place */
  margin-top: 6px; /* Add a top margin */
  margin-bottom: 16px; /* Bottom margin */
  resize: vertical; /* Allow the user to vertically resize the textarea (not horizontally) */
}

/* Style the submit button with a specific background color etc */
input[type=submit] {
  background-color: #0dbb0c;
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

/* When moving the mouse over the submit button, add a darker green color */
input[type=submit]:hover {
  background-color: #45a049;
}

/* Add a background color and some padding around the form */
.mail_form {
  border-radius: 5px;
  background-color: #f2f2f2;
  padding: 20px;
}

/* <-AFSPRAAK.PHP */

/* INDEX.PHP -> */

.zoom_terug_knop{
  position:absolute;
  width:12%;
  top: 1%;
  left: 1%;
  transition: transform .7s ease-in-out;
}

.zoom_terug_knop:hover{
  position:absolute;
  width:12%;
  transform: rotate(25deg);
  top: 1%;
  left: 1%;
}

.rechter_menu{
  width:11%;
  float:left;
}

.grote_foto{
  width:89%;
  float:left;
  position: relative;
}

#menu_onder{
  margin:10px 0 20px;
  font-size:1.4em;
  display:flex;
  justify-content:space-between;
}

.info_scherm_rechts_boven {
    margin-top: 2.5em;
    position: absolute;
    top: 0%;
    right: 2%;
    width: 30%;
    color: #0dbb0c;
    font-size: 1.6em;
}
 
.info_scherm_rechts_boven:hover {
  position: absolute;
  top: 0%;
  right: 0%;
  width:35%;
  color: #0dbb0c;
  font-size:2.0em;
}

.slechts750 {
  position: absolute;
  top: 0%;
  left: 2%;
  width:18%;
}

.slechts750:hover {
  position: absolute;
  top: 0%;
  left: 0%;
  width:23%;
}

.geenvoorrij {
  position: absolute;
  top: 0%;
  left: 42%;
  width:23%;
}

.geenvoorrij:hover {
  position: absolute;
  top: 0%;
  left: 40%;
  width:31%;
}

/* <-INDEX.PHP */

/* <-WERKZAAMHEDEN.PHP */

.overzicht_werkzaamheden {
  background-color: #EFFFED;
}

/* <-WERKZAAMHEDEN.PHP */

#tweede_hands{
	font-family: 'verdana', 'arial';
	text-align:left;
}
@media only screen and (min-width: 920px) {
.34_breedte{
  width:70%;
}
.body_breedte{
  margin:2% 18%;
}
}
.hele_breedte{
  width:100%;
}

.titel_breedte{
  width:100%;
  position:relative;
}

.op_10_procent{
  width:10%;
  float:left;
}

.op_25_procent{
  width:25%;
  float:left;
}

.op_33_procent{
  width:33%;
  float:left;
}

.op_67_procent{
  width:67%;
  float:left;
}

.op_50_procent{
  width:50%;
  float: left;
}

.op_75_procent{
  width:75%;
  float:left;
}

.op_75_procent_op_mobiel{
  width:100%;
}

.op_50_procent_mobiel_100_procent{
  width:50%;
  float: left;
  padding-bottom:2em;
}
@media only screen and (max-width: 768px) {
  
  .top-right {font-size:0.65em!important;}

  .grote_foto{width:100%!important;}


  .rechter_menu{width:25%!important;}

  .zoom_terug_knop{width:15%!important;}
  
}


@media only screen and (max-width: 768px) {

/* WHATSAPP */

.float{
	position:fixed;
	width:85px;
	height:85px;
	bottom:40px;
	left:20px;
	background-color:#0dbb0c;
	color:#FFF;
	border-radius:50px;
	text-align:center;
  font-size:60px;
	box-shadow: 2px 2px 3px #999;
  z-index:100;
}

.my-float {
    margin-bottom: -1px;
    margin-right: 0px;
    contain: content;
}
}

@media only screen and (max-width: 920px) {

  .op_50_procent_mobiel_100_procent{width:100%!important;}
}