/* Sized'th' fields in Tables #list table.reg and #list table.fate. */

body {font-family:arial,helvetica,sans-serif;font-size:12px;background-image: url(img/bkgnd.jpg);}

 h1 {font-size:24pt;color:#ffffff;margin:-10px 0px 0px 0px;padding:0px;}

 h3 {font-size:16pt;color:navy;}
	
 h4 {font-size:10pt;color:navy;margin:-2px;padding:0px;}

 table {width:100%; border-collapse: collapse; empty-cells: show;border: 1px solid black;}
  
  th {border: 1px solid black; text-align:left;background: navy url(img/sea.jpg) repeat-y bottom left;color: white;padding: 0.2em;}

 td {text-align:left;border: 1px solid black;padding: 0.2em;}

 caption {text-align:center;font-size:16pt;font-weight:bold;color:navy;}

 hr { height:3px; width:75%; border:0; color:#bbb; background-color:#bbb; }

  #wrapper {
		width:900px;
		margin:0px auto;
		border:1px solid #bbb;
		padding:10px;
		background-color:#ffffff;
		
           }

  #header   {	border:1px solid #bbb;
		padding:10px;
		background: #ffffff;
		
	}

  #site_branding {
		border:1px solid #bbb;
		height:100px;
		padding:10px;
		background: navy url(img/header/rotate.php) repeat-y center center;
		
	  }

  #content {	
		margin-top:0px;
		padding-top:10px;
	 }

	/* applies to all divs within the content div */
  #content div {
		padding:10px;
		border:1px solid #bbb;
		float:left;
	}

  #content-main {
		margin-left:10px;
		width:500px;
		overflow-wrap:break-word;
  		word-wrap:break-word;
	}
  #content-main div.article {
		padding:0px;
		margin:0px auto;
		width:480px;
				
  	}

  #content-main div.article h3 {
		text-align:center;	
	}
 
  #content-main div.article img {
		display: block;
		margin: 0px auto;
		text-align:center;
		border:none;
	}

  #content-main div.booklist {
		width:230px;
		margin:0px 10px 0px 0px;
		padding:0px;
		/*border:none;*/
	}
  #content-main div.booklist ul {	
		margin:0;
		padding-left: 1em;
		text-indent: -1em;
	}
  #content-main div.gallery {
		width:80px;
		height:110px;
		float:left;
		border:none;
		margin:0px 10px 5px 0px;
		padding:0px;
		text-align:center;
}

  #content-main div.gallery img {
		display:block;
		margin: 0 auto;
		text-align:center;
		border:none;
	}

	#content-main div.feature {
		border:0px;
		margin:0px;
		padding:0px;
		 		
	}

	#content-main div.feature img{
		float:left;
		/*width:100px;*/
		margin:10px;
		border:none;

	}
	
	#content-main  figure {
		margin:0%;
		width:100%;
		border:none;
		height:auto;
		padding:0px;
		/*display:flex;
		justify-content:center;*/		
	}
	
	#content-main  figure img{
	
	}
	#content-main figure figcaption{ 
			text-align:center;
			margin:1em 0em 2em 0em;
	}
	
	#content-main div.row {
			border:none;
			float:left;
			height:auto;
			padding:0px;
			display:flex;
			justify-content:center;
			width:100%;
	}
					
	#content-main div.row div.column {
			border:none;
			margin:3.0%;
			padding:0px;
			float:left;
	 		width:100%;
    	 	height:auto;		
	}
	
	#content-main h2.ship {
		color:#ff0000;
	}

  #content-main ul {
 		list-style-type: none;

	}

  #content-main ul.vspace li {
 		margin-bottom:1.5em;
	}

  #content-main ol li {
		 margin-bottom:0.5em;
		 list-style-type:lower-alpha;
   }
 
  	#content-main ol.builder li {
		 margin-bottom:0.5em;
		 list-style-type:decimal;
   }

  	#content-main table.arctic {
		width:100%;
		border-collapse: collapse;
		table-layout:fixed;
	}

 	#content-main table.arctic table.arctic th, table.arctic td {
		 border: 1px solid black;
	}
		.arctic th.date {width:11%}
		.arctic th.leader {width:29%}
		.arctic th.details {width:60%}
		.arctic th {text-align:left;background: navy url(img/Picture034.jpg) repeat-y bottom left;color: white;padding: 0.2em;}

	#content-main table.iron {
		width:100%;
		border-collapse: collapse;
		table-layout:fixed;
	}

 	#content-main table.iron table.iron th, table.iron td {
		 border: 1px solid black;
	}
		.iron th.name {width:40%}
		.iron th.number {width:15%}
		.iron th.year {width:15%}
		.iron th.type {width:30%}
		.iron th {text-align:left;background: navy url(img/Picture034.jpg) repeat-y bottom left;color: white;padding: 0.2em;}

	#content-main table.Appendix {
		margin: 0 auto;
		width:70%;
		border-collapse: collapse;
		table-layout:fixed;
	}

 	#content-main table.Appendix table.Appendix th, table.appendix td {
		 border: 1px solid black;
	}
		.Appendix th.country {width:50%}
		.Appendix th.built {width:25%}
		.Appendix th.building {width:25%}
		.Appendix th {text-align:left;background: navy url(img/Picture034.jpg) repeat-y bottom left;color: white;padding: 0.2em;}


  	#content-main table.ABFerries {
		width:100%;
		border-collapse: collapse;
		table-layout:fixed;
	}

 	#content-main table.ABFerries table.ABFerries th, table.ABFerries td {
		 border: 1px solid black;
	}
		.ABFerries th.name {width:20%}
		.ABFerries th.built {width:40%}
		.ABFerriesth.on {width:40%}
		.ABFerries th {text-align:left;background: navy url(img/Picture034.jpg) repeat-y bottom left;color: white;padding: 0.2em;}

  	#content-main table.SKVessels {
		width:100%;
		border-collapse: collapse;
		table-layout:fixed;
	}

 	#content-main table.SKVessels table.SKVessels th, table.SKVessels td {
		 border: 1px solid black;
	}
		.SKVessels th.name {width:25%}
		.SKVessels th.built {width:35%}
		.SKVessels th.on {width:45%}
		.SKVessels th {text-align:left;background: navy url(img/Picture034.jpg) repeat-y bottom left;color: white;padding: 0.2em;}

  	#content-main table.SKFerries {
		width:100%;
		border-collapse: collapse;
		table-layout:fixed;
	}

 	#content-main table.SKFerries table.SKFerries th, table.SKFerries td {
		 border: 1px solid black;
	}
		.SKVFerries th.name {width:18%}
		.SKFerries th.built {width:30%}
		.SKFerries th.on {width:18%}
		.SKFerries th.location {width:34%}
		.SKFerries th {text-align:left;background: navy url(img/Picture034.jpg) repeat-y bottom left;color: white;padding: 0.2em;}	

 	#content-main table.converted {
		width:100%;
		border-collapse: collapse;
		table-layout:fixed;
	}

 	#content-main table.converted table.converted th, table.converted td {
		 border: 1px solid black;
	}
		.converted th.name {width:25%}
		.converted th.later {width:60%}
		.converted th.on {width:15%}
		.convertedth {text-align:left;background: navy url(img/Picture034.jpg) repeat-y bottom left;color: white;padding: 0.2em;}
		
 	#content-main table.OnStation {
		width:100%;
		border-collapse: collapse;
		table-layout:fixed;
	}
	
	#content-main table.OnStation tr td:first-child{
		font-weight:bold;
	}
	
		
	#content-main table.OnStation table.OnStation th, table.OnStation td {
		border: 1px solid black;
		
	}
		.OnStation th.date {width:7%}
		.OnStation th.name {width:90%}
 
  	#content-main table.routines {
		width:100%;
		border-collapse: collapse;
		table-layout:fixed;
	}

 	#content-main table.routines table.routines th, table.routines td {
		 border: 1px solid black;
	}
		.routines th.time {width:10%}
		.routines th.action {width:90%}
		.routines th {text-align:left;background: navy url(img/Picture034.jpg) repeat-y bottom left;color: white;padding: 0.2em;}				
#
	#content-main table.apc {
		width:100%;
		border-collapse: collapse;
		/*table-layout:fixed;*/
	}

	#content-main table.apc table.apc th, table.apc td {
		 border: 1px solid black;
	}
		.apc th.title {text:bold;width:25%}
		.apc th {text-align:right;background: navy url(img/Picture034.jpg) repeat-y bottom left;color: white;padding: 0.2em;}
		.apc td.reg {width:75%}
		.apc td.date {width:10%}
		.apc td {width:65%}
   
   #content-main table.radio{
		width:100%;
		border-collapse: collapse;
		table-layout:fixed;	
	}

	#content-main table.radio, table.radio th, table.radio td {
		 border: 1px solid black;
	}
		.radio th.name {width:30%}
		.radio th.callsign {width:15%}
		.radio th.notes {width:55%}
		.radio th {text-align:left;background: navy url(img/Picture034.jpg) repeat-y bottom left;color: white;padding: 0.2em;}
	
	
  #content-main div.btn  {
		padding:0px;
		margin:0px auto;
		text-align:center;
		width:100%;
		border:none;
	}

  #content-main div.image-container {
		float:left;
		margin:0px auto;
		text-align:center;
		/*border:1px solid #bbb;
		padding:0px;*/
	}

  #content-right {
		margin-left:10px;
		width:133px;
		border:1px solid #ff0000;
		text-align:left;
	}

  #list {	
		margin-top:10px;
		margin-bottom:10px;
		padding:10px;
		border:1px solid #bbb ;
    			
	}


  #list  table.title {width:40%} table.title th {width:7%;} table.title td {font-weight:bold;}
  #list  table.honours th {width:2%;}
  #list  table.vessel th {width:3%;}
  #list th {text-align:left;background: navy url(img/Picture034.jpg) repeat-y bottom left;color: white;padding: 0.2em;}
  #list table.reg th { width:6%; } 
  #list table.name {table-layout:fixed;} table.name th { width:3%; } table.name td.year {width:3%;}
  #list table.year th { width:7%; }
  #list table.details_vessel th { width:8%; }
  #list table.info th { width:3%; }
  #list table.fate th { width:2%; } td { width:18%; }

  #list	div.btn  {
		padding:0px;
		margin:0px auto;
		text-align:center;
		width:100%;
		border:none;
	}

  #footer {
		margin-top:10px;
		margin-bottom:10px;
		padding:10px;
		border:1px solid #bbb ;
    		font-size:8pt;	
	}
  #bottom {
		clear:both;
		text-align:right;

	}
	
  #formwrapper {width:550px; margin:2em auto 2em auto;}

  #formwrapper form {width:500px; margin:2em auto;}

  #formwrapper label {display:block;margin:0.3em 0 0.3em 2em;font-family:Arial, Helvetica, sans-serif;font-weight:bold;}
  
  #formwrapper input {width:250px; margin:0 0 0 2em;}
  #formwrapper input.date {width:85px; margin:0 0 0 2em;}

  #formwrapper textarea {width:450px;height:10em;margin:0 0 0 2em;}

  #formwrapper fieldset {/*border:none;*/background:#4282A3; padding:0 0 2em 0}

  #formwrapper input.btn { width:125px; margin: 2em 0 0 2em; font-family:Arial, Helvetica, sans-serif; color:#555555; font-weight:bold;}



.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } /* slightly enhanced, universal clearfix hack */
.clearfix { display: inline-block; }
.highlighted {margin:0px; border:0px; font-weight:bold; color:#ff0000; } /* Highlighted news items right hand column */
.size14 { font-family:helvetica,arial,sans-serif; font-size:14pt; }
.heading { float:left; width:80px; margin:0px 10px 10px 10px;border:none;}
.bold {font-weight:bold;}
.center {text-align:center;}
.imgcent { 	display:block; 
		margin:0px auto;
		text-align:center; 
		border:none;
		max-width: 100%;
    	height: auto;
    	width: auto\9; /* ie8 */
		overflow: auto;
	}
.imgcent_h {display:block; 
		margin:0px auto;
		text-align:center; 
		border:none;
		height: 100%;
    		width: auto;
    		height: auto\9; /* ie8 */
		overflow: auto;
	}
.clear { clear: both; }
.hang { text-indent: -1.5em; }
.underline { text-decoration:underline; }
.lineup { margin-top: 0em; }
.space { margin-bottom: 0; }