body {
				
				background-color: lightgreen;
				background-image: url("image/Draig_edit.jpg");
				background-size: 40%;
				background-position: center;
			/*	line-height: 1.4em;  */
				font-family: Georgia, Times, serif;				
				}

/* text font colour */
/*				
				.container {
 							color: blue;
							border: 1px dashed currentColor;}
				.child {
							background: currentColor;
							height: 9px;}

				.colour_blue {
 							color: blue;}
				.child {
							background: currentColor;
							height: 9px;}
*/				
			.wrapper {
				width: 716px;
				margin: 300px auto 10px auto;				
				border: 1px dotted #777777; 
				background-color: #ffffff;}
				
.relative{				
position: relative;
  top: 280px;
}		
				
				
			.header {
				position: fixed;
				top: 0;				
				width: 716px;
				height: 260px;
				box-shadow: 0px 0px 8px 8px #444444;
				background-image: url("image/header4b.jpg");
}
	
			.fixed-header {
    			position: fixed;
    			top: 0;
    			left: 0;
    			width: 671px;
    			background-image: url("image/header4b.jpg");
/*    			background: #333; */ /* Background color */
    			color: #fff;      /* Text color */	
    			padding: 10px 0;  /* Padding for spacing */
    			z-index: 999;     /* Ensure it stays on top */}	
	
				
			.content {
			margin-top: 50px;
			padding: 20px;}	
	
	
				
			.track {
				width: 720px;}
		/*		float: left;
				margin: 10px;
				height: 240px;} */

			article {
					float: left;
					clear: none;
					width: 720px;
					background-repeat: no-repeat;
					background-position: 35% 100%;}

			figure {
				float: left;				
				width: 230px;
				height: 250px;	
				margin: 0px 60px 0px 60px;		/*top, right, bottom, left*/
				padding: 9px 9px 9px 9px;
				text-align: right;}

			figure img {
				float: left;				
				width: 220px;
				height: 220px;
				margin-bottom: 10px;
				border: medium solid #989b9b;}
				
				
			figcaption {
				color: darkslategray;
				text-align: center;}
				
			hgroup {
				margin-top: 30px;
				text-align: left;
				background-image: url("image_25_dec/Draig_1by1.jpg");
				background-repeat: no-repeat;
				background-position: right top;					
					}
				
			ol {list-style-type: none;
				}
/*				
			aside {width: 230px;
					float: left;
					background-color: #e7e3d8;		
					background-image: url("image_13_dec/Draig_1by1.jpg");
					background-repeat: no-repeat;
					background-position: left bottom;}
*/				

			.shadowbox > * {
  			width: 50%;
  			box-shadow: 8px 8px 5px #444444;
  			padding: 8px 12px;
  			background-image: linear-gradient(180deg, white, #dddddd 40%, #cccccc);
  			z-index: 5;     /* top layer*/
			}

			.shadowbox {
  			display: flex;
  			border-bottom-style: solid;
  			border-bottom-width: 15px;
  			border-bottom-color: #ffff77;
  			}
			
			
			.box > * {
  			border: 2px solid rgb(96 139 168);
 			border-radius: 5px;
  			background-color: rgb(96 139 168 / 0.2);
}

			.box {
  			border: 2px dotted rgb(96 139 168);
  			display: flex;
  			flex-direction: row-reverse;
			}
			
			
			footer {
			height: 108px;
			margin-top: 30px;
  			background-color: #cccccc;
  			color: #444444;
  			background-image: url(image_25_dec/Gwyn.jpg);
  			background-repeat: no-repeat;
  			background-position: right;
  			position: relative;
  			z-index: 5;     /* top layer*/
}