﻿
body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	background-color:#a7b098;
	color:#5f5f01;
}

.main-block {
	max-width: 860px;
	background: white /*#FFeecc white*/;
	border:3px #d9d8b4 solid;
	padding: 0 4px 0 4px;
	margin:auto;	
	overflow: auto;
	height:auto;
}

a:link, a:visited, a:active, a:hover {
	background: transparent;
	text-decoration:underline;
}

a:link {  /*#cc3300  #A82900*/
	color: #981900;
}

a:visited {
	color:#C24B87;
}

a:active {
	color: #bb8800;
}
a:hover {
	color: #FF9933;
}

.m1fwrp, .m2wrp, .m1fwrpx, .m2wrpx {
	/*float: left;
	margin-top: 4px;
	width: 100%;
	height: 60px; 
	background: white;*/
	/*overflow: hidden;*/
	position: relative;
	display:block;
	margin-bottom:5px
}

/*.m1fwrpx, .m2wrpx { display:none }*/

.toparw {
	position:absolute;
	left: 0px;
	background: #e7f2d8;
	margin-top: 30px;

}


.menubox, .menuboxS {
	width: 100%;
	height: auto/* container for top menus */;
	overflow-x: auto;
	overflow-y: hidden;
	white-space: nowrap;
	float: left;
    margin-bottom:11px;
}


.menubox     /* for pages */
 {
	background: #e9f7db;	
    padding-top: 2px
}

.menuboxS     /* for topics */
 {
	background:#d9d8b4;
	padding-left:48px 
 
 }

.menubox a, .menuboxS a {
	display: inline-block;
	vertical-align:top;
	overflow: hidden;
	width: 94px;
	height: 59px;
	white-space: normal;
	color: #5f5f01;
	font-family: Tahoma,"Trebuchet MS",sans-serif;
	font-size: .9em;
	text-align:center;
	text-decoration:none;
}
.menubox div {
	display: inline-block;
}


.menuboxS a {
	height: 60px;
	width: auto;
}
.menuboxS a:hover,.menubox a:hover  {
	background: #aaccaa;
}
.menuboxS a img {
	height: 60px;
}


a.hlt {
	background: #a4ca7e;
	color: black;
}

.botarw {
	position: absolute;
	right: 0px;

}

.mid-menu {
	font-size: .8em;
	text-align: center;
	margin-bottom: 10px;
	display:block;
}

.ai {
	font-size: .7em;
	text-align: center;
	margin-bottom: 10px;
	display:block;
}


.table-font {
	font-size: .8em;
}

.men2arw {
	position: absolute;
	right: 0;
}

/* pixel widths */
.w95 { width: 95px; margin-left:auto; margin-right:auto }
.w125 { width: 125px; margin-left:auto; margin-right:auto }
.w150 { width: 150px; margin-left:auto; margin-right:auto }
.w175 { width: 175px; margin-left:auto; margin-right:auto }
.w200 { width: 200px; height:auto; margin-left:auto; margin-right:auto }
.w225 { width: 225px; height:auto; margin-left:auto; margin-right:auto }
.w250 { width: 250px; margin-left:auto; margin-right:auto }
.w275 { width: 275px; margin-left:auto; margin-right:auto }
.w300 { width: 300px; height:auto; margin-left:auto; margin-right:auto }
.w325 { width: 325px; margin-left:auto; margin-right:auto }
.w350 { width: 350px; margin-left:auto; margin-right:auto }
.w375 { width: 375px; margin-left:auto; margin-right:auto }
.w400 { width: 400px; height:auto; margin-left:auto; margin-right:auto }
.w500 { width: 500px; margin-left:auto; margin-right:auto }
.w600 { width: 600px; margin-left:auto; margin-right:auto }

/* percentage widths */

.w100 { width: 100%; height:auto }

.w90 { width: 90%; margin-left:auto; margin-right:auto }
.w80 { width: 80%; margin-left:auto; margin-right:auto }
.w70 { width: 70%; margin-left:auto; margin-right:auto }
.w60 { width: 60%; margin-left:auto; margin-right:auto; height:auto }
.w50 { width: 50%; margin-left:auto; margin-right:auto; height:auto }
.w40 {
  width: 40%;
  margin-left: auto;
  margin-right: auto;
}

/* On screens smaller than 600px, increase the width */
@media screen and (max-width: 600px) {
  .w40 {
    width: 70%;
  }
}


.top-pic125 { width: 125px; height: 125px; margin-left:auto; margin-right:auto }
.img-125 { width: 125px; height: 125px; }

.container { display: flex; flex-wrap: wrap; justify-content: center; background-color:white; width: 100%}

h1, h2, h3, .caption, .note-text {
	font-family: Verdana,Arial,sans-serif ;
	font-style: normal;
	font-weight: normal;
	text-align: center;
}
	
h1 { color:#CC3300; font-size: 2.2em; font-family: Arial, Verdana,sans-serif ; margin-top: 18px; margin-left:auto; margin-right:auto; width: 90% }

h1 span { display: inline; } @media (max-width: 600px) { .line1 { display: block; } }

h2 { color: #9900CC; font-size: 1.6em; margin-top: 20px }

h3 { font-size: 1.3em; color:#2f7342;}


p { color:#5f5f01; text-align:left; font-size:1em }

.abstract {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	color: #007700;
	font-style: italic;
	font-size: .9em;
	width: 90%
}

.f {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	height: 16px;
	width: 16px
}

.note-text {
	color: #6a6402;
	font-size: .9em;
	text-align: left;
}

li {
	text-align: left;
}
	
.caption {
	text-align:center;
	color: #6a6402;
	font-style: italic;
	font-size: .9em;
}

.caption-left {
	text-align:left;
	color: #6a6402;
	font-style: italic;
	font-size: .9em;
}

.credit {
	text-align: right; font-style: italic; font-size: .9em;
}


.by-credit {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	font-size: .9em;
	font-style:italic;
	width: 80%;
}



.caption-narrow {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	color: green;
	font-size: .8em;
	font-style: normal;
}

.caption-flex {
	color: #6a6402;
	font-style: italic;
	font-size: .9em;
	width:90%;
	margin-top:0;
	margin-left:auto; margin-right:auto;
	text-align:center
}

.caption-wide {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	color: #6a6402;
	font-style: italic;
	font-size: .9em;
	width: 90%
}

.item {
  background-color: #f1f1f1;
  width: 170px;
  text-align: center;
  margin: 6px;
}

.item-white {
  background-color: white;
  width: 170px;
  text-align: center;
  margin: 6px;
}

.by {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	color: #666666;
	font-size: .8em;
	font-style:normal;
	width: 80%;
}

adc-200x200 { 
	width: 200px; height: 200px; 
	margin-left: auto; margin-right:auto;
	background-color:#e6e6c9;
}

.adc-300x250 {
  width: 300px;
  height: 250px;
  margin: 20px auto;
  text-align: center;
  background-color: #f9f9f9;
  border: 1px dotted #ccc;
}
.ad-placeholder-text {
  font-size: 0.85em;
  color: #666;
  padding-top: 40px;
}

.adc-336x280 {
	width: 336px; height: 280px; 
	margin-left: auto; margin-right:auto;
	background-color:#e6e6c9;
}

.adc-w320x100 {
	width: 320px;  height: 100px;
	margin-left: auto; margin-right:auto;
	background-color:#e6e6c9;
}


.adc-60 {
	width: 60%; 
	margin-left: auto; margin-right:auto;
	background-color:#e6e6c9;
}

.adc-70 {
	width: 70%; height: auto; 
	margin-left: auto; margin-right:auto;
	background-color:#e6e6c9;
}

.adc-80 {
    width: 80%;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    background-color: #f7faff;
}


/* On screens smaller than 600px, increase the width */
@media screen and (max-width: 500px) {
  .adc-80 {
    width: 90%;
  }
}

/* On screens smaller than 400px, increase the width */
@media screen and (max-width: 500px) {
  .adc-80 {
    display:none
  }
}


.back-color,.back-color1n, .back-colorn, .back-color2n, .back-color3n, .back-color4n, .back-color5n, .back-color6n, .back-color7n, .back-color8n, .back-color9n {
	padding: 12px;
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: auto;
	margin-right: auto;
	width: 90%; height: auto;
}


.back-color {
	background-color: #fbf8f7;
}

.back-colorn {
	background-color: #fbf8f7;
}
.back-color1n {
	background-color: #edf6e3;
}
.back-color2n {
	background-color: #f2f2f2;
}
.back-color3n {
	background-color: #ffffea;
}
.back-color4n {
	background-color: #eef8fa;
}
.back-color5n {
	background-color: #f9f6ec;
}
.back-color6n {
	background-color: #f5f5fe;
}
.back-color7n {
	background-color: #ededed;
}
.back-color8n {
	background-color: #f6edf8;
}
.back-color9n {
	background-color: #d8eaef;
}
.note-webmaster {
   	background-color: white; border: 1px green solid; margin-left:auto; margin-right:auto; padding: 5px; width: 80%;
}

@media (max-width: 600px) {
    h1 { font-size: 1.8em;}    
}





/*  So just open your style.css and paste this section at the very end of the file: */

/* --- “Change cookie preferences” link --- */
#reopen-cookie-link a {
  color: #333;
  text-decoration: underline;
}

#reopen-cookie-link a:hover {
  text-decoration: none;
}


/* Style the buttons to match your existing theme */


.cookie-buttons {
  margin-top: 8px;
}

.cookie-buttons .btn {
  margin: 4px;
  padding: 6px 14px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-weight: 600;
}

.cookie-buttons .primary {
  background: #f6d95a;     /* green accept */
  color: #333;
}

.cookie-buttons .secondary {
  background: #f6d95a;        /* grey reject */
  color: #333;
}

.cookie-buttons .manage {
  background: #f6d95a;        /* darker for manage */
  color: #333;
}

.cookie-buttons .btn:hover {
  opacity: 0.9;
}

/* ---- Overlay ---- */
#cookie-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.6);
  z-index: 9998;
}

/* ---- Modal ---- */
#cookie-modal {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  width: 90%;
  max-width: 400px;
  background: #fffbe6;
  color: #000;
  transform: translate(-50%, -50%);
  z-index: 9999;
  padding: 20px;
  

    border: 2px solid #b59a00;
  
  
  
  border-radius: 8px;
  box-shadow: 0 0 12px rgba(0,0,0,0.4);
  text-align: left;
  font-size: 15px;
}

.cookie-modal-content h3 {
  margin-top: 0;
  font-size: 1.2em;
}

.cookie-modal-content label {
  display: block;
  margin: 8px 0;
  }
  
  
  
  
  
  
/* Dimmed background overlay */
#cookie-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.55);  /* subtle dark overlay */
    z-index: 99998;
    display: none;
}

/* The modal container */
#cookie-modal {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 440px;
    max-width: 90%;
    background: #ffffcc;                 /* same colour as banner */
    border: 3px solid #999;              /* same border */
    box-shadow: 0 0 15px rgba(0,0,0,0.4); /* same drop shadow */
    padding: 0;                           /* box houses internal box */
    z-index: 99999;
    display: none;
    border-radius: 6px;
}

/* Internal content box (your existing #cookie-modal-box) */
#cookie-modal-box {
    padding: 20px;
    text-align: left;
}

/* Title */
#cookie-modal-box h2 {
    text-align: center;
    margin-top: 0;
}

/* Checkboxes */
#cookie-modal-box label {
    display: block;
    margin: 12px 0;
    font-size: 15px;
}

/* Buttons */
#cookie-modal-box button {
    margin-top: 20px;
    margin-right: 10px;
    padding: 8px 14px;
    cursor: pointer;
    border: none;
    background: #5f5f01;   /* same deep olive as banner buttons */
    color: white;
    font-size: 14px;
}

#cookie-modal-box button:hover {
    opacity: 0.85;
}  
  
  
  
  
  
}

