/*
Article Styling

*/


	.project_container	{
		width:						var(--Width_LargeB);
		height: 					var(--Height_Hidescroll);
		float:						left;											/* scrollbar will appear right, hidden in the hidescroll container */
	/*	margin-left:				var(--Size_Margin);								/**/
	/*	background-color:			var(--Color_Dgrey1);							/**/
		background-image: 			url("../img/flexport/HidescrollArrowL.png");
		background-size:			contain; 										/**/
		margin-bottom:				var(--Size_Margin);								/* add extra space at bottom */
		overflow:					auto;											/* causes a scrollbar */
		z-index:					2;

	}
	
		/* Responsive layout - */
@media (max-width: 1500px) {
  .project_container {
	  width: 						var(--Width_MediumB);				/**/
	  background-image: 			url("../img/flexport/HidescrollArrowM.png");
	/*  background-color: 			red; */
  }
}

@media (max-width: 1100px) {
  .project_container {
	  width: 						var(--Width_SmallB);
	  background-image: 			url("../img/flexport/HidescrollArrowS.png");
	/*  background-color: 			red; */
  }
}

	.responsive_image	{
		width: 						var(--Width_LminM2);
		height: 					592px;	/**/
		margin-left: 				var(--Size_Margin);
		z-index:					2;
	}
	
			/* Responsive layout - */
@media (max-width: 1500px) {
  .responsive_image {
	  width: 						var(--Width_MminM2);
	  height: 						390px;	/**/
	  background-image: 			url("../img/flexport/HidescrollArrowM.png");
	/*  background-color: 			red; */
  }
}

@media (max-width: 1100px) {
  .responsive_image {
	  width: 						var(--Width_SminM2);
	  height: 						186px;	/**/
	  background-image: 			url("../img/flexport/HidescrollArrowS.png");
	/*  background-color: 			red; */
  }
}
	
	.project_image_container_0	{
		width:						var(--Width_Large);
		height:						var(--Height_HSminM2);								/*  */
		background-size:			contain; /**/
		margin-top:					var(--Size_Margin);									/**/
		margin-bottom:				0px;	/* var(--Size_Margin);									/**/
		margin-right: 				20px;												/* add extra space for scrollbar */
		background-image:			url(../img/projects/large/StyleBackground_0.png);		/* 1042*648 */
		z-index:					1;
	/*	background-color:			var(--Color_Dgrey1);								/**/
	}
	
				/* Responsive layout - */
@media (max-width: 1500px) {
  .project_image_container_0 {
		width:						var(--Width_Medium);
		height:						446px;
		background-image:			url(../img/projects/medium/StyleBackground_0.png);		/* 1042*648 */
	/*	background-color:			var(--Color_Dgrey1);								/**/
  }
}

@media (max-width: 1100px) {
  .project_image_container_0 {
		width:						var(--Width_Small);
		height:						242px;
		background-image:			url(../img/projects/small/StyleBackground_0.png);		/* 1042*648 */
	/*	background-color:			var(--Color_Dgrey1);								/**/
  }
}
	
	.triangle_down {
		width: 						0px;									/**/
		height: 					10px;									/**/
		display:					inline-block;											/* a tag stays inside div*/
		margin-left:				512px;	/* 521-9px;*/
	/*	margin-left: 				auto;											/**/
	/*	margin-right: 				auto;											/**/
		border-left: 				12px solid transparent;
		border-right: 				12px solid transparent;
		border-top: 				8px solid var(--Color_Lgrey3);					/**/
	/*	background-color: 			red;											/**/
	/*	z-index: 					10;												/**/
}

.triangle_down:hover	{
	/*	text-decoration:			none;													/*	hide underlining	*/
	/*	outline:					none;													/*	keep firefox dotted lines out of clicked links	*/					
		border-top-color: 			var(--Color_Dgrey2);											/**/
	/*	background-color: 			blue;											/**/
	}
			/* Responsive layout - */
@media (max-width: 1500px) {
  .triangle_down {
	  margin-left:					352px;
	  display:						none;
  }
}

	.triangle_up {
		width: 						0px;									/**/
		height: 					10px;									/**/
		display:					inline-block;											/* a tag stays inside div*/
		margin-left:				512px;	/* 521-9px;*/
	/*	margin-left: 				auto;											/**/
	/*	margin-right: 				auto;											/**/
		border-left: 				12px solid transparent;
		border-right: 				12px solid transparent;
		border-bottom: 				8px solid var(--Color_Lgrey3);					/**/
	/*	background-color: 			red;											/**/
	/*	z-index: 					10;												/**/
}

.triangle_up:hover	{
	/*	text-decoration:			none;													/*	hide underlining	*/
	/*	outline:					none;													/*	keep firefox dotted lines out of clicked links	*/					
		border-top-color: 			var(--Color_Dgrey2);											/**/
	/*	background-color: 			blue;											/**/
	}
			/* Responsive layout - */
@media (max-width: 1500px) {
  .triangle_up {
	  margin-left:					352px;
	  display:						none;
  }
}

@media (max-width: 1100px) {
  .triangle_down {
	  margin-left:					183px;
	  display:						none;
  }
}

	
	.CaptionTitle	{
		width:						var(--Width_LminM);
		height:						var(--Size_Margin);
		font-family:				logoType, verdana, tahoma, sans-serif;
		text-align:					left;											/**/
		padding-left:				var(--Size_Margin);
		font-size:					var(--Height_TextTitle);						/**/
		color:						var(--Color_Dgrey2);
	/*	background-color: 			var(--Color_Lgrey1);							/**/
	}
	
					/* Responsive layout - */
@media (max-width: 1500px) {
  .CaptionTitle {
		width:						var(--Width_MminM);
  }
}

@media (max-width: 1100px) {
  .CaptionTitle {
		width:						var(--Width_SminM);
  }
}
	
	.CaptionCopy	{
		width:						var(--Width_LminM);								/**/
		height:						var(--Size_Margin);
		font-family:				logoType, verdana, tahoma, sans-serif;
		text-align:					right;											/**/
		padding-right:				var(--Size_Margin);								/*	var(--Size_Margin);	*/
		font-size:					var(--Height_TextCopy);
		color:						var(--Color_Dgrey2);
	/*	background-color: 			var(--Color_Lgrey1);							/**/
	}
	
						/* Responsive layout - */
@media (max-width: 1500px) {
  .CaptionCopy {
		width:						var(--Width_MminM);
  }
}

@media (max-width: 1100px) {
  .CaptionCopy {
		width:						var(--Width_SminM);
  }
}

	.CaptionCopy2	{
	/*	width:						var(--Width_LminM);								/**/
	/*	height:						var(--Size_Margin);								/**/
		font-family:				logoType, verdana, tahoma, sans-serif;
		text-align:					center;											/**/
	/*	padding-right:				var(--Size_Margin);								/*	var(--Size_Margin);	*/
		font-size:					var(--Height_TextCopy);
		color:						var(--Color_Dgrey2);
	/*	background-color: 			var(--Color_Lgrey1);							/**/
	}

/*
	.scrolldown	{
		text-align: 				center;
		font-size:					14px;
		margin-left: 				var(--Size_Margin);
		color:						var(--Color_Mochre0);
		font-family:				LogoTypeB;
	}
	
							/* Responsive layout - */	/*
@media (max-width: 1500px) {
  .scrolldown {
		margin-left: 				var(--Width_Large);
  }
}

@media (max-width: 1100px) {
  .scrolldown {
		width:						var(--Width_SminM);
  }
}
*/

	.TextTitle	{
		width:						var(--Width_SminM);								/**/
		height:						20px;											/* var(--Size_Margin); */
		font-family:				logoTypeB, verdana, tahoma, sans-serif;
		text-align:					left;											/**/
		padding-left:				var(--Size_Margin);								/*	var(--Size_Margin);	*/
		font-size:					var(--Height_TextTitle);
		color:						var(--Color_Dgrey2);
	/*	padding-top: 				2px;											/**/
	/*	background-color: 			grey;											/**/
	}

	.lineleft	{
		width:						1008px;
		height:						2px;
		margin-left: 				17px;	/**/
		background-image: 			url(../img/projects/large/lineleft.png);
	/*	background-repeat: 			no-repeat;										/**/
		background-size:			100%;
	/*	background-color: 			grey;											/**/
	}
	
							/* Responsive layout - */
@media (max-width: 1500px) {
  .lineleft {
		width:						670px;;
  }
}

@media (max-width: 1100px) {
  .lineleft {
		width:						332px;
  }
}


	.lineright	{
		width:						1008px;
		height:						2px;
		margin-left: 				17px;	/**/
		background-image: 			url(../img/projects/large/lineright.png);
	/*	background-repeat: 			no-repeat;										/**/
		background-size:			100%;
	/*	background-color: 			grey;											/**/
	}
	
							/* Responsive layout - */
@media (max-width: 1500px) {
  .lineright {
		width:						670px;
  }
}

@media (max-width: 1100px) {
  .lineright {
		width:						332px;
  }
}
	
	.summary	{
		height:						auto;
		width:						var(--Width_LminM2);
		font-family:				logoType, verdana, tahoma, sans-serif;
		text-align:					left;											/**/
		font-size:					var(--Height_Text);
		color:						var(--Color_Dgrey2);
		word-break: 				normal;
		word-wrap: 					normal;
		margin-left: 				var(--Size_Margin);
		padding-top: 				7px;
		padding-bottom: 			4px;
	/*	padding-right:				100px;											/**/
	/*	background-color: 			aqua;											/**/
	}
	
								/* Responsive layout - */
@media (max-width: 1500px) {
  .summary {
		width:						var(--Width_MminM2);
  }
}

@media (max-width: 1100px) {
  .summary {
		width:						var(--Width_SminM2);
  }
}

.summaryimage	{
		height:						auto;
		width:						var(--Width_LminM2);
		font-family:				logoType, verdana, tahoma, sans-serif;
		text-align:					left;											/**/
		font-size:					var(--Height_Text);
		color:						var(--Color_Dgrey2);
		word-break: 				normal;
		word-wrap: 					normal;
		padding-top: 				7px;
		padding-bottom: 			0px;
	/*	padding-right:				100px;											/**/
	/*	background-color: 			aqua;											/**/
	}
	
.row {
	display:				flex;
	flex-wrap:				wrap;
/*	padding:				0 4px;		/**/
}

/* Create four equal columns that sits next to each other */
.column {
	flex:					50%;
	max-width:				479px;	/*310px;		/**/
	margin-left:			28px;
/*	padding:				0 4px;		/**/
}

.column img {
/*	margin-top:				28px;		/**/
	vertical-align:			middle;
}



/* Responsive layout - makes a two column-layout instead of four columns */
@media (max-width: 1500px) {
  .column {
    flex:					50%;
    max-width:				310px;
  }
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media (max-width: 1100px) {
  .column {
    flex:					100%;
    max-width:				310px;
  }
}

.column iframe {
/*	margin-top:				28px;		/**/
	vertical-align:			middle;
	margin-left: 			0px;
	width: 					479px;
	height: 				268px;		/**/
	border-width: 			0px;
	border-color: 			var(--Color_Mgrey0);
}

/* Responsive layout - makes a two column-layout instead of four columns */
@media (max-width: 1500px) {
  .column iframe {
    flex:					50%;
    max-width:				310px;
    height:					174px;
  }
}	
	
	
	.bottomline	{
	/*	max-width:				479px;	/*310px;		/**/
		height: 			3px;
		background-size: 	100% 100%;
		background-repeat: no-repeat;
		background-image: 	url(../img/projects/large/bottomline.png);
	}
	
	.bottomrline	{
	/*	max-width:				479px;	/*310px;		/**/
		height: 			3px;
		margin-bottom: 	7px;
		background-size: 	100% 50%;
		background-repeat: no-repeat;
		background-image: 	url(../img/projects/large/lineright.png);
	}
	
	
	.imagespacer	{
		height:					var(--Size_Margin);
		flex:					50%;
		max-width:				479px;	/*310px;		/**/
	/*	margin-left:			28px;					/**/
	/*	background-color:		red; 					/**/
	}
	
		/* Responsive layout - */
@media (max-width: 1500px) {
  .imagespacer {
	  flex:					50%;
    max-width:				310px;
  }
}

@media (max-width: 1100px) {
  .imagespacer {
	  flex:					100%;
    max-width:				310px;
  }
}
	
	.link	{
		font-family:				logoType, verdana, tahoma, sans-serif;
		text-align:					left;
		font-size:					var(--Height_Text);
	/*	margin-bottom:				var(--Height_MenuButtonMargin);							/**/
	/*	background-color:			var(--Color_Lgrey1); */
	}
	
	.link a	{
		text-decoration:			none;													/*	hide underlining	*/
		outline:					none;													/*	keep firefox dotted lines out of clicked links	*/
		color:						var(--Color_Lgrey3);
	}
	
	.link a:hover	{
		text-decoration:			none;													/*	hide underlining	*/
		outline:					none;													/*	keep firefox dotted lines out of clicked links	*/
		color:						var(--Color_Dgrey2);
	}