/* CSS Document for Travel refresh April 2025*/
/*===================================================================================*/
/* Brand Variables */
/*===================================================================================*/
:root {
	--bg-main-bck-rgb: 205, 219, 228;      /* [#cddbe4] main chessboard  */
	--bg-alt-bck-rgb: 250, 250, 238;  		/* [#fafaee] alternate nicest */		
	--bg-dark-teal-rgb: 0, 96, 128;       /* [#006080] h1, header, footer */
	--bg-mid-teal-rgb: 83, 125, 154;       /* [#537d9a] h1, header, footer */
	--bg-mid-blue-rgb: 106, 132, 191;	/*  [#6a84bf] h1, header, footer from UAE page jpg */
	--bg-orange-rgb: 253, 126, 20;       /* [#d7e14] hover text */	
}

body {
	background-image:url(../img/jap_tkgov_wave_greylight.gif);
}
h1 {
	color: rgba(var(--bg-mid-blue-rgb),1);
	font-family: Georgia, Verdana, Helvetica, Arial, sans-serif;
	font-style: italic;
	font-size: 1.5rem;
	font-weight: bold;
	line-height: 2;
}

a {color:rgba(var(--bs-black-rgb),0.5)}

.mainContainer {
	max-width:800px;
	background-color:rgba(var(--bg-main-bck-rgb),1);
	border-bottom: 1em solid rgba(var(--bg-mid-blue-rgb),1);	
}

@media (max-width: 430px) {  /* retain margins on small devices  */
  .mainContainer { max-width:350px;}
}

.topline{
	text-align:center;
	background-color:rgba(var(--bg-alt-bck-rgb),1);
}
.navSection { 
	max-width:700px;
	margin-top:1em; margin-bottom:1em;
}

.maincol {background-color:rgba(var(--bg-main-bck-rgb),1);}	
.chessboard div {width:70px; height:70px; float:left; display:block; position: relative;}
.contrast {background-color:rgba(var(--bg-alt-bck-rgb),1)} 

.chessboard a p { 
	position: absolute;
	bottom: 0; 
	margin:0; padding:0;
	width: 100%;
	font-size: 0.75rem;
	font-weight: bold;
	color:rgba(var(--bg-orange-rgb),1);
	background-color:rgba(var(--bs-white-rgb),0.75);
	display: none;
}

.chessboard a img {   /* override devices */
    touch-action: manipulation; 
	}

 @media (hover: hover) {  /* needs JS to trigger this for mobile devices */
	.chessboard a img:hover + p {
	display: block;
	}
 }

.chessboard a img:active + p {
	border:1px solid rgba(var(--bg-orange-rgb),0.25);
	display: block;
}

.message {line-height:1.5rem;}

#nav_l {
	font-size:1rem;
	line-height:1.0rem;
	height:2.0rem;
	color:rgba(var(--bg-alt-bck-rgb),1);
	margin-top:0.5rem; margin-bottom:0.5rem; padding: 0.5rem;
}
 
.footer {
font-size:0.65rem; font-family:Arial, Helvetica, sans-serif; color:rgba(var(--bs-black-rgb),0.5);
}
