/*=== HTML Elements =====================================================================================================================================================*/
body																		{margin:0px; color:#666; font-size:100%; font-family: 'Source Sans Pro', sans-serif; -webkit-font-smoothing: antialiased; background-color: #fff;} 
html																		{width:100%; -webkit-text-size-adjust: 100%;}
h1																			{padding:0px 0px 0px 0px; margin:0px 0px 20px 0px; letter-spacing: 1px; font-weight: 700; line-height: 130%; font-size: 250%; color: #000;}
h2																			{color: #000; font-weight: 700;}

h2 a																		{transition:0.3s;}
h2 a:link, h2 a:visited, h2 a:active										{color: #000; text-decoration:none;}
h2 a:hover																	{color: #f89846; text-decoration:none;}

a 																			{outline:0; cursor: pointer;}
a:link, a:visited, a:active													{color: #000; text-decoration:underline;}
a:hover																		{color: #000; text-decoration:none;}

a[href^=tel]:link, a[href^=tel]:visited, a[href^=tel]:active {color: #fff; text-decoration:none;}
a[href^=tel]:hover															{color: #fff; text-decoration:underline;}

b, strong																	{font-weight: 700;}

.heading2 	{color: #000; font-weight: 700; display: block;text-decoration:none;}
.heading2:link {text-decoration:none; }

/*=== FrameWork Parts ==============================================================================================================================================*/

.partContentText h2, .partContentFileAdmin h2, .partContentFileImageGallery h2, .partContentVideo h2, .heading2 	{padding: 0px; margin: 0px 0px 15px 0px; font-size: 180%;line-height:115%;}

/* partContentText element padding */
.partContentText p, .partContentText ul, .partContentText ol, .partContentCode, .partContentVideo, .partContentText table, .partContentForm  {margin:0px 0px 20px 0px;} 


/* partContentText */
.partContentText															{line-height:150%; max-width: 900px; margin: 0px auto; box-sizing: border-box; overflow: hidden;}
.partContentText p															{padding: 0px; font-size: 120%;}

.partContentText p a														{transition:0.3s;}
.partContentText p a:link, .partContentText ul li a:link, .partContentText ol li a:link, .partContentText table a:link, .partContentText p a:visited, .partContentText ul li a:visited, .partContentText ol li a:visited, .partContentText table a:visited, .partContentText p a:active, .partContentText ul li a:active, .partContentText ol li a:active, .partContentText table a:active		{color: #000; text-decoration:underline;}
.partContentText p a:hover, .partContentText ul li a:hover, .partContentText ol li a:hover, .partContentText table a:hover			{color: #f89846; text-decoration:underline;}

.partContentText ul															{padding: 0px; margin-left:20px; list-style-type:disc;}
.partContentText ul li														{}
.partContentText ol 														{padding: 0px; margin-left:25px; list-style-type:decimal;}
.partContentText ol li														{}

.partContentText table                                       				{border-collapse: collapse;}
.partContentText table tr                                   	 			{}
.partContentText table th, .partContentText table td               		 	{padding: 8px 10px; border: 1px solid #ccc;}

@media (max-width: 740px) {
	table 																	{overflow-x: auto; display: block;}
}

/* partContentFileImageGallery */
.partContentFileImageGallery												{overflow: hidden;} /* overflow is very important for clearing float:left. Makes .partContentFileImageGalleryFooter and .partContentFileImageGallerySingle unnecessary */
.partContentFileImageGallery a, .partContentFileImageGallery img			{float:left; border: none;}
.partContentFileImageGallery img											{max-width: 100%;}
.partContentFileImageGallery a img											{float: none; margin: 0px; display: block; width: 100%;}
.partContentFileImageGallery .contentFileImageContainer						{}
.contentFileImageGalleryDescription											{display: block; font-size: 80%; clear: both; padding: 10px 0px;}

.imagesInRow4 .contentFileImageContainer *:nth-child(4n+1)					{margin-left: 0%;}
.imagesInRow4 a, .imagesInRow4 img											{width: 23.12%; margin: 0% 0% 2.5% 2.5%;}

@media (max-width: 800px){
	.imagesInRow4 .contentFileImageContainer *:nth-child(4n+1)				{margin-left: 2.5%;}
	.imagesInRow4 .contentFileImageContainer *:nth-child(3n+1)				{margin-left: 0%;}
	.imagesInRow4 a, .imagesInRow4 img										{width: 31.66%; margin:0% 0% 2.5% 2.5%;}
}

.imagesInRow3 .contentFileImageContainer *:nth-child(3n+1)					{margin-left: 0px;}
.imagesInRow3 a, .imagesInRow3 img											{width: 31.66%; margin:0% 0% 2.5% 2.5%;}

@media (max-width: 800px){
	.imagesInRow3 .contentFileImageContainer *:nth-child(3n+1) 				{margin-left: 2.5%;}
	.imagesInRow3 .contentFileImageContainer *:nth-child(2n+1)				{margin-left: 0%;}
	.imagesInRow3 a, .imagesInRow3 img										{width: 48.75%; margin:0% 0% 2.5% 2.5%;}
}

.imagesInRow2 .contentFileImageContainer *:nth-child(2n+1)					{margin-left: 0px;}
.imagesInRow2 a, .imagesInRow2 img											{width: 48.75%; margin:0% 0% 2.5% 2.5%;}

.partContentFileImageGallerySingle											{margin-bottom: 20px;}
.partContentFileImageGallerySingle img										{display: block; float: none;}

/* partContentFileAdmin - Use for files */
.partContentFileAdmin                                        		{padding:0px 0px 0px 0px;}
.partContentFileAdmin ul                                     		{padding:0px; margin:0px;list-style:none;}
.partContentFileAdmin ul li                                  		{padding:0px; margin:0px 0px 20px 0px;}

.partContentFileAdmin ul li a                                		{padding:0px; margin:0px;}
.partContentFileAdmin ul li a:link, .partContentFileAdmin ul li a:visited, .partContentFileAdmin ul li a:active {text-decoration:none;}           		
.partContentFileAdmin ul li a:hover			                		{text-decoration:underline;}

.partContentFileAdmin ul li a:before								{width: 37px; height: 22px; text-align: center; background-color: #785D46; font-size: 70%; line-height: 20px; color: #fff; margin-right: 10px; float: left;}
.partContentFileAdmin ul li a.partContentFileAdminZIP:before		{content: 'ZIP';}
.partContentFileAdmin ul li a.partContentFileAdminPDF:before		{content: 'PDF';}	
/* partContentVideo - Use for video's */
.partContentVideo iframe 											{border:none;}
@media (max-width: 740px){
	.partContentVideo .contentVideoContainer						{position: relative; height: 0; padding-bottom: 56.25%; /* padding bottom is based on ratio */ }
	.partContentVideo iframe 										{position: absolute;  left:0; top:0; height: 100%; width: 100%;}
}

.partGoogleMaps                                                     {width:100%; height:400px;}
.partClearBoth														{height: 1px; clear: both;}

.ctaButton															{display: inline-block; font-weight: 700; background-color: #1DB076; color: #fff; margin-right: 10px; padding: 9px 12px 9px 12px; margin-bottom: 20px; transition:0.3s; font-size: 112.5%;}
.ctaButton:link, .ctaButton:visited, .ctaButton:active				{color: #fff; text-decoration:none;}
.ctaButton:hover													{color: #fff; background-color: #f89846;}

.oneThirthColumn .ctaButton											{position: absolute; bottom: 0px; left: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%);}
.colorContainer .oneThirthColumn .ctaButton														{background-color: #785D46;}
.colorContainer .oneThirthColumn .ctaButton:link, .colorContainer .oneThirthColumn .ctaButton:visited, .colorContainer .oneThirthColumn.ctaButton:active {color: #fff;}
.colorContainer .oneThirthColumn .ctaButton:hover												{background-color: #f89846;}

header .partContentText p                                          	{font-size: 140%;}
header span.heading1												{padding:0px 0px 0px 0px; margin:0px 0px 20px 0px; letter-spacing: 1px; font-weight: 700; line-height: 130%; font-size: 300%; color: #000;}

/* mobile menu */
.sb-close {padding-left: 20px; cursor: pointer; background-color: #fff; height: 80px; display: block; line-height: 76px; color: #000;}

/* end mobile menu */

/* Container and column templates */
.basicContainer														{max-width: 1200px; margin: 0px auto; padding: 0px 20px; text-align: center; min-width: 280px;}
.basicContainerSmall												{max-width: 700px; min-width: 280px; text-align: left;}
.basicContainerSmall h2												{color: #f89846;}
.basicContainerSmall .ctaButton										{margin-right: 16px;}

.whiteContainer, .greyContainer, .colorContainer, #footer			{padding: 40px 0px 40px 0px;}
.whiteContainer														{background-color: #fff;}
.greyContainer														{background-color: #f6f6f6;}
.colorContainer														{background-color: #1DB076;}
.colorContainer h1													{color: #fff;}
.colorContainer .partContentText									{color: #fff;}
.colorContainer .columnContainer .partContentText, .greyContainer .columnContainer .partContentText			{color: #666;}

.oneFourthColumn .partContentText									{color: #666;}

	.columnContainer																	{margin-top:40px;}
		.oneSecondColumn, .oneThirthColumn, .oneFourthColumn 							{display: inline-block; box-sizing: border-box; overflow: hidden; background-color: #fff; margin-right: -4px; /* inline-block fix */ vertical-align:top; margin-bottom: 20px; position: relative;}
		
		/* Two columns */
		.oneSecondColumn																{width: 48%; margin-left: 4%; text-align: left; border-radius: 5px; margin-bottom: 4%; box-shadow: 0px 1px 0px 0px #DEDEDE, 0px 2px 4px 0px rgba(0,0,0,0.05);}
		.oneSecondColumn .partContentText p 											{display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; height: 48px; overflow: hidden;}
		.oneSecondColumn .partContentText h2 											{white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
		.oneSecondColumn span.fa														{float: left; margin-right: 20px;}

		/* Three columns */
		.oneThirthColumn	 															{width: 32.1%; margin-left: 2%; position: relative; padding-bottom: 66px; border-radius: 5px; box-shadow: 0px 1px 0px 0px #DEDEDE, 0px 2px 4px 0px rgba(0,0,0,0.05);}
		.oneThirthColumn .partContentText												{}
		.oneSecondColumn:nth-child(odd), .oneThirthColumn:nth-child(3n+1), .oneFourthColumn:nth-child(4n+1) 	{margin-left: 0px;}		
		
		/* Four columns */
		.oneFourthColumn																{width: 23.5%; margin-left: 2%; border-radius: 10px;}
		.oneFourthColumn .partContentText p strong 										{font-weight: 700; font-size: 300%; color: #000;}
		
		.oneThirthColumn:first-of-type, .oneFourthColumn:first-of-type					{margin-left: 0px;}
		.oneThirthColumn .partContentText, .oneFourthColumn .partContentText, .oneSecondColumn .partContentText			{padding: 0px 20px;}

		.leftContainer 																	{margin-right: 300px; padding-right: 2.9%; text-align: left; /*box-shadow: 0px 1px 0px 0px #DEDEDE, 0px 2px 4px 0px rgba(0,0,0,0.05); */}
			.leftContainerItem 																{background-color: #fff; margin-top: 30px; padding:3.5% 5.78% 3.5% 5.78%; margin-bottom: 30px;}

		.rightContainer 																{width: 300px; float: right; margin-top: 95px; text-align: left;}
			.rightContainerItem 															{margin-bottom: 25px;}

		.centerContainer 																{max-width: 865px; background-color: #fff; text-align: left; margin:0px auto; padding: 5.78% 5.78% 3.5% 5.78%; box-sizing: border-box;}
	
/* End container and column templates */

/* basic & modified containers */
.viewServices .partContentFileImageGallerySingle img, .viewPortfolio .partContentFileImageGallerySingle img {margin: 0px auto; width: 100%;}
.viewTeam .partContentFileImageGallerySingle img										{margin: 25px auto 0px auto; border-radius: 50%; width: auto;}
.viewReferenties span.fa																{color: #f89846;}

#overons .oneFourthColumn																			{padding-bottom: 45px;}
.teamLinkContainer																					{position: absolute; bottom: 20px; width: 100%; font-size: 140%; text-align: center;}
.teamLinkContainer .icon																			{display: inline-block; margin: 0px 6px 0px 10px; transition: 0.3s;}
.teamLinkContainer .icon:link, .teamLinkContainer .icon:visited, .teamLinkContainer .icon:active	{color: #f89846; text-decoration:none;}
.teamLinkContainer .icon:hover																		{color: #785D46; text-decoration:none;}

.footer .oneSecondColumn																{text-align: right; margin-bottom: 0px;}
.footer .oneSecondColumn h2																{color: #fff;}
/* end basic & modified containers */


#nieuws .oneSecondColumn										{position: relative;}
#nieuws .partContentFileImageGallerySingle img 					{margin: 0px auto; width: 100%;}
#nieuws.colorContainer .partContentText							{color: #fff;}
#nieuws .partContentFileImageGallery a							{float: none; margin: 0px;}

.newsItemContainer												{margin:0px 20px;}
.dateTime														{display: block; color: #fff; position: absolute; background-color:#f89846; padding: 8px 10px; top: 20px; left: 20px;}

#referenties span.fa											{color: #f89846;}

.colorContainer .ctaButton															{color: #fff;}
.colorContainer .ctaButton:link, #referenties .ctaButton:visited, #referenties .ctaButton:active	{color: #fff; text-decoration:none;}
.colorContainer .ctaButton:hover													{color: #f89846; background-color: #fff;}

#overons .partContentFileImageGallerySingle a						{float: none;}
#overons .partContentFileImageGallerySingle img 					{margin: 25px auto 0px auto; border-radius: 50%; width: auto; max-width: 150px;}

#topBarFix															{height: 80px;}

/* Start custom code */
#topBar																{min-height: 80px; background-color: #fff; width: 100%; top: 0; z-index: 9999; position: fixed;}

	#logo																{float: left; height: 80px; width: 13%; min-width: 120px; background: url('/images/style/logo.png') no-repeat left center; background-size: 100%;}
	#backToHome															{float: right; font-size: 112.5%; text-transform: lowercase; line-height: 80px; font-weight: 300; transition:0.3s; text-decoration: none;}
	#backToHome i														{margin-right: 10px; color: #f89846;}
	#backToHome:hover													{color: #f89846;}

	#pullMobileMenu														{display: none; float: right; line-height: 76px; color: #000; margin-left: 30px; font-size: 120%; font-weight: bold;}
	#pullMobileMenu i													{color: #f89846; margin-right: 10px;}

	.mobileMenuCloseBar														{line-height: 76px; color: #000; font-size: 120%; font-weight: bold;}
	.mobileMenuCloseBar i													{color: #f89846; margin-right: 5px;}

	/* social media icons */
	.socialContainer 													{margin: 0px; padding: 0px; list-style: none; font-size: 112.5%; text-transform: lowercase; line-height: 80px; font-weight: 300;}
	.socialContainer a 													{text-decoration: none;	display: block;	color: #000; transition:0.3s; display: inline-block; margin-left: 12px;}
	.socialContainer a:link, .socialContainer a:visited, .socialContainer a:active	{color: #000;}
	.socialContainer a:hover											{color: #f89846;}
	#topBar .socialContainer 											{text-align: right; float: right; margin-left: 5%;}
	#footer .socialContainer a											{margin-right: 12px; font-size: 140%;}
	#footer .socialContainer a:link, #footer .socialContainer a:visited, #footer .socialContainer a:active	{color: #fff;}
	#footer .socialContainer a:hover									{color: #000;} 																				
	/* end social media icons */
	
  .dienstenList                         {margin: 0px 0px 60px 0px; padding:0;}
  .dienstenList li                      {list-style-type: none; margin:0; padding:0px 0px 0px 20px; position: relative;}
  .dienstenList li:before               {content:""; position: absolute; left:0; top: 50%; width: 6px; height: 6px; border-radius: 50%; background: #785D46; margin-top: -3px;}
  .dienstenList li a                    {color: #000; text-decoration: none;}
  .dienstenList li:hover a              {text-decoration: underline;}
	
	ul.tagContainer 				{list-style: none; padding:0px; margin:0px;}
	ul.tagContainer li 				{display: inline-block; margin:0px 2px 7px 2px;}
	ul.tagContainer li.selected	a   {background-color: #f89846;color: #fff;} 
	ul.tagContainer li a 			{border:solid 1px #f89846; transition:0.3s; display: block; border-radius: 5px; padding:3px 8px; font-weight: 700; text-decoration: none; color: #f89846; }
	ul.tagContainer li a:hover 		{background-color: #f89846; color: #fff;opacity: 0.5;}


#diensten .columnContainer {display: flex; flex-wrap: wrap;}

.fb_iframe_widget {margin-top:40px;}


header                    {position: relative;}
.parallax-window 					{height: 550px; text-align: center; margin:0px auto;}
	span.imageVerticalFixContainer 		{display: table; max-width: 1240px; margin:0px auto; height: 100%; padding:0px 20px; width: 100%; box-sizing: border-box;}

  	span.imageVerticalFix 				{display: table-cell; text-align: left; vertical-align: middle; color: #fff;}
			.imageVerticalFixTitle, span.imageVerticalFix span.heading1 				{background-color: white; background-color: rgba(0, 0, 0, 0.6); border:solid white 3px;  margin-bottom: 10px; display: inline-block; padding:10px 20px 14px 20px; line-height: 130%; font-size: 300%; font-weight: 700;border-radius: 10px;color:white;}
			span.imageVerticalFix .partContentText 	{min-width: auto; max-width: 100%; font-weight: bold; font-size: 140%; box-sizing: border-box; display: block;}
			span.imageVerticalFix .partContentText p {}

			span#textWithButtonsContainer {display: block; max-width: 55%;}
			span#textWithButtonsContainer p {display: inline-block; background-color: #f89846; padding:20px 20px;border-radius: 10px;}
			span#textWithButtonsContainer .partContentText p {margin-bottom: 0px;}
			span#textWithButtonsContainer .partContentText p a:link, span#textWithButtonsContainer .partContentText p a:visited, span#textWithButtonsContainer .partContentText p a:active {color: #fff; text-decoration:underline;}
			span#textWithButtonsContainer .partContentText p a:hover																		{color: #785D46; text-decoration:underline;}

	span.fa								{color: #1DB076; margin-bottom: 20px; margin-top: 20px;}

	/* news */			
	.oneSecondColumn .newsMetaContainer								{padding: 0px 20px;}
	.basicContainerSmall .newsMetaContainer							{margin-bottom: 25px;}

	.newsMetaContainer i											{color: #f89846; margin-right: 5px;}
	.newsMetaContainer .ctaButton									{margin-right: 10px;}

		.newsMetaContainerItem													{display: inline-block; color: #000;}
		.newsMetaContainerItem a													{color: #000;}
		.newsMetaContainerItem a:link, .newsMetaContainerItem a:visited, .newsMetaContainerItem a:active {color: #666; text-decoration:underline;}
		.newsMetaContainerItem a:hover											{color: #000;}	

	.breadCrumbContainer i  {color: #f89846; margin-right: 3px;}
	
/* news end */

#footer								{color: #fff; background-color: #785D46;}
	#footer a { color:#fff;}
#footer ul							{padding: 0px; margin: 0px; list-style: none;}
#footer ul:last-child				{margin-top: 20px;}
#footer ul li						{padding: 0px; margin: 0px 10px; display: inline-block; line-height: 40px;}

#footer h1							{color: #fff;}
	.footerLink													{display: block;}
	.footerLink:link, .footerLink:visited, .footerLink:active	{color: #fff; text-decoration:underline;}
	.footerLink:hover											{color: #fff; text-decoration:underline;}

/* start responsive */
@media (max-width: 1199px){
	.whiteContainer, .greyContainer, .colorContainer, #footer	{padding: 20px 0px 20px 0px;}
	.columnContainer											{margin-top: 20px;}
}

@media (max-width: 1023px){
	#pullMobileMenu								{display: block;}
	span.imageVerticalFix .partContentText p 	{max-width: 100%;}
	.colorContainer .oneThirthColumn .ctaButton {width: 50%;}

	.rightContainer 							{width: 180px;}
	.leftContainer 								{margin-right: 180px;}
}

@media (max-width: 900px){
	h1, .imageVerticalFixTitle, span.imageVerticalFix h1			{font-size: 200%;}
	

	.parallax-window 						{height: 260px;}
	.oneFourthColumn						{width: 49%;}
	.oneFourthColumn:nth-child(odd)			{margin-left: 0px;}
	.oneSecondColumn .newsMetaContainerItem	{display: block; margin-bottom: 20px;}
}


@media (max-width: 767px){
	#mobileMenuButton						{display: block;}
	#topBar									{position: relative;}
	#topBarFix								{display: none;}
	.oneSecondColumn								{width: 100%; float: none; margin-left: 0%; text-align: left;}
	.oneSecondColumn .partContentText p 	{height:42px;}

	.oneThirthColumn						{width: 100%; margin-left: 0px; overflow: hidden; position: relative; padding-bottom: 0px;}
	.oneThirthColumn .partContentFileImageGallerySingle					{position: absolute; z-index: 1; padding-bottom: 0px; margin-bottom: 0px; height:100%;}
	.oneThirthColumn .partContentFileImageGallerySingle a				{display: block; float: none; height:100%;}
	#diensten .oneThirthColumn .partContentFileImageGallerySingle img	{margin: 0px; max-width: 450px; height:100%;}
	.oneThirthColumn .ctaButton 			{position: static; margin-right: 0px; display: inline-block;}
	.colorContainer .oneThirthColumn .ctaButton {width: auto; -webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    -ms-transform: translateX(0%);
    -o-transform: translateX(0%);
    transform: translateX(0%);}

	.postMetaItem							{display: block; margin-top: 20px; clear: both;}
	span#textWithButtonsContainer 			{max-width: 100%; font-size: 71%;}
	span#textWithButtonsContainer p 		{padding:10px;}
	body 									{font-size: 90%;}

	.basicContainerDetail .rightContainer 		{display: none;}
	.basicContainerDetail .leftContainer 		{margin-right: 0px; padding-right: 0px;}

	.parallax-window 						{height: 200px;}
}

@media (max-width: 600px){
	.imageVerticalFixTitle 							{display: none;}

}

@media (max-width: 480px){
	.oneThirthColumn .partContentFileImageGallerySingle		{width: 100%; margin: 0px; position: static; height: 100%;}
	.oneThirthColumnTextContainer							{width: 100%; margin-left: 0; position: static;}
	
	.oneFourthColumn						{width: 100%; margin-left: 0px;}
	#usp .oneFourthColumn					{text-align: left;}
	#diensten .oneFourthColumn				{text-align: left;}
	#usp .oneFourthColumn .fa				{float: left; margin-top: 0px; width: 70px; text-align: center; font-size: 300%;}
	#overons .oneFourthColumn .fa			{float: none;}
	
	#footer .basicContainer					{text-align: left;}
	#footer ul li							{margin: 0px;}

	#backToHome								{font-size: 14px;}
	.newsItem .thumbnail					{position: static;}
	.newsItem .postContent					{margin: 0px;}
	#footer .socialContainer a:first-child	{margin-left: 0px;}
	span#textWithButtonsContainer 			{display: none;}
}

@media (max-width: 479px){
	#topBar .socialContainer				{display: none;}
	span.imageVerticalFixTitle				{padding: 0px 20px;}

	.rightContainer 							{display: none;}
	.leftContainer 								{margin-right: 0px; padding-right: 0px;}
}

@media (max-width: 340px){
	#backToHome								{font-size: 12px;}
}
/* end responsive */