From 2bd926b7a63a6a9e916a82085427227413db0d1f Mon Sep 17 00:00:00 2001
From: Mathijs <mathijs@lermer.nl>
Date: Sun, 8 Jan 2023 12:52:20 +0100
Subject: [PATCH] Toegevoegd: mrl.css

---
 assets/css/mrl.css | 304 +++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 304 insertions(+)
 create mode 100644 assets/css/mrl.css

diff --git a/assets/css/mrl.css b/assets/css/mrl.css
new file mode 100644
index 0000000..44a3441
--- /dev/null
+++ b/assets/css/mrl.css
@@ -0,0 +1,304 @@
+/*responsive (media query)*********************************************************************************************************/
+
+@media only screen and (min-width: 1141px) {
+    .container{
+      margin-left: auto;
+      margin-right: auto;
+    }
+  }
+  
+  @media only screen and (max-width: 1140px) {
+    .container{
+      margin-left: 15px;
+      margin-right: 15px;
+    }
+  }
+  
+  @media only screen and (max-width: 850px) {
+      #menuknopje {
+        display: inline-block !important;
+        color: white;
+        font-size: 50px;
+        position: absolute;
+        right: 15px;
+        top: 10px;
+      }
+      nav{
+        display: none;
+      }
+      #main_menu_01 {
+        width: 100%;
+        border-top: 1px solid white;
+        border-bottom: 1px solid white;
+        background-color: #4d79ff;
+      }
+      #main_menu_01 ul li {
+        display: block;
+      }
+  }
+  
+  @media only screen and (max-width: 500px) {
+    logo {
+      font-size: 50px !important;
+    }
+  }
+
+
+  /*Fonts**********************************************************************************************************/
+  @font-face {
+    font-family: "Titillium_Web";
+    src: url("/assets/fonts/Titillium_Web/TitilliumWeb-Regular.ttf");
+    font-display: fallback;
+    }
+  @font-face {
+    font-family: "Roboto";
+    src: url("/assets/fonts/Roboto/Roboto-Bold.ttf");
+    font-display: fallback;
+    }
+  
+
+  /*Algemeen*********************************************************************************************************/
+  
+  body {
+    margin: 0;
+    padding: 0;
+  /* font-family: Titillium_Web , Fallback, sans-serif; */
+    font-family: Roboto , Fallback, sans-serif;
+    background-color: #171E26;
+    overflow: auto;
+  }
+
+  #page-container {
+    position: relative;
+    min-height: 100vh;
+  }
+  
+  #content-wrap {
+    padding-bottom: 80px;    /* Footer height */
+  }  #page-container {
+    position: relative;
+    min-height: 100vh;
+  }
+  
+  #content-wrap {
+    padding-bottom: 80px;    /* Footer height */
+  }
+
+  .container{
+    max-width: 1140px;
+  }
+  /*Secties*********************************************************************************************************/
+  
+  #sectie_kop {
+    background-color: #10161D;
+    border-bottom: 2px solid  #242D38;
+  }
+
+  header {
+    padding-top: 10px;
+    padding-bottom: 10px;
+  
+  }
+  
+  #sectie_pagina {
+    background-color: #171E26;
+    min-height: 595px;
+  }
+  
+  #sectie_footer {
+    background-color: #10161D;
+    border-top: 2px solid  #242D38;
+    position: absolute;
+    bottom: 0;
+    width: 100%;
+    height: 80px;
+  }
+
+
+  /*Standaard*********************************************************************************************************/
+
+  /*links**/
+  #tekst-links{
+    text-align: left;
+    color: white;
+  }
+  #tekst-links h1{
+    padding-top: 150px;
+    margin-top: 0px;
+    font-size: 42px;
+    margin-bottom: 60px;
+  }
+  #tekst-links h2{
+    padding-top: 150px;
+    margin-top: 0px;
+    font-size: 30px;
+    margin-bottom: 60px;
+  }
+  #tekst-links p{
+    background-color: #2B3642;
+    font-size: 15px;
+  }
+
+  /*midden**/
+  #tekst-midden{
+    text-align: center;
+    color: white;
+  }
+  #tekst-midden h1{
+    padding-top: 150px;
+    margin-top: 0px;
+    font-size: 42px;
+    margin-bottom: 60px;
+  }
+
+  #tekst-midden h2{
+    padding-top: 60px;
+    margin-top: 0px;
+    font-size: 30px;
+    margin-bottom: 60px;
+  }
+  #tekst-midden p{
+    font-size: 18px;
+  }
+  
+  a:active {
+    color: yellow;
+    background-color: #2B3642;
+    text-decoration: underline;
+  }
+  a:link{
+      color: white;
+      background-color: transparent;
+      text-decoration: none;
+    }
+      
+  a:visited {
+        color: rgba(255, 255, 255, 0);
+        background-color: #2B3642;
+        text-decoration: none;
+      }
+      
+  a:hover {
+      color: red;
+      background-color: #2B3642;
+      text-decoration: underline;
+    }
+
+  /*specials*********************************************************************************************************/
+
+  logo {
+    color: #ffffff;
+    margin-top: 25px;
+    margin-bottom: 25px;
+    text-transform: uppercase;
+    font-family: Roboto, Fallback, sans-serif;
+    font-size: 50px;
+    text-shadow: -3px 0 black, 0 3px black, 3px 0 black, 0 -3px black, 1px 1px 2px black, 0 0 25px black, 0 0 5px black;
+  }
+
+  .knop{
+    padding: 25px 90px 25px 90px;
+    text-align: center;
+    text-decoration: none;
+    border-radius: 5px;
+    font-size: 20px;
+    color: white;
+    cursor: pointer;
+    }
+    #knop a:link{
+      color: white;
+      background-color: transparent;
+      text-decoration: none;
+    }
+      
+    #knop a:visited {
+        color: rgba(255, 255, 255, 0);
+        background-color: #2B3642;
+        text-decoration: none;
+      }
+      
+    #knop a:hover {
+      color: red;
+      background-color: #2B3642;
+      text-decoration: underline;
+    }
+    
+    #knop a:active {
+      color: yellow;
+      background-color: #2B3642;
+      text-decoration: underline;
+    }
+
+    .knop_contact{
+      padding: 25px 25px 25px 25px;
+      width: 100%;
+      font-size: 18px;
+      background-color: #171E26
+      }
+
+
+/*menu*********/
+    nav{
+      float: right;
+      }
+      nav ul li {
+        display: inline-block;
+        padding: 5px 17px 5px 17px;
+        text-transform: uppercase;
+        margin: 0;
+        }
+      nav ul li.active{
+        background-color: #2B3642;
+        border-radius: 5px;
+      }
+      nav ul li a {
+        text-decoration: none;
+        color: white
+      }  nav{
+        float: right;
+        }
+        nav ul li {
+          display: inline-block;
+          padding: 5px 17px 5px 17px;
+          text-transform: uppercase;
+          margin: 0;
+          }
+        nav ul li.active{
+          background-color: #2B3642;
+          border-radius: 5px;
+        }
+        nav ul li a {
+          text-decoration: none;
+          color: white
+        }
+   
+/*footer*********/
+  
+.footer-links{
+  max-width: 800px;
+  margin-left: auto;
+  margin-right: auto;
+  text-align: center;
+  }
+.footer-links ul {
+  padding: 0px;
+  display: inline-block
+  }
+
+.footer-links ul li {
+  display: inline-block;
+  padding: 15px 17px 15px 17px;
+  text-transform: uppercase;
+  font-size: 20px;
+
+  }
+
+.footer-links ul li a {
+    text-decoration: none;
+    padding: 15px 17px 15px 17px;
+    color: white;
+  }
+
+
+  /*uitzonderingen*********************************************************************************************************/
+