/* CODE NANCY */

@import url('https://fonts.googleapis.com/css?family=PT+Sans:400,700');

@font-face {
  font-family: 'social';
  src: url('../_fonts/social.eot?69695409');
  src: url('../_fonts/social.eot?69695409#iefix') format('embedded-opentype'),
       url('../_fonts/social.woff2?69695409') format('woff2'),
       url('../_fonts/social.woff?69695409') format('woff'),
       url('../_fonts/social.ttf?69695409') format('truetype'),
       url('../_fonts/social.svg?69695409#social') format('svg');
  font-weight: normal;
  font-style: normal;
}
/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: 'social';
    src: url('../font/social.svg?69695409#social') format('svg');
  }
}
*/
 
 [class^="icon-"]:before, [class*=" icon-"]:before {
  font-family: "social";
  font-size: 35px; 
  font-style: normal;
  font-weight: normal;
  speak: none;
 
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: .2em;
  text-align: center;
  /* opacity: .8; */
 
  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;
 
  /* fix buttons height, for twitter bootstrap */
  line-height: 1em;
 
  /* Animation center compensation - margins should be symmetric */
  /* remove if not needed */
  margin-left: .2em;
 
  /* you can be more comfortable with increased icons size */
  /* font-size: 120%; */
 
  /* Font smoothing. That was taken from TWBS */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
 
  /* Uncomment for 3D effect */
  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
 
.icon-mail:before { content: '\e800'; } /* '' */
.icon-print:before { content: '\e801'; } /* '' */
.icon-right:before { content: '\e802'; } /* '' */
.icon-right-big:before { content: '\e803'; } /* '' */
.icon-right-small:before { content: '\e804'; } /* '' */
.icon-linkedin-squared:before { content: '\e805'; } /* '' */
.icon-down-dir:before { content: '\e806'; } /* '' */
.icon-up-dir:before { content: '\e807'; } /* '' */
.icon-down-open:before { content: '\e808'; } /* '' */
.icon-up-open:before { content: '\e809'; } /* '' */
.icon-link-ext:before { content: '\f08e'; } /* '' */
.icon-phone-squared:before { content: '\f098'; } /* '' */
.icon-menu:before { content: '\f0c9'; } /* '' */
.icon-pinterest-squared:before { content: '\f0d3'; } /* '' */
.icon-gplus-squared:before { content: '\f0d4'; } /* '' */
.icon-mail-alt:before { content: '\f0e0'; } /* '' */
.icon-angle-up:before { content: '\f106'; } /* '' */
.icon-angle-down:before { content: '\f107'; } /* '' */
.icon-instagram:before { content: '\f16d'; } /* '' */
.icon-file-pdf:before { content: '\f1c1'; } /* '' */
.icon-file-word:before { content: '\f1c2'; } /* '' */
.icon-facebook-1:before { content: '\f230'; } /* '' */
.icon-pinterest:before { content: '\f231'; } /* '' */
.icon-commenting:before { content: '\f27a'; } /* '' */
.icon-commenting-o:before { content: '\f27b'; } /* '' */
.icon-twitter-squared:before { content: '\f304'; } /* '' */
.icon-facebook-squared:before { content: '\f308'; } /* '' */
.icon-twitter:before { content: '\f309'; } /* '' */
.icon-facebook:before { content: '\f30c'; } /* '' */
.icon-gplus:before { content: '\f30f'; } /* '' */
.icon-linkedin:before { content: '\f318'; } /* '' */
.icon-instagram-1:before { content: '\f32d'; } /* '' */

body,
html { font-family: 'PT Sans', sans-serif !important; }
/* EINDE CODE NANCY */

A,
A.active,
A:hover { text-decoration: none; outline: none; border: 0; }

.container { max-width: 1170px; }
.content.container { min-height: 540px; }

/* CODE NANCY */
.navbar .navbar-collapse { align-self: flex-end; }
.navbar-nav .nav-link { color: #999 !important; font-size: 18px; font-weight: 400 !important; }
.navbar-nav .active > .nav-link,
.navbar-nav :hover > .nav-link,
.navbar-nav .nav-link.active,
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.show,
.navbar-nav .show > .nav-link { color: #da291c !important; }
.navbar-expand-lg .navbar-nav .nav-link { padding-right: 3px; padding-left: 3px; }

A.webportal { position: absolute; top: 15px; right: 62px; font-size: 14px !important; color: #fff !important; background-color: #999; padding: 5px 10px; }
A.active.webportal,
A:hover.webportal { background-color: #da291c !important; }

.content H1 { font-size: 30px !important; color: #da291c; font-weight: 700; font-family: 'PT Sans', sans-serif !important; margin-top: 0; padding: 0; }
.content H2 { font-size: 20px !important; color: #333; font-weight: 700; font-family: 'PT Sans', sans-serif !important; margin: 0; padding: 0; }
.content H3 { font-size: 20px !important; color: #da291c; font-weight: 400; font-family: 'PT Sans', sans-serif !important; margin: -0.67em 0 0 0; padding: 0 0 30px 0; }
.content P { font-size: 17px !important; color: #333; font-weight: 400; font-family: 'PT Sans', sans-serif !important; padding: 0 0 20px 0; }
.content SPAN { font-size: 17px !important; color: #333; font-weight: 400; font-family: 'PT Sans', sans-serif !important; padding: 0; }
.content A { font-size: 17px; color: #da291c; font-weight: 700; outline: none !important; text-decoration: none !important; border: 0; font-family: 'PT Sans', sans-serif !important; }
.content UL { margin: 0 0 30px 0; padding: 0; list-style: none; }
.content UL LI { font-size: 17px !important; color: #333; font-weight: 400; font-family: 'PT Sans', sans-serif !important; background-image: url(../_img/dothover.png); background-repeat: no-repeat; background-position: 2px 3px; padding-left: 12px; }
.content IMG { width: 100% !important; height: auto !important; }

.vacatureblok { background-color: #eee; padding: 20px 20px 0 20px; margin-bottom: 20px; }

iframe { border: 1px solid #ccc !important; -webkit-filter: grayscale(100%); filter: grayscale(100%); }

.fotobalk A.technischtekenen:hover H2, .fotobalk A.active.technischtekenen H2{ background-color: rgb(218,41,28,.85); }
.fotobalk A.informatiebeheer:hover H2, .fotobalk A.active.informatiebeheer H2 { background-color: rgb(153,0,0,.85);  }
.fotobalk A.veiligheid:hover H2, .fotobalk A.active.veiligheid H2 { background-color:  rgb(102,0,0,.85);  }
.fotobalk A.bim:hover H2, .fotobalk A.active.bim H2 { background-color: rgb(51,0,0,.85); }

.fotobalk A.technischtekenen H2 { background-color:  rgb(177,176,176,.85); }
.fotobalk A.informatiebeheer H2 { background-color:  rgb(131,131,131,.85); }
.fotobalk A.veiligheid H2 { background-color: rgb(102,102,102,.85); }
.fotobalk A.bim H2 { background-color: rgb(51,51,51,.85); }

.fotobalk A { background-size: cover; height: 200px; }
.fotobalk A:not(.active) { // hier alles grijs maken }
.fotobalk A::after { display: block; position: absolute; content: ""; background: rgb(218,41,28);
background: linear-gradient(180deg, rgba(218,41,28,.3) 0%, rgba(255,255,255,.3) 100%); width: 100%; height: 77%; }

.fotobalk A::before { display: block; content: ""; position: absolute; background-size: cover; background-repeat: no-repeat; left: 0; right: 0; bottom: 0; top: 0; -webkit-filter: grayscale(100%); filter: grayscale(100%); }

.fotobalk A.technischtekenen::before { background-image: url(../_img/vbenc-technisch-tekenen.jpg); }
.fotobalk A.informatiebeheer::before { background-image: url(../_img/vbenc-informatiebeheer.jpg); }
.fotobalk A.veiligheid::before { background-image: url(../_img/vbenc-veiligheid.jpg); }
.fotobalk A.bim::before { background-image: url(../_img/vbenc-bim.jpg); }

.fotobalk A:hover::before, .fotobalk A.active::before { filter: none; }
.fotobalk A H2 { font-size: 19px !important; color: #fff; font-weight: 400; padding: 12px 0; text-align: center; left: 0; right: 0; bottom: 0; position: absolute; }

/*.fotobalk a:hover h2 { text-decoration: underline; }*/

.content A.button { text-align: center; font-size: 22px; color: #fff; font-weight: 400; border: 1px solid #ff9900; display: block; background-color: #ff9900; padding: 10px; width: 210px; }
.content A:hover.button { background-color: #fff; color: #ff9900; }
.fancybox IMG { border: 1px solid #999; }

#deelblok H2 { font-size: 17px !important; color: #333 !important; font-weight: 400 !important; font-family: 'PT Sans', sans-serif !important; }
.klik SPAN { font-size: 14px !important; color: #999 !important; font-weight: 400 !important; font-family: 'PT Sans', sans-serif !important; }
#deelblok A:before { margin-left: 0 !important; }
#deelblok A { color: #999; }
#deelblok A:hover { color: #da291c; }

H3 { font-size: 20px !important; color: #da291c; font-weight: 700; font-family: 'PT Sans', sans-serif !important; margin: 0; padding: 0 0 10px 0; }
.card-img-top { border-radius: 0 !important; }
.card { margin-left: 0; border: 1px solid#999 !important; border-radius: 0 !important; }
A .card-body,
.card-body { opacity: 0.8; background-color: #da291c; position: absolute; bottom: 0; border: 1px solid #da291c !important; width: 100%; padding: 1rem 0.5rem; }
A:hover .card-body { opacity: 1; }
A:hover .card-title,
A:hover .card-text { color: #fff; text-decoration: none !important; outline: none !important; }
H4.card-title { font-size: 17px; font-weight: 700; color: #fff; margin: 0; }
P.card-text { font-size: 16px !important; color: #fff !important; font-weight: 400; margin-bottom: 0 !important; padding: 0 !important; }
.team IMG { border-top: 1px solid #999; border-right: 1px solid #999; border-left: 1px solid #999; }
.team H4.card-title { font-size: 15px !important; line-height: 0.2; background-color: #da291c; border: 1px solid #da291c !important; width: 100%; padding: 1rem; font-weight: 400; }
.team A.active H4.card-title,
.team A:hover H4.card-title { background-color: #999 !important; border: 1px solid #999 !important; }

.card-body.project { padding: 0.5rem 0.5rem; }
.card-body.project H4.card-title { font-size: 14px; }
.card-body.project P.card-text { font-size: 14px !important; }

footer { background-color: #ebebeb; }
footer IMG { width: 35%; }
footer H2 { color: #999; font-size: 16px; font-weight: 700; margin: 0; padding: 0; }
footer P { color: #999; font-size: 16px; font-weight: 400; }
footer A:hover { color: #da291c }
footer A, footer UL LI A { color: #999; font-size: 16px; font-weight: 400; }
footer UL { list-style: none; margin: 0; }
footer UL LI A { background-image: url('../_img/footerdot.png'); background-repeat: no-repeat; background-position: 0 4px; padding-left: 10px; }
footer UL LI A:hover { color: #da291c; background-image: url('../_img/footerdothover.png'); text-decoration: none !important; }
footer B { color: #999; font-size: 16px; font-weight: 700; }

.infobalk { background-color: #fff; }
.infobalk P,
.infobalk A { font-size: 16px !important; color: #999; font-weight: 400 !important; padding: 10px 0 0 0; }
.infobalk A:hover { color: #da291c; }
.infobalk IMG { margin: 0 2px; }

.subnav h2 { font-size: 20px; font-weight : 700; color: #333; }
.subnav ul { margin : 0; padding : 0; list-style: none; }
.subnav ul li { font-size: 17px; color: #999; font-weight: 400; background-image: url(../_img/dot.png); background-repeat: no-repeat; background-position: 0 3px; padding-left: 10px; }
.subnav UL LI A { color: #999; font-weight: 400 !important; }
.subnav ul li:hover,
.subnav ul li.active { color: #da291c; font-weight: 700; background-image: url(../_img/dothover.png); }
.subnav ul li:hover A, .subnav ul li.active A { color: #da291c; }

.referenties a { display : block; width : 25%; padding-bottom: 66%; background-image: cover; background-position: center }

.btn-primary { background-color: #da291c; border-color: #da291c; border-radius: 0; }
.form-control { color: #333; border-radius: 0; }

button:focus { outline: 0 !important; }

.arrow { font-size: 26px; line-height: 0 }
.arrow:hover { text-decoration: none }

/* 11-11-2019 AANPASSING WEBSITE */
.blog { background-color: #999; }
.blog H2 { font-family: 'PT Sans', sans-serif !important; font-size: 25px; font-weight: 700 !important; color: #fff; padding: 0; margin: 0; }
.vacature { background-color: #ccc; }
.vacature H2 { font-family: 'PT Sans', sans-serif !important; font-size: 30px; font-weight: 700 !important; color: #da291c; padding: 0; margin: 0; }
.vacature H3 { font-family: 'PT Sans', sans-serif !important; font-size: 20px; font-weight: 700 !important; color: #da291c; padding: 10px 0 0 0; margin: 0; }
.blog P,
.vacature P { font-family: 'PT Sans', sans-serif !important; font-size: 16px; font-weight: 400 !important; color: #000; padding: 20px 0; margin: 0; }
.blog A,
.vacature A { color: #da291c; }
.blog A.btn,
.vacature A.btn { color: #ff9900; border: 1px solid #ff9900; background-color: #fff; width: 210px; padding: 10px; text-align: center; font-size: 20px; font-family: 'PT Sans', sans-serif !important; font-weight: 400; border-radius: 0; }
.blog A:hover.btn,
.vacature A:hover.btn { background-color: #ff9900; color: #fff; }
.vacature IMG { border-radius: 50%; }

blockquote { font-family: 'PT Sans', sans-serif !important; font-size: 16px; font-weight: 700 !important; color: #000; padding: 20px 0 0 0; margin: 0; }
.quoteblok H2 { font-family: 'PT Sans', sans-serif !important; font-size: 16px !important; font-weight: 700 !important; color: #da291c; padding: 0; margin: 0; }

.teamlid { border-radius: 50%; }

/* ADMIN */
#admindiv { background-color:#eeeeee; filter:alpha(opacity=75); -moz-opacity:.75; opacity:.75; position:fixed; border:1px solid #000; width : 250px; top : 150px; right: 10px; z-index: 1000; }
#admindiv .header { padding:2px; background-color:#e32322; color:#FFF; font-weight:bold; background-image : url(/_images/generic/sitemanager.png); background-repeat : no-repeat; background-position : 232px 0px; height : 25px; border-bottom : 1px solid #000; }
#admindiv .header SPAN A { color:#FFF; font-weight:bold; text-decoration : none; }
#admindiv .body { padding:4px; }
#admindiv .body A { color : #000; font-weight : bold; }
#admindiv .body LI { list-style: none; }

/* MEDIA QUERIES */
@media (max-width: 575px) {
    #admindiv { display : none }
    h2 { font-size: 1.2rem }
    
    .fotobalk IMG { display: none; }
    .mobielsm { justify-content: flex-start !important; padding-left: 5px; }
    .afstand { margin: 0 5px; }
    .subnav { text-align: center; }
    .subnav UL LI,
    .subnav UL LI.active,
    .subnav UL LI:hover { background-image: none; }
	.navbar-nav { text-align: center; background-color: #eee; margin: 20px 0; }
	.navbar-nav .nav-link { border-bottom: 2px solid #fff; }
	.card { margin-bottom: 10px; }
	.content.container { margin: 20px 0 0 0; }
	A.webportal { width: 100%; right: 0 !important; top: 0; text-align: center; }
	.navbar-brand { margin-right: 0; padding-top: 2rem; }
	
	.fotobalk A { height: 50px; }
	.fotobalk A::before,
	.fotobalk A::after { display: none; }
	
}