/*	WALNUT MASTER CSS FILE		*/
/*	For all screens > 1024px wide	*/

@font-face {
    font-family: CormorantSC;
    src: url(../fonts/CormorantSC-Regular.ttf);
}

@font-face {
    font-family: arial-narrow;
    src: url(../fonts/arialn.ttf);
}

/*		ADVICE (in case you forget)								*/
/*		Roboto is fine on an Android device (which is what it was designed for)			*/
/*		but its lousy on a wide 16:9 or 16:10 aspect ratio PC screen					*/
/*		So stick with arial narrow for main text, and arial for the menus			*/
				
@font-face {
    font-family: Arial;	
    src: url(../fonts/Arial.ttf);
}


/*	Colours																		*/

/*	Flesh: 		#ff9980 [.hline / .fline] 		Header and footer lines 								*/
/*	Dark green: 	#3d5C00 [h1 / h2 / #ftext1 / #ftext2 / #htext1 / #htext2] 			"htext2" NOT CURRENTLY CALLED		 	*/
/*	Grey:		#3d3d3d [.main / h3]. 			"h3" NOT CURRENTLY CALLED (was #666666)							*/ 
/*	Dark blue:	#004282 [a:link / #menu a / ftext3]	Used for links throughout 								*/ 
/*	Dark grey:	#3d3d3d [.italic]			Used for italics. 									*/ 
/*	Light grey:	#3d3d3d [li.body]			Used for lists (was #bcc3c4)								*/ 
/*	Pastel green:	#3d5C00 [a:hover / #menu a:hover]	Hover on menu										*/ 
/*	Pale grey	#e6e6e6 [#menu li.current] 		Menu background for current item							*/ 


/* Header line 					*/
.hline { 
	width:100%; 
	height:2px; 
	background: #004284; 
	margin-left: 0%;
	margin-top: 2em;
	z-index: 4;
}

.banner {
	margin-left: 15%;
}

h1 {
  font-family: CormorantSC;
  font-size: 2.5em; 
  text-align: left;
  font-style: normal;
  color: #666600;
  line-height: 100%;
  margin-left: 0%;
  margin-right: 10%;
  display: inline;
}

h2 {
  font-family: CormorantSC;
  font-size: 0.8em; 
  text-align: left;
  color: #666600;
  line-height: 100%;
  display: inline;
  margin-left: 0%;
}

.main {
  font-family: arial-narrow;
  font-size: 1.2em;
  font-weight: 400;
  text-align: left;
  font-style: normal;
  color: #3d3d3d;
  line-height: 100%;
  margin-left: 15%;
  margin-right: 10%;
  margin-top: 3em;
/*  margin-bottom: 100px;		*/
}

ul.disc {
  list-style-type: disc;
}

/* UNVISITED LINK			*/
a:link {
    color: #004282;
    font-style: italic;
    text-decoration: none;
}

/* MOUSE OVER LINK			*/
a:hover {
    color: #666600; 
}

.italic {
  font-family: arial-narrow;
  font-size: 1em;
  font-weight: 400;
  text-align: left;
  font-style: italic;
  color: #3d3d3d;
  line-height: 100%;
}

.bold {
  font-weight: 600;
}

.right {
  text-align: right;
}

li.body {
  font-family: Arial;
  font-size: 1.2em; 
  font-weight: 400; 
  text-align: left;
  font-style: normal;
  color: #3d3d3d;
  line-height: 100%;
  margin-left: 2.5em;
}

/*	PHOTOS (in values.shtml)		*/

.photos {
  display: inline;
  margin-right: 50px;
}

/* LOGO CODE	*/

html, body {
  height: 100%;
}

body {
  opacity: 1.0;
}

menu_body {
  opacity: 1.0;
}

.ident {
  margin-left: 4%;
}

#wrap {min-height: 100%}

#content {overflow: auto;
	padding-bottom: 60px;}

/* MENU FORMATTING 			*/

#menu {
/*	float: left;			*/
	margin-left: 6%;
        position: fixed;
	width: 20%;
   	font-size: .9em;
   	font-weight: 400;
   	line-height: 2em;
   	font-family: Arial;
   	text-align: left;
   	border-radius: 8px;
   	top: 6em;
}

#menu ul {
	list-style-type: none;
	text-align: left;
}

#menu a {
	margin-left: 0px;
	margin-right: 0px;
	text-decoration: none;
	text-align: left;
	color: #004282;
	text-decoration: none;
}

#menu a:hover {
    color: #666600;
}

#menu li.current {
	background-color: #e6e6e6;
}

#mcbuttonfr {
	width: 12px;
	height: 12px;
	float: right;
	margin-right: 20%;
	margin-top: 1.5em;
}

#mcbuttonen {
	width: 12px;
	height: 12px;
	float: right;
	margin-right: 4%;
	margin-top: 1.5em;
}

/* END OF MENU DEFINITIONS 	*/

/*	HEADER DEFINITIONS		*/
/*	Language selection		*/

.htext2 {
  font-family: CormorantSC;
  font-size: 1.0em;
  text-align: right;    
  vertical-align: text-top;
  color: #004282;
  line-height: 80%;
  display: inline; 			
  margin-left: 3%;	
}

/* EXPERIMENTAL DISPLAY FOR TABLES	*/

.small-text {
   font-size: .8em;
}

table {
    font-family: arial, sans-serif;
    font-size: .8em;
    border-collapse: collapse;
    width: 100%;
}

td, th {
/*    border: 1px solid #dddddd;		*/
    text-align: left;
    padding: 8px;
    vertical-align: text-top;
}

tr:nth-child(even) {
    background-color: #dddddd;
}

/*      SIDE NAVIGATION MENU EXPERIMENT         */

.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    top: 0;
    left: -1%;
    background-color: #ffffff;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 60px;
}

.sidenav a {
    padding:  8px 8px 8px 32px;
    text-decoration: none;
    font-size: 25px;
    font-family: arial-narrow;
    font-size: 1em;
    color: #404040;
    display: block;
    transition: 0.3s;
}

.sidenav a:hover {
    color: #992600;
}

.sidenav .closebtn {
    position: absolute;
    top: 0;
    font-size: 1em;
    margin-right:5%;
}

/*      END OF SIDE NAVIGATION          */

/*	RIGHT SIDE NAVIGATION TEST	*/

.rsidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 1;
    top: 0;
    right: 0;
    background-color: #ffffff;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 60px;
}

.rsidenav a {
    padding:  8px 8px 8px 32px;
    text-decoration: none;
    font-size: 25px;
    font-family: arial-narrow;
    font-size: 1em;
    color: #404040;
    display: block;
    transition: 0.3s;
}

.rsidenav a:hover {
    color: #000000;
}

.rsidenav .closebtn {
    position: absolute;
    top: 0;
    font-size: 1em;
    margin-right: -15%;
}

.rorb    {
	z-index: 1;
	float: right;
	cursor: pointer;
	margin-right: -19%;
	margin-top: -1%;
}

/*	END RIGHT SIDE NAVIGATION TEST	*/

.orb    {
	margin-left: -12%;
	float: left;
	margin-top: -1%;
}

.covid    {
	margin-left: -8.7%;
	float: left;
	margin-top: -3%;
}
/* Top bar line of text                         */
.topbar {
        height: 10%;
        position: fixed;
        left: 5%;
        height: 10%;
        width: 5%;
        top: 4%;
        opacity: 0;
	background-color: #ffffff;
}
 
/* Vertical line LHS 				*/

.vllhs {
  border-left: 6px solid #666600;
  height: 185%;				
  position: absolute;
  left: 8.0%;
  top: 0;
  z-index: 1;
}

/* Vertical line RHS 				*/

.vlrhs {
  border-left: 6px solid #992600;
  height: 185%;				
  position: absolute;
  left: 90.6%;
  top: 0;
  z-index: -1;
}



/* COVID-19 stuff			*/
/* Tables					*/

.small-text {
   font-size: .8em;
}

table {
    font-family: arial, sans-serif;
    font-size: .8em;
    border-collapse: collapse;
    width: 100%;
}

td, th {
    border: 1px solid #dddddd;
    text-align: left;
    padding: 8px;
    vertical-align: text-top;
}

tr:nth-child(even) {
    background-color: #dddddd;
}

.image-covid {
	width: 90%;
	height:auto;
	margin-left: 0%; 
	margin-top: 15px; 
	margin-right: 5%;
}