/* do no edit content of werkaandewinkel.css - gets compiled from scss */
html {
  box-sizing: border-box; }

*, *::after, *::before {
  box-sizing: inherit; }

/* General */
h1 {
  font-size: 42px;
  margin-bottom: 5px; }

p {
  font-size: 20px;
  font-family: 'Open Sans Condensed', sans-serif; }

html, body {
  background-color: #FFF;
  font-family: 'Amatic SC', cursive; }

.page-wrapper {d
  margin-top: 75px;
  margin-bottom: 100px; }

#layout-header {
  top: 0; }

/* Navbar */
#layout-nav {
  background-color: #F5FAFF;
  box-shadow: 2px 2px 2px #D7E7F7;
  height: 100px;
  border-bottom: none;
  padding-top: 20px;
  margin-bottom: 20px;
  opacity: 0.95; }
  #layout-nav .logo {
    float: left;
    max-width: 20%;
    height: auto; 
   }

    #layout-nav .logo img {
      box-shadow: none;
      }
  #layout-nav ul li {
    display: inline;
    float: right;
    margin: 15px;
    font-size: 2em; }
#layout-nav ul li a {
    padding: 0 0 2px;
    position: relative;
    	text-decoration: none;
    	outline: none;
}

#layout-nav ul li a::after {
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	height: 1px;
	background: #337ab7;
	content: '';
	opacity: 0;
	-webkit-transition: height 0.3s, opacity 0.3s, -webkit-transform 0.3s;
	-moz-transition: height 0.3s, opacity 0.3s, -moz-transform 0.3s;
	transition: height 0.3s, opacity 0.3s, transform 0.3s;
	-webkit-transform: translateY(-5px);
	-moz-transform: translateY(-5px);
	transform: translateY(-5px);
}

#layout-nav ul li a:hover::after,
#layout-nav ul li a:focus::after {
	height: 2px;
	opacity: 1;
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	transform: translateY(0px);
}

    

.slicknav_menu {
  display: none; }

/* Header */
header {
  max-width: 100%;
  margin-top: 100px; }

img {
  max-width: 100%;
  box-shadow: 2px 2px 2px rgba(180,214,234,0.8); 
  margin-bottom: 20px;
}

.contact-main {
  height: auto; }
  .contact-main span.namecomp {
    float: left; }
  .contact-main span.addresscomp {
    float: left;
    text-align: left; }
.contact-main h3.addresspart {
    display: inline;
    padding: 0 10px;
    border-right: 1px solid rgba(180,214,234,0.8);
}

.contact-main h3.addresspart:first-child {
    border-right: 1px solid rgba(180,214,234,0.8);
    border-left: none;
    padding-right: 10px;
    padding-left: none;
}
.contact-main h3.addresspart:last-child {
    border-right: none;
    padding-left: 10px;
}
.header-2 {
  display: none; }

/* Contact Gegevens */
.contact-gegevens {
  right: 100px;
  top: 120px;
  position: fixed;
  background-color: #F6FBFF;
  padding: 20px; }
d
.contact-gegevens:after {
  background: linear-gradient(-30deg, #FFF 16px, transparent 0), linear-gradient(30deg, #FFF 16px, transparent 0);
  background-position: left-bottom;
  background-repeat: repeat-x;
  background-size: 32px 32px;
  content: " ";
  display: block;
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 100%;
  height: 32px; }

/* Containers */
.container {
  max-width: 68em;
  margin-left: auto;
  margin-right: auto; }
  .container::after {
    clear: both;
    content: "";
    display: table; }
  .container h1 {
    margin-bottom: 20px; }
  .container .column3 {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 31.76157%;
    padding-right: 20px; }
    .container .column3:last-child {
      margin-right: 0; }
    .container .column3 h3 {
      margin-bottom: 50px; }
  .container .column2 {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 48.82117%;
    padding-right: 20px; }
    .container .column2:last-child {
      margin-right: 0; }

/* Klanten */
.klanten h1 {
  line-height: 2em; }
.klanten .name-function {
  text-align: center; }
  .klanten .name-function img {
    box-shadow: 2px 2px 2px #D7E7F7;
    max-height: 150px;
    display: block;
    margin: auto; }


#layout-nav ul li a {
    padding: 0 0 2px;
    position: relative;
    	text-decoration: none;
    	outline: none;
}



/* Blogs */
.blogs a {
  font-family: 'Open Sans Condensed', sans-serif;
  font-size: 22px; 
text-decoration: none;
outline: none;
position: relative;}

.blogs a::after {
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	height: 1px;
	background: #337ab7;
	content: '';
	opacity: 0;
	-webkit-transition: height 0.3s, opacity 0.3s, -webkit-transform 0.3s;
	-moz-transition: height 0.3s, opacity 0.3s, -moz-transform 0.3s;
	transition: height 0.3s, opacity 0.3s, transform 0.3s;
	-webkit-transform: translateY(-5px);
	-moz-transform: translateY(-5px);
	transform: translateY(-5px);
}

.blogs a:hover::after,
.blogs a:focus::after {
	height: 2px;
	opacity: 1;
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	transform: translateY(0px);
}

.blogs ul.post-list {
  padding-left: 0; }
  .blogs ul.post-list li {
    list-style-type: none; }

.blogpost {
  max-width: 600px;
  line-height: 1.5em; }
  .blogpost a {
    font-size: 26px;
    padding-top: 50px; }

/* Contact */
.container .column2 img {
  width: 100%;
  height: auto; }
.container .column2 p.route {
  margin-top: 20px;
  font-size: 18px; }
.container .column2 .btn {
  padding: 5px 50px; }

.map .route a {
 outline: none;
text-decoration: none;
position: relative;
}
.map .route a::after {
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	height: 1px;
	background: #337ab7;
	content: '';
	opacity: 0;
	-webkit-transition: height 0.3s, opacity 0.3s, -webkit-transform 0.3s;
	-moz-transition: height 0.3s, opacity 0.3s, -moz-transform 0.3s;
	transition: height 0.3s, opacity 0.3s, transform 0.3s;
	-webkit-transform: translateY(-5px);
	-moz-transform: translateY(-5px);
	transform: translateY(-5px);
}

.map .route a:hover::after,
.map .route a:focus::after {
	height: 2px;
	opacity: 1;
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	transform: translateY(0px);
}

/* Footer */

#layout-footer a {
outline: none;
text-decoration: none;
}
#layout-footer .credits {
  width: 50%;
  float: left; }
  #layout-footer .credits p {
    font-size: 16px; }
#layout-footer .social {
  width: 50%;
  float: right; }
  #layout-footer .social i {
    margin-right: 15px; }

/* MEDIA QUERIES */
@media (max-width: 1200px) {
  #layout-nav ul li {
    font-size: 1.5em; }
 }
@media (max-width: 995px) {
  .navbar-main {
    display: none; }
 #navbar-sub {
display: block; }

  .slicknav_menu {
    display: block;
    position: fixed;
    width: 100%; }
    .slicknav_menu a {
      font-size: 16px;
      font-family: 'Open Sans Condensed', sans-serif; }

  .container .column2, .container .column3 {
    width: 100%; }
    .container .column2 .name-function, .container .column3 .name-function {
      float: left;
      display: block;
      margin-right: 2.35765%;
      width: 31.76157%; }
      .container .column2 .name-function:last-child, .container .column3 .name-function:last-child {
        margin-right: 0; }
    .container .column2 p.klant, .container .column3 p.klant {
      padding-top: 20px; }

  .map {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 100%; }
    .map:last-child {
      margin-right: 0; }
    .map img {
      display: none; }
    .map p.route {
      margin-bottom: 50px; }

  .contactform {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 100%; }
    .contactform:last-child {
      margin-right: 0; } }
@media (max-width: 642px) {
    
}
@media (max-width: 455px) {
  h1 {
    text-align: center; }

  .header-1 {
    display: none; }

  .contact-main {
    display: none; }

  .header-2 {
    display: block;
    margin-top: -50px; }
.header-2 h2, .header-2 h3 {
      text-align: center; }
    .header-2 p {
      font-size: 12px; }
    .header-2 img {
      box-shadow: none;
      width: 80%;
      height: auto;
      margin-left: 10%;
      margin-right: 10%; }
}

  .container .column2 .name-function, .container .column3 .name-function {
    width: 100%; }
  .container .column2 p, .container .column3 p {
    padding-top: 0; }

  .lnxScrollToTop {
    display: none; }

  #layout-footer .social {
    float: right } }

/*# sourceMappingURL=werkaandewinkel.css.map */