/*--algemene styling--*/

html, body {
			max-width: 100%;
			overflow-x: hidden;
			}
body{
	background-color: rgba(246,246,246,0);
}

.sublimStandout img{
	display: block;
	margin: 0 auto;
}

/*--diensten--*/
.carousel .item {
	height: 450px;
	background-size: cover;
}

/*--home quotes--*/
/* Slideshow container */
#klantenquotes .slideshow-container, .contactdata {
  position: relative;
  background: #f6f6f6;
}


/* Slides */
#klantenquotes .mySlides {
  display: none;
  padding: 254px;
  text-align: center;
	padding-top: 0px;
    padding-bottom: 50px;
}

/* Next & previous buttons */
#klantenquotes .prev, #klantenquotes .next {
  cursor: pointer;
  position: absolute;
  width: auto;
  padding: 16px;
  color: #34627c;
  font-weight: bold;
  font-size: 20px;
  border-radius: 0 3px 3px 0;
  user-select: none;
	bottom: -13%;
}

/* Position the "next button" to the right */
#klantenquotes .next {
  position: absolute;
  right: 0%;
  border-radius: 3px 0 0 3px;
}
/* The dot/bullet/indicator container */
#klantenquotes .dot-container {
  text-align: center;
  padding: 20px;
  background: #34627c;

}
/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #f6f6f6;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

/* Add a background color to the active dot/circle */
.active, .dot:hover {
  background-color: #163a45;
}

/*--webdesign--*/

.resp-container {
}
.resp-iframe {
   	width: 100%;
    height: 100%;
    border: 0;
    min-height: 650px;
    margin-bottom: 5%;
}
#webdevPartTwo.iFrameswebs{
	padding-bottom: 5%;
    padding-top: 3%;
}

#introhome{
	overflow-y: hidden;
}
#introhome ul.introVrdlen{
	    margin-bottom: 5%;
}

.slider .dots{
	display:none;
}


h1.PaginaTitel{
	  font-weight: 400;
  font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
  font-size: 44px;
  text-transform: uppercase;
  letter-spacing: 0.25em;
	color:#ffffff;
}

.page_title_container {
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

#webdevPartOne .row #privacyTxt ul li{
	list-style: none;
}

#webdevPartOne .row #privacyTxt ul li a{
	color: #ffffff;
	
}

section#websitesBySW{
	width: 100%;
    height: 450px;
    background-image: url("../images/home_bannerv2.jpg");
    background-repeat: no-repeat;
    background-size: cover;
  	margin-bottom: 5%;
    background-position: bottom;
}

img.voorbeeldNbrf{
	margin-bottom: 5%;
}

p a{
	color: #00B1E4;
}

a.telePhone:hover, a.mailSublim:hover, a.telePhone:focus, a.mailSublim:focus {
	text-decoration: none;
}
#introhome h1{
	color: #25221d;
    font-weight: 400;
    font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
    font-size: 44px;
}
#introhome h2, #webdevPartOne h2, #webdevPartTwo h2, #webdevPartThree h2, #diensten h2{
    color: #25221d;
    font-weight: 400;
	font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
	font-size: 28px;
}

#introhome ul, #diensten ul, #webprojectBase ul{
	 padding-left: 7%;
}
   

#introhome ul li, #webprojectBase ul li{
	text-align: left;
    color: #c4c4c4;/* of #ffffff */
    font-weight: 400;
    font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
    margin-bottom: 12px;
    letter-spacing: 0.1em;
    line-height: 32px;
	list-style-type: disc;
}


#diensten h3{
	color: #34627c;
	display: inline-block;
    text-transform: uppercase;
}
#diensten ul.dienstenOpsomming{
	padding-left: 2%;
}

#diensten ul.dienstenOpsomming li.webDevdienst{
	text-transform: uppercase;
	font-size: 18px;
}
#diensten ul.dienstenOpsomming li.webDevdienst ul li{
	text-transform: initial;
	font-size: initial;
}

#diensten ul li{
	text-align: left;
    color: #464646;
    font-weight: 400;
    font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
    margin-bottom: 27px;
    letter-spacing: 0.1em;
    line-height: 32px;
	list-style: none;
}
#diensten ul li ul li{
	text-align: left;
    color: #464646;
    font-weight: 400;
    font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
    margin-bottom: 27px;
    letter-spacing: 0.1em;
    line-height: 32px;
	list-style-type: disc;
}

li.dienstTwee, li.dienstDrie{
	width: 45%;
    float: left;
}


#webprojectBase{
	background: #34627c;
    padding: 2%;
    text-align: center;
    color: #ffffff;
	margin-bottom: 0%;
}

#webprojectBase .row{
	max-width: 1250px;
    margin: 0 auto;
}

#webprojectBase .row p{
	color: #ffffff;
    text-align: center;
    font-size: 18px;
}

#webprojectBase .row ul li b{
	color: #25221d;
}

p.readmore{
	max-width: 100%;
    margin: 0 4.5%;
	padding-top: 2%;
}
p.readmore a{
	color: #ffffff;
}

p.readmore a:hover, p.readmore a:focus{
	color: #ffffff;
	text-decoration: underline;
}


#webprojectBase ul{
	margin: 0 10%;
}

#webprojectBase ul li{
	color: #25221d;
    list-style-type: disc;
    font-size: 16px;
    text-transform: uppercase;
}


/*--diensten pagina--*/
p.contactBanner{
	font-size: 18px;
    letter-spacing: 2.5px;
}



/*--webdesign pagina--*/


/*--
section#titelVernieuwenWebdesign{
	width: 100%;
    height: 100%;
    background-image: url("../images/titel_webdesign.jpg");
    background-repeat: no-repeat;
    background-size: cover;
  	min-height: 800px;
    margin-bottom: 5%;
    margin-top: 5%;
    background-position: 0 0;
}
--*/

section#titelVernieuwenWebdesign {
    width: 45%;
    height: 480px;
    background-image: url(../images/titel_webdesign.jpg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: 0 0;
    float: left;
}


#webdevPartOne .row p, #webdevPartOne h2{
	float: left;
    display: block;
    width: 100%;
}
#webdevPartOne .row p.textVernieuwenWebdesign{

	/*background-color: rgba(195,159,148,0.6); */
	background-color: #313131;
	color: #ffffff;
    float: left;
    text-align: inherit;
    width: 50%;
    margin-left: 2%;
    padding: 3%;
	line-height: 37px;
}


#webdevPartOne ul, ul.introVrdlen{
	background-color: #313131; /*-- of #163a45 met color white --*/
    color: #fff;
    float: left;
    text-align: inherit;
    width: 60%;
    margin-left: 0%;
    padding: 2%;
    padding-left: 4%;
}




#webdevPartTwo.projStreek h3{
	max-width: 45%;
	margin: 0 auto;
	margin-top: 9%;
	color: #25221d;
	font-weight: 400;
	font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
}
.slide figure h3 {
    word-spacing: -0.15em;
    font-weight: 300;
    font-size: 18px;
    line-height: 28px;
}
figure.effect-steve h3 {
    position: relative;
    margin-top: 2em;
    padding: 0.25em;
}

figure.effect-steve h3{
    background: #fff;
   
}

.voorbeeldtechn.col-lg-4, .voorbeeldtechn.col-md-4{
	padding-left: inherit;
	padding-right: 6%;
}

.example {
    float: left;
    width: 350px;
    height: 350px;
    line-height: 350px;
    text-align: center;
    background: #efefef;
    transition: background .5s;
	position:relative;
}
.example img {
    display: inline-block;
    vertical-align: middle;
}
#webdevPartThree .row .example p{
	position: absolute;
    bottom: 0;
    left: 0;
    padding: 30px;
	letter-spacing: 1px;
	text-align: center;
   	font-size: 21px;
	font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
	color: #f6f6f6;
	margin-bottom: 0px;
	text-transform:uppercase;
}

#webdevPartThree.otherServices .row .example p{
	bottom: 8%;
	left: 28%;
	padding: inherit;
}

#webdevPartThree.otherServices .row .example p.langereT{
	left: 16%;
}

#actieveRegio{
	text-align:center;
}
#actieveRegio img{
	max-height: 185px;
	display: inline-block;
}
#pluspunten_block_webontw h3, #pluspunten_block_webontwTwo h3{
	padding-top: 5%;
	display: inline;
}

/*--of tablet afb voor regio tekst--
#pluspunten_block_webontw h3{
	display: inline-block;
	background: #34627c;
	min-height: 185px;
	margin-left: -0.5%;
	padding: 0 2%;
	padding-top: 5.9%;

}
*/



h3{
/*design 1 color: #ffffff; */
color:	#34627c;
font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
font-weight: 400;
letter-spacing: 0.1em;
line-height: 32px;
}


/*--webontwikkeling pagina--*/
.adminPhoto{
	padding-bottom: 2%;
}
.textAdmin{
	float: left;
    padding-top: 3%;
}
#webdevPartOne #technexampl{
	margin-bottom: 5%;
}
#technholder{
	margin-bottom:3%;
}

#webdevPartOne h2.seoparagr{
	padding-top: 4%;
}


#webdevPartTwo #technexampl{
	margin-bottom: 5%;
}


.voorbeeldtechn.col-lg-12, .voorbeeldtechn.col-md-12{
	padding-left: inherit;
	padding-right: 6%;
}
#webdevPartTwo .row .voorbeeldtechn figure p {
    letter-spacing: 1px;
    font-size: 68.5%;
	text-align: center;
	/*font-weight: 800;*/
	
}

#webdevPartTwo ul#CMScomp{
	width: 25%;
	float: left;
}

img#adminp{
	float: right;
	width: 50%;
	margin-right: 11%;
}


#technholder img{
	max-height: 210px;
    padding-right: 3%;
}

#webdevPartTwo ul, #webdevPartThree ul{
	list-style: disc;
    padding-left: 15px;
    margin-left: 5%;
    margin-bottom: 27px;
    letter-spacing: 0.1em;
    line-height: 32px;
    font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
}
#webdevPartOne ul{
	list-style: disc;
    margin-bottom: 27px;
    letter-spacing: 0.1em;
    line-height: 32px;
    font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
}
#pluspunten_block_webontw{
	background: #25221d;
    padding: 50px 0 64px;
}
#pluspunten_block_webontwTwo{
	/*design 1 background: #25221d; */
	background: #f4f4f4;
    padding: 50px 0 64px;
}
.sterkte{
	margin: auto;
	text-align: center;
}

.sterkte i{
	color: #34627c;
	font-size: 31px;
}
#pluspunten_block_webontw .sterkte .detail{
	color: #ffffff;
	font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
	font-weight: 400;
	letter-spacing: 0.1em;
    line-height: 32px;
}
.clear{
	clear:both;
}


/*-----------------*/
/***** Steve *****/
/*-----------------*/


.slide figure {
    position: relative;
    float: left;
    overflow: hidden;
    margin: 10px 1%;
	 
    text-align: center;
    cursor: pointer;
}

figure.effect-steve {
	z-index: auto;
	overflow: visible;
	background: #000;
}

figure.effect-steve:before,
figure.effect-steve h2:before,  figure.effect-steve h3:before{
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
	background: #000;
	content: '';
	-webkit-transition: opacity 0.35s;
	transition: opacity 0.35s;
}

figure.effect-steve:before {
	box-shadow: 0 3px 30px rgba(0,0,0,0.8);
	opacity: 0;
}

figure.effect-steve figcaption {
	z-index: 1;
}

figure.effect-steve img {
	opacity: 1;
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
	-webkit-transform: perspective(1000px) translate3d(0,0,0);
	transform: perspective(1000px) translate3d(0,0,0);
	min-height: 350px;
}

figure.effect-steve h2,
figure.effect-steve p {
	background: #fff;
	color: #2d434e;	
    font-family: 'Raleway', Arial, sans-serif;
}

figure.effect-steve h2 {
	position: relative;
	margin-top: 11em;
	padding: 0.25em;
}

figure.effect-steve h2:before,  figure.effect-steve h3:before{
	box-shadow: 0 1px 10px rgba(0,0,0,0.5);
}

figure.effect-steve p {
	margin-top: -22em;
	padding: 0.5em;
	font-weight: 800;
	opacity: 0;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: scale3d(0.9,0.9,1);
	transform: scale3d(0.9,0.9,1);
}

figure.effect-steve:hover:before {
	opacity: 1;
}

figure.effect-steve:hover img {
	-webkit-transform: perspective(1000px) translate3d(0,0,21px);
	transform: perspective(1000px) translate3d(0,0,21px);
}

figure.effect-steve:hover h2:before,  figure.effect-steve:hover h3:before{
	opacity: 0;
}

figure.effect-steve:hover p {
	opacity: 1;
	-webkit-transform: scale3d(1,1,1);
	transform: scale3d(1,1,1);
}






.voorbeeldtechn figure figcaption > a {
    z-index: 1000;
    text-indent: 200%;
    white-space: nowrap;
    font-size: 0;
    opacity: 0;
}
.voorbeeldtechn figure figcaption, .voorbeeldtechn figure figcaption > a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.voorbeeldtechn figure figcaption {
    padding: 2em;
    color: #fff;
    text-transform: uppercase;
    font-size: 1.25em;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.voorbeeldtechn figure h2 {
    word-spacing: -0.15em;
    font-weight: 300;
	font-size: 18px;
	line-height: 28px;
}

#webdevPartOne .row .voorbeeldtechn figure p {
    letter-spacing: 1px;
    font-size: 68.5%;
	text-align: center;
	/*font-weight: 800;*/
	
}

.voorbeeldtechn figure h2 span,  .voorbeeldtechn figure h3 span{
    font-weight: 800;
	font-size: 14px;
	display:block;
}

/*--effect social media op hover img--*/
/*-----------------*/
/***** Winston *****/
/*-----------------*/

figure.effect-winston {
	background: #162633;
	text-align: left;
	margin-top: 19%;
}

figure.effect-winston img {
	-webkit-transition: opacity 0.45s;
	transition: opacity 0.45s;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

figure.effect-winston figcaption::before {
	position: absolute;
	bottom: 4px;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(../images/triangle.svg) no-repeat center center;
	background-size: 100% 100%;
	content: '';
	-webkit-transition: opacity 0.45s, -webkit-transform 0.45s;
	transition: opacity 0.45s, transform 0.45s;
	-webkit-transform: rotate3d(0,0,1,45deg);
	transform: rotate3d(0,0,1,45deg);
	-webkit-transform-origin: 0 100%;
	transform-origin: 0 100%;
}

figure.effect-winston h2 {
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
	-webkit-transform: translate3d(0,20px,0);
	transform: translate3d(0,20px,0);
}

figure.effect-winston p {
	position: absolute;
	right: 10px;
    bottom: -25px;
	padding: 0 1.5em 7% 0;
}

figure.effect-winston a {
	margin: 0 10px;
	color: #5d504f;
	font-size: 170%;
}

figure.effect-winston a:hover,
figure.effect-winston a:focus {
	color: #34627c;
}

figure.effect-winston p a i {
	opacity: 0;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: translate3d(0,50px,0);
	transform: translate3d(0,50px,0);
}

figure.effect-winston:hover img {
	opacity: 0.6;
}

figure.effect-winston:hover h2 {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

figure.effect-winston:hover figcaption::before {
	opacity: 0.7;
	-webkit-transform: rotate3d(0,0,1,20deg);
	transform: rotate3d(0,0,1,20deg);
}

figure.effect-winston:hover p i {
	opacity: 1;
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

figure.effect-winston:hover p a:nth-child(3) i {
	-webkit-transition-delay: 0.05s;
	transition-delay: 0.05s;
}

figure.effect-winston:hover p a:nth-child(2) i {
	-webkit-transition-delay: 0.1s;
	transition-delay: 0.1s;
}

figure.effect-winston:hover p a:first-child i {
	-webkit-transition-delay: 0.15s;
	transition-delay: 0.15s;
}

/*--styling knoppen site--*/

.buttonsublim {
  --offset: 10px;
  --border-size: 2px;
  display: block;
  position: relative;
  padding: 0.8em 2em;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: 0;
  background: transparent;
  color: #00B1E4;
  text-transform: uppercase;
  letter-spacing: 0.25em;
  cursor: pointer;
  outline: 0 !important;
  font-weight: bold;
  border-radius: 0 !important;
  box-shadow: inset 0 0 0 var(--border-size) currentcolor;
  transition: background 0.8s ease;
}
 
.buttonsublim a{
	color: #00B1E4;
	font-weight: bold;
	text-transform: uppercase;
  letter-spacing: 0.25em;
	
}

.buttonsublim:hover, .buttonsublim:hover a {
  background: rgba(245, 247, 247, 0.4);
	color: #34627c;
	text-decoration: none;
}

.buttonsublim a:hover, .buttonsublim a:focus{
	color: #34627c;
	text-decoration: none;
}
.button__horizontal, .button__vertical {
  position: absolute;
  top: var(--horizontal-offset, 0);
  right: var(--vertical-offset, 0);
  bottom: var(--horizontal-offset, 0);
  left: var(--vertical-offset, 0);
  transition: transform 0.8s ease;
  will-change: transform;
}
.button__horizontal::before, .button__vertical::before {
  content: "";
  position: absolute;
  border: inherit;
}
.button__horizontal {
	--vertical-offset: calc(var(--offset) * -1);
  border-top: var(--border-size) solid currentcolor;
	border-bottom: var(--border-size) solid currentcolor;
}
.button__horizontal::before {
  top: calc(var(--vertical-offset) - var(--border-size));
  bottom: calc(var(--vertical-offset) - var(--border-size));
  left: calc(var(--vertical-offset) * -1);
  right: calc(var(--vertical-offset) * -1);
}
.buttonsublim:hover .button__horizontal {
  transform: scaleX(0);
}
.button__vertical {
  --horizontal-offset: calc(var(--offset) * -1);
  border-left: var(--border-size) solid currentcolor;
  border-right: var(--border-size) solid currentcolor;
}
.button__vertical::before {
  top: calc(var(--horizontal-offset) * -1);
  bottom: calc(var(--horizontal-offset) * -1);
  left: calc(var(--horizontal-offset) - var(--border-size));
  right: calc(var(--horizontal-offset) - var(--border-size));
}
.buttonsublim:hover .button__vertical {
  transform: scaleY(0);
}

button:hover, button:focus{
	color:#00B1E4;
	box-shadow: inset 0 0 0 var(--border-size) currentcolor; 
}

button:hover{
	-webkit-border-radius: 0 !important;
     -moz-border-radius: 0 !important;
          border-radius: 0 !important;
}

button:focus{
  outline: 0 !important;
 -webkit-border-radius: 0 !important;
     -moz-border-radius: 0 !important;
          border-radius: 0 !important;
  
}



/* Fading animation klantenquotes */
.mySlides.fade{
	 opacity:inherit;
}

.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
 
}

@-webkit-keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}


/*--styling header--*/
body:not([class*='no-hero-image']) #MainMenu.navbar {
   /*background: #f6f6f6;*/
	background: rgba(246,246,246,0);
}
#MainMenu.navbar {
      min-height: 120px;
}
.container-fluid, #SubMenu.affix .container {
    min-height: 120px;
}
.container>.navbar-header, .container-fluid>.navbar-header, .container>.navbar-collapse, .container-fluid>.navbar-collapse {
   text-transform: capitalize;
	min-height: 120px;
}

.navbar-nav>li>a {
    padding-top: 54px;
}

#MainMenu.navbar #navbar-main .navbar-nav>li>a:hover, #MainMenu.navbar #navbar-main .navbar-nav>li>a:focus {
	color: #25221d;
}

/*--styling image home--*/
.hero{
	    height: 650px;
}


/*--klanten quotes section en contactgeg--*/

#klantenquotes .row, #contactgeg .row{
	margin: 0 auto;
}
.navbar-default .navbar-brand {
    color: #f6f6f6;
	min-height: 120px;
}
.navbar-brand {
    font-size: 52px;
    font-weight: 300;
    padding: 16px 20px;
    line-height: 30px;
	height: 72px;
}
.navbar-brand img {
    max-height: 123px;
    width: auto !important;
    height: auto !important;
    vertical-align: middle;
}

#MainMenu.navbar #navbar-main .navbar-nav {
    -webkit-transition: all 0.3s ease 0.1s;
    -o-transition: all 0.3s ease 0.1s;
    transition: all 0.3s ease 0.1s;
    text-transform: capitalize;
    min-height: 120px;
}
.navbar-nav>li {
    float: left;
    text-transform: capitalize;
}
#MainMenu.navbar #navbar-main .navbar-nav>li>a {
    border-top: solid 2px transparent;
    text-transform: uppercase;
    font-weight: 700;
}

.navbar-default .navbar-nav>li>a {
    color: #34627c;
}






/* Add a background color to the active dot/circle */
.active {
  background-color: #163a45;
}

.image .image__caption {
	background-color: #fff;
}

/* Add an italic font style to all quotes */
q {font-style: italic;
    color: #1A2B49;
    font-size: 24px;
    line-height: 48px;
    padding: 0 0 8px;
    text-align: left;
    font-weight: 500;}


.author {color: #1A2B49;
    font-size: 18px;
    line-height: 48px;
    padding: 0 0 8px;
    font-weight: 500;
}

.author a{
	color: #FF5533;
}

/*--styling introtekst home--*/

#introhome, #webdevPartOne, #webdevPartTwo, #webdevPartThree, #offerteformulier{
	  padding: 4%;
}
#webdevPartThree.otherServices{
	padding-top:2%;
	padding-bottom: 7%; /*--alle pagina's behalve home onderaan deze paddingbot--*/
}

#webdevPartTwo.onderhoudWebs{
	padding-bottom: 7%; /*--alle pagina's behalve home onderaan deze paddingbot--*/
	
    padding-top: 2%;

}
  
#introhome .row, #webdevPartOne .row, #webdevPartTwo .row, #pluspunten_block_webontw .row, #pluspunten_block_webontwTwo .row, #webdevPartThree .row, #offerteformulier .row{
	margin: 0 auto;
    max-width: 1250px;
}

#introhome .row p, #webdevPartOne .row p, #webdevPartTwo .row p, #webdevPartThree .row p{
	text-align: left;
	color: #464646;
    font-weight: 400;
    font-family:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
	margin-bottom: 27px;
	letter-spacing: 0.1em;
    line-height: 32px;
}

#introhome .row figcaption p{
	margin-bottom: 1%;
}

/*--footer content--*/
a#lidFeweb img{
	margin-top: -10%;
	margin-right: 11%;
}
footer{
	background-color: #34627c;
}

footer .footer-content {
    padding-top: 55px;
	padding-bottom:57px;
}
.footer-content .container,  .footer-bottom .container{
    width: 1200px;
}
.row.footerRow {
    margin: 0;
}
.bboxfooter {
    width: 25%;
    display: inline-block;
    vertical-align: top;
    float: left;
}
.bboxfooter.bboxfooter3 {
    display: none;
}
.bboxfooter h4.title-footer {
    font-size: 16px;
    color: #25221d;
    font-family: 'Lato-Bold';
    padding-bottom: 0;
    margin-bottom: 28px;
    text-transform: none;
	margin-top: inherit;
}
.spfooterlinks h4.title-footer, .spfooterlinks h4.title-footer span {
	font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
    font-size: 14px;
    color: #163a45;
    font-weight: bold;
    text-transform: uppercase;
    margin: 0 0 13px 0;
    padding-bottom: 20px;
    position: relative;
	background: white;
    padding: 2%;
    margin-right: 35%;
}
.spfooterlinks ul.links {
    padding: 0;
}
.bboxfooter ul.links li, .bboxfooter ul li {
    padding: 0 0 4px;
}
.bboxfooter ul li a, .bboxfooter ul li {
    color: #f6f6f6 !important;
    font-size: 16px;
        font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
}
.spfooterlinks ul.links li a {
    color: #fff;
    position: relative;
}
.spfooterlinks ul.links li a:before {
    content: '';
    margin: 0;
}

.tel_data {
    display: none;
}
.bboxfooter.bboxfooter5 .tel {
    position: relative;
}
.bboxfooter.bboxfooter5 .Email, .bboxfooter.bboxfooter5 .Faceb, .bboxfooter.bboxfooter5 .blog {
    margin-top: 20px;
}
.bboxfooter.bboxfooter5 .tel:before {
    content: "";
    transform: rotate(90deg);
    filter: invert(100%) !important;
    /*background-image: url(../img/new2019_svg/phone-solid.svg);*/
}
.bboxfooter.bboxfooter5 .tel span {
    font-size: 21px;
    color: #fff;
   
}
.bboxfooter.bboxfooter5 .Email .title {
    display: inline-block;
    width: 90px;
    float: left;
    font-size: 11.5px;
    color: #f6f6f6;
	letter-spacing: -0.2px;
}


.bboxfooter.bboxfooter5 .Email .des,  .bboxfooter.bboxfooter5 .Faceb .des, .bboxfooter.bboxfooter5 .blog .des{
    float: left;
    font-size: 14px;
    color: #f6f6f6;
}
.bboxfooter.bboxfooter5 .Email .des a, .bboxfooter.bboxfooter5 .Faceb .des a, .bboxfooter.bboxfooter5 .blog .des a {
    color: #f6f6f6;
}
.bboxfooter.bboxfooter5 .blog .des{
	padding-left: 10%;
    min-width: 41%;
}

.bboxfooter.bboxfooter5 .blog .des .fa{
	padding-right: 10%;
}
 
.bboxfooter.bboxfooter5 .Faceb .des{
	min-width: 55%;
}

.bboxfooter.bboxfooter5 .Faceb .des .fa{
	padding-right: 4%;
}



/*--copywright bar--*/

footer .footer-bottom {
    padding: 0;
	position: relative;
}
footer .footer-bottom .row {
    margin: 0;
}
.footer_l.col-xs-4 {
    float: left;
    text-align: left;
    padding: 0;
    vertical-align: sub;
    margin-bottom: 2%;
}


footer .footer-bottom .copyright {
    padding: 0;
    color: #fff;
    font-size: 12px;
    float:left;
}
.Copy{
	    max-width: 55%;
}
.Privbel{
	max-width: 12%;
}
.AlgVw{
	max-width: 30%;
	margin-top: -1%;
}
.fa.fa-file-pdf-o {
	padding-right: 4%;
}
.footer-bottom .copyright, .footer-bottom .copyright a {
    color: #f6f6f6 !important;
    font-weight: 500;
}
.footer-bottom .copyright span {
    color: #25221d;
}

ul.adresSublim{
	padding-top: 6%;
    float: left;
    display: block;
}

/*
footer, a.pr {



    color: #e7eef4;

    margin: 0;



}

a.pr {

	display:inline;

}



footer .bottom-bar {



    position: relative;

    text-align: center;

    font-size: 0.8em;

    text-transform: uppercase;

    background: #25221d;

    padding: 15px 0;
	color: #e7eef4;



}

footer a{

	color:#e7eef4;

}

footer a:hover{

	color:#f2f2f2;

	text-decoration: underline;

}
*/

/*--contact--*/
.navbar-nav>li.active>a {
   padding-bottom: 34px;

}

.navbar-nav>li.active{
		background-color: #34627c;
}
.navbar-nav>li.active:hover{
		background-color: #163a45;
}

#MainMenu.navbar #navbar-main .navbar-nav>.active>a, #MainMenu.navbar #navbar-main .navbar-nav>.active>a:hover{
	color: #ffffff;
	
}
/*--effect contactpagina laden--*/

body:not([class*='no-hero-image']) #MainMenu.navbar {
    margin-bottom: 0px;
}
/* CONTAINER
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/*.navbar-wrapper {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.navbar-wrapper > * {
  padding: 20px;
}

*/




/* MAIN
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.page-main {
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex-grow: 1;
  min-height: 350px;
  background: #34627c
    url("../images/contact-us-happy-businessman-holding-mobile-smartphone-with-mail-phone-email-icons.jpg") no-repeat
    center / cover;
  background-blend-mode: luminosity;
  color: #f2f2f2;
}

.page-main div {
  max-width: 500px;
}

.page-main h1 {
  margin-bottom: 10px;
	color: #163a45;;
    font-weight: 400;
    font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
	font-size: 36px;
}



.page-main p + p {
  margin-top: 10px;
}




/* MQ
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@media screen and (min-width: 550px) {
  .page-header ul {
    width: auto;
    margin-top: 0;
  }

 
}

@media screen and (min-width: 768px) {
 
  .page-main {
    padding-left: 18.5%;
  }
}

/* ANIMATIONS
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.page-header .container > *,
.page-main,
.page-footer > * {
  opacity: 0;
}

.page-header,
.page-footer,
.page-main .text-wrapper {
  overflow: hidden;
}

.page-header .container > * {
  transform: translateY(-30px);
}



.page-header {
  position: relative;
}

.page-header::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: #34627c;
  z-index: 99999;
  transform: scaleX(0);
}

.page-main .text-wrapper + .text-wrapper {
  margin-top: 10px;
}

.page-main .text-wrapper * {
  transform: translateY(120%);
}

.page-main .p-wrapper * {
  transform: translateY(-120%);
}

.loaded .page-header::after {
  animation: scaleIn 1.3s ease-in 0.2s forwards;
}

.loaded .page-main {
  animation: fadeIn 1s ease-in 0.7s forwards;
}

.loaded .page-header .container > *,
.loaded .page-footer > * {
  animation: fadeIn 1s ease-in 0.7s forwards, slideIn 0.8s ease-in 0.9s forwards;
}

.loaded .page-main .text-wrapper * {
  animation: slideIn 0.6s cubic-bezier(0.54, 0.46, 0.54, 0.94) 2s forwards;
	color: #34627c;
}

@keyframes fadeIn {
  60% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes scaleIn {
  100% {
    transform: scaleX(1);
  }
}

@keyframes slideIn {
  100% {
    transform: translateY(0);
  }
}

.contactdata{
	background: #ffffff;
}
.contactdata ul{
	    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0 -15px;

}

.contactdata ul li {
    width: 50%;
    padding: 0 15px;
	list-style: none;
	font-size: 18px;
}

 .contactdata ul li strong {
    font-weight: bold;
}

.contactdata ul li a, .contactdata ul li {
    text-decoration: none;
   	color: #464646;
    font-weight: 400;
    font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
    padding-bottom: 5px;
    
    
}

.contactdata ul li a:hover {
	text-decoration: none;
	color: #34627c;
}

#offerteformulier h3{
	color: #25221d;
    font-weight: 400;
    font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
}


/*--formulier stylen--*/

#formulier label {
    display: block;
    margin: 0 0 0.5em 0;
    color: #4f6fad;
    font-size: 1em;
}
#formulier input {
    margin: 0 0 0.5em 0;
    border: 1px solid #ccc;
    padding: 6px 10px;
    color: #555;
    font-size: 1em;
	background-color: #ffffff;
	max-width: 65%;
}
#formulier textarea {
    border: 1px solid #ccc;
    padding: 6px 10px;
    width: 100%;
    color: #555;
	background-color: #ffffff;
	max-width: 65%;
	min-height: 180px;
}


[type=submit], [type=reset], button, html [type=button] {
    -webkit-appearance: button;
}
#formulier .btn.btn-submit {
    background-color: #4f6fad;
    border-bottom-color: #374d78;
}
#formulier .btn {
    font-size: 1.0625em;
    display: inline-block;
    padding: 0.74em 1.5em;
    margin: 1.5em 0 0;
    color: #fff;
    border-width: 0 0 0 0;
    border-bottom: 5px solid;
    text-transform: uppercase;
    background-color: #b3b3b3;
    border-bottom-color: #8c8c8c;
    font-family: 'Lato', sans-serif;
    font-weight: 300;
}
#formulier .btn.btn-submit:hover {
    background-color: #5f7db6;
}
#formulier h6 {
    font-weight: bold;
    font-size: 15px;
    line-height: 1.643;
    font-family: "Roboto", Helvetica, Arial, sans-serif;
    letter-spacing: 0em;
    padding-left: 1.5%;
    color: #5f656d;
}
#formulier .sterretje {
    color: rgba(221,96,76,1);
}
#formulier .opties div label {
    display: inline-block;
    color: #000033;
    letter-spacing: 1px;
    font-size: 16px;
}

#formulier .opties div{
	padding-left: 2%;
}
p.PrivaCy a{
	color: #34627c;
}

p.PrivaCy a:hover, p.PrivaCy a:focus{
	color: #163a45;
}

/*------mediaqueries--------*/

@media (max-width: 1299px) {

	header.navbar-default .navbar-toggle .icon-bar {
  background-color: #000000;
}
}


@media screen and (max-width:1224px){
	body, html {
    overflow-x: hidden!important;
	}
}
	
@media screen and (max-width:991px){	

	body .navbar-nav>li.active>a {
    padding-bottom: 7px;
}
	
}

@media screen and (max-width:810px){	
	.spfooterlinks h4.title-footer, .spfooterlinks h4.title-footer span {
	  margin-right: 14%;
	
	}
.bboxfooter ul li a, .bboxfooter ul li {
       font-size: 19px;
}
	.footer-content .container, .footer-bottom .container {
    width: auto;
	}
	.footer-bottom .container{
		padding-bottom: 4%;
	}
	.footer-bottom .container .footer_1{
		margin-bottom: 3%;
	}
	footer .footer-bottom .copyright {
       font-size: 14px;
	}
	a#lidFeweb img {
		float:right;
		margin: inherit;
		margin-top: -12%;
	}
	.Copy {
  max-width: inherit;
  margin-bottom: 4%;
}
	.Privbel {
  max-width: 33%;
}
	.AlgVw {
  max-width: 33%;
  margin-top: -1%;
}
}

@media screen and (max-width:640px){
.collapse-md .navbar-nav, .collapse-md .navbar-nav > li > a {
    padding-bottom: inherit;
}
	.bboxfooter ul li a, .bboxfooter ul li {
  font-size: 16px;
}
	.bboxfooter {
  width: 50%;
  display: block;
  float: left;
	}
	.bboxfooter2{
		padding-bottom: 15%;
	}
	.spfooterlinks h4.title-footer, .spfooterlinks h4.title-footer span {
  margin-right: 29%;
	}
	.Copy {
  max-width: inherit;
  margin-bottom: 7%;
}
	.AlgVw {
  max-width: 50%;
  margin-top: -1%;
}
	a#lidFeweb img {
   max-width: 95px;
}
}

@media screen and (max-width:480px){
.bboxfooter2 {
  padding-bottom: 23%;
}
	.spfooterlinks h4.title-footer, .spfooterlinks h4.title-footer span {
  margin-right: 23%;
}
	footer .footer-bottom .copyright {
  font-size: 12px;
}
	.Privbel {
  max-width: 50%;
}
	a#lidFeweb img {
  float: left;
	margin-top:4%;
	}
}

@media screen and (max-width:414px){
#MainMenu.navbar #navbar-main .navbar-nav > li > a {
	font-size:14px;
}
	.bboxfooter2 {
  padding-bottom: 34%;
}
	.spfooterlinks h4.title-footer, .spfooterlinks h4.title-footer span {
		font-weight: initial;
	}
	footer .footer-content {
  padding-top: 33px;
  padding-bottom: 25px;
}
	footer .footer-bottom .copyright {
  font-size: 9px;
}
	.bboxfooter.bboxfooter5 .tel span {
  font-size: 17px;
  color: #fff;
}
}