:root {
  /* RBG COLOR MAP: */
  --dgreen1: 47, 118, 16;    /* 2F7610 */
  --dgreen2: 49, 149, 30;    /* 31951E */
  --dgreen3: 50, 157, 30;    /* 329D1E */

  --lgreen1: 33, 183, 5;     /* 21B705 */
  --lgreen2: 65, 211, 38;    /* 41D326 */
  --lgreen3: 111, 223, 90;   /* 6FDF5A */
  --lgreen4: 167, 235, 154;  /* A7EB9A */
  --lgreen5: 216, 251, 210;  /* D8FBD2 */
  --lgreen6: 240, 255, 238;  /* F0FFEE */

  --algreen1: 176, 255, 176; /* B0FFB0 */
  --algreen2: 241, 255, 241; /* F1FFF1 */
   
  --dbrown1: 77, 62, 31;    /* 4D3E1F */
  --dbrown2: 147, 107, 50;  /* 936B32 */
  --dbrown3: 171, 96, 30;   /* AB601E */
  --dbrown4: 186, 142, 95;  /* C48E5F */
  
  --lbrown1: 232, 204, 127;  /* E8CC7F */
  --lbrown2: 241, 220, 163;  /* F1DCA3 */
  --lbrown3: 249, 234, 149;  /* F9EAC2 */

  --white1: 253, 253, 253;  /* FDFDFD */
  --white2: 241, 241, 241;  /* F1F1F1 */
  --white3: 220, 220, 220;  /*  */

}

body { 
	background-image: none; 
	background: linear-gradient(to right, #ffffff -25%, rgb(var(--white1)) 40%, rgb(var(--white2)) 100%);
	border: none; 
	color: black; 
	font-family: Arial; 
	font-size: 14px; 
	margin: 0; 
	padding: 0.25em; 
	outline: none; 
	vertical-align: top;
	/* height: 700px; */
}

/* @media only screen and (max-width: 1200px; resolution: 150dpi; ) {
}
*/


.container { margin: 2.5em 0.5em 0.25em 0.5em ;  
}
footer.container { 
	float: right;
	font-size: 90%;
	color: rgb(var(--lgreen1));
}
footer.container:hover { 
	color: rgb(var(--lgreen2)); text-decoration: underline;
}
/*
  title color (dark->light): 2F7610  31951E  329D1E        light: 21B705  41D326  6FDF5A  A7EB9A  D8FBD2
  brown: 4D3E1F   936B32  AB601E  C48E5F
*/

h1 { color: rgb(var(--dgreen1)); font-weight: bold; margin-top: 0; 
	text-shadow: 2px 2px 2px rgba(0,0,0,0.4);
	}
h2 { color: rgb(var(--dgreen2)); font-weight: bold; margin-top: 0; 
	text-shadow: 1px 1px 2px rgba(0,0,0,0.4);
	}
h3 { color: rgb(var(--dgreen3)); font-weight: bold; margin-top: 0; 
	text-shadow: 1px 1px 2px rgba(0,0,0,0.4);
	}
h4 { color: rgb(var(--lgreen1)); font-weight: bold; margin-top: 0; 
	text-shadow: 1px 1px 2px rgba(0,0,0,0.4);
	}
.pseudo_h1 { font-size: 200%; color: color: rgb(var(--dgreen1)); font-weight: bold; margin-top: 0; 
	text-shadow: 2px 2px 2px rgba(0,0,0,0.4);
}
.pseudo_h2 { font-size: 150%; color: rgb(var(--dgreen2)); font-weight: bold; margin-top: 0; 
	text-shadow: 1px 1px 2px rgba(0,0,0,0.4);
}
.pseudo_h2_img { font-size: 150%;  font-weight: bold; margin-top: 0; 
	text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
	vertical-align: top; padding-right: 1.5em;  color: rgb(var(--lgreen3));
}
.pseudo_h3_img { 
	font-size: 100%;
	font-weight: bold; margin-top: 1em; 
	text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
	vertical-align: top; padding-right: 1.5em;  color: rgb(var(--lgreen3));
}
/* :hover { color: rgb(var(--lgreen2))                                  */
/* :hover { color: rgb(var(--lgreen1)); }                                     */
/*  h1:hover  { color:red; font-weight: bold; margin-top: 0; }   */

.a_link { color: rgb(var(--lgreen1)); }
.a_link:hover { color: rgb(var(--lgreen2)); text-decoration: underline; }

.activetxt {
	text-shadow: 1px 2px 1px rgba(0,0,0,0.1);
    transition: 0.2s ease-in-out ;  
}
.activetxt:hover {
	transform: scale(1.025);
	text-shadow: 1px 2px 1px rgba(0,0,0,0.3);
}

p { margin: 1em 1em 1em 0; }
a { text-decoration: none; color: inherit;  }
/* a:hover { text-decoration: underline;  }        */
/* a { color: rgb(var(--lgreen2));  text-decoration: none;  }  */
/*  a:hover { color: #69FF55; }                    */



hr {
	margin: 1.5em 0em;  
	color: rgba(76, 67, 32, 0.15);
	height: 6px; 
	background: rgba(76, 67, 32, 0.75) linear-gradient(to right, rgba(230, 230, 230, 0.2) 0%, rgba(76, 67, 32, 0.75) 20%, rgba(76, 67, 32, 0.75) 80%, rgba(230, 230, 230, 0.2) 100%);
	border-radius: 4px;
}


.titled_hr {
	font-family: consolas, monospace;
	font-size: 80%;
	margin: 3em 1em 1em 1em;
	padding: 0;
	background: rgba(76, 67, 32, 0.75) linear-gradient(to right, rgba(230, 230, 230, 0.2) 0%, rgba(76, 67, 32, 0.75) 20%, rgba(76, 67, 32, 0.75) 80%, rgba(230, 230, 230, 0.2) 100%); 
	border-radius: 4px;
	height: 6px; 
	box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.6);	
}
.titled_in_hr {
	margin: 2.5em 0em 0.5em 0em;
	padding: 0.1em 4em 0.1em 1.5em;
	background:  linear-gradient(to right, rgba(76, 67, 32, 1.0) 0%, rgba(76, 67, 32, 0.8) 70%, rgba(76, 67, 32, 0.5) 100%); 
	border-radius: 5px;
	color: rgba(255,255,255, 0.9);
	position: relative;
	top: -1em;
}

.top_bar_1 {
	padding: 0; margin: 0;
	background: rgba(76, 67, 32, 0.75) linear-gradient(to right, rgba(230, 230, 230, 0.2) 0%, rgba(76, 67, 32, 0.75) 20%, rgba(76, 67, 32, 0.75) 80%, rgba(230, 230, 230, 0.2) 100%);
/*	position: fixed; top: 0px; z-index: 2;  */
/* 	border-radius: 4px; */
}
.top_bar_2 { 
	padding: 0; margin: 0;
/* 	overflow: auto; */
	border-bottom: 2px solid #A19664; 
}
.top_bar_3 { 
	padding: 0; margin: 0;
	/* width: 100%; overflow: hidden; vertical-align: center; */
	background: rgba(76, 67, 32, 0.75) linear-gradient(to right, rgba(76, 67, 32, 0.2) 0%, rgba(76, 67, 32, 0.75) 20%, rgba(76, 67, 32, 0.65) 80%, rgba(230, 230, 230, 0.2) 100%);
}
a.top_nav_link {
	font-size: 10pt ; 
	padding: 0.5em  1em; 
	margin: 0;
	/*  margin: 0.25em 0.5em;  */
	color: white;
	font-weight: bold; 
	border-radius: 4px;
}

a.top_nav_link:hover { 
	color: #3EEB0A; 
	text-decoration: underline;
	background: rgba(93, 83, 43, 0.65) linear-gradient(to right, rgba(76, 67, 32, 0.65) 0%, rgba(177, 163, 89, 0.5) 20%, rgba(177, 163, 89, 0.5) 80%, rgba(93, 83, 43, 0.65) 100%);
}

a.top_nav_link2 {
	font-size: 10pt ; 
	padding: 0.5em  1em; 
	margin: 0;
	/*  margin: 0.25em 0.5em;  */
	color: white;
	font-weight: bold; 
	border: 10px solid transparent; 
	/* border-radius: 4px; */
	border-image: url('../img/menubg1.png') 10% stretch;

}
a.top_nav_link2:hover { 
	color: #3EEB0A; 
	text-decoration: underline;
}

a.top_nav_link3 {
    background-color: rgb(var(--dbrown1));
    color: white;
    padding: 0.5em 1em;
	border: none;
    cursor: pointer;
	/* background: #6C5D3A linear-gradient(to bottom, #6C5D3A 0%, #3B2E16 100%) repeat scroll 0 0; */
	background: #6C5D3A   linear-gradient(to bottom, #6C5D3A 0%, #3B2E16 100%) repeat scroll 0 0 ;
	border-radius: 0.5em;
   
}
a.top_nav_link3:hover { 
 	 background: rgb(var(--white2)) linear-gradient(to bottom, #AB8852 0%, #7C5423 100%) repeat scroll 0 0 ;
}

.top_nav_sep {
	padding: 0.25em 0.5em ; margin: 0; 
	display: inline-block;
	background: #A19664; 
	color: white;
	background: #595030; 
	background-image: url("../img/breadcrump_sep2.png");
	/* background-size: 16px 16px; */
	/* background-position: 50% 50%; */
	background-size: 2em 1.75em; 
	border-bottom: none; 
}



.shadow2  { box-shadow: 3px 4px 5px rgba(0, 0, 0, 0.4); }
.shadow23 { box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.6); }
.shadow3  { box-shadow: 5px 6px 7px rgba(0, 0, 0, 0.6); }

.tiny_thumbs { box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.6);  margin-right: 1em; width: 64px;  }


/*
==============================================
== Boxes == 
==============================================
*/


#logo { margin: 0 5px 0 0; }
.slogan { color: #fd8a2e; font-size: 13px; margin-top: -20px; }
.box { 
/*	background: linear-gradient(to bottom, #ffffff 0%, rgb(var(--white2)) 100%) repeat scroll 0 0
	, linear-gradient(to right, #ffffff 0%, var(--white3) 100%);
	background-blend-mode: darken; */
	
	background: linear-gradient(to bottom, white -10%, rgb(var(--white1)) 60%, rgb(var(--white2)) 100%) 
	, linear-gradient(to right, white -10%, rgb(var(--white1)) 45%, rgb(var(--white2)) 100%);
	background-blend-mode: multiply, multiply; 
	
	border-radius: 0.5em;
	border: 1px solid #c9cacb; 
	margin: 12px ; 
	padding: 20px; 
	position: relative;
	box-shadow: 4px 4px 3px  rgba(60, 60, 60, 0.1);
	
	/* -webkit-transition: background 0.4s ease-out;  
    -moz-transition: background 0.4s ease-out ;  
    -o-transition: background 0.4s ease-out;   */
 /*	-webkit-transition: background 0.2s ease-out, background-image 0.2s ease-out  ;  
    -moz-transition: background 0.2s ease-out, background-image 0.2s ease-out  ;  
    -o-transition: background 0.2s ease-out, background-image 0.2s ease-out  ;  */
    transition: 0.2s ease-in-out ;  
 
}

.box_video {
	border-radius: 0.5em;
	border: 1px solid #c9cacb; 
	margin: 12px ; 
	padding: 20px; 
	position: relative;
    display: inline-block;
}
.box_slim { 
	background: rgba(0, 0, 0, 0), linear-gradient(to bottom, #ffffff -2%, rgb(var(--white2)) 100%) repeat scroll 0 0;
	border-radius: 0.5em;
	border: 1px solid #c9cacb; 
	margin: 0 !important; 
	padding: 0 !important; 
	position: relative;
	
	/* -webkit-transition: background 0.4s ease-out;  
    -moz-transition: background 0.4s ease-out ;  
    -o-transition: background 0.4s ease-out;   */
/*	-webkit-transition: background 0.2s ease-out, background-image 0.2s ease-out  ;  
    -moz-transition: background 0.2s ease-out, background-image 0.2s ease-out  ;  
    -o-transition: background 0.2s ease-out, background-image 0.2s ease-out  ;  
    transition: background 0.2s ease-out, background-image 0.2s ease-out ;  */
     transition: 0.2s ease-in-out ;  

}

.inner_box { 
	margin: 0px ; 
	padding: 20px; 
}
.active_box {
	/*-webkit-transition: background 4.2s ease-out, background-image 4.2s ease-in-out  ;  
	-moz-transition: background 4.2s ease-out, background-image 4.2s ease-out  ;  
	-o-transition: background 4.2s ease-out, background-image 4.2s ease-out  ;  
	transition: background 4.2s ease-out, background-image 4.2s ease-out ;  */
	transition: 0.2s ease-in-out ;  
	
	background-position: 0px 0px, 50% 50%;  
	background-size: 150% 100%;  

} 
.active_box:hover { 
	border: 1px solid #88FFAA; 
/*	background:  linear-gradient(to bottom, #B0FFB0 0%, #F1FFF1 100%) repeat scroll 0 0, radial-gradient( rgb(var(--dgreen3)), rgb(var(--lgreen1)) ); */
	background:  linear-gradient(to bottom, rgba(var(--algreen1), 1) 0%, rgba(var(--algreen2), 1) 100%) repeat scroll 0 0, radial-gradient(rgba(0,0,0,0.6), rgba(var(--lgreen1),0.9) ); 
	background-blend-mode: screen; 
	background-position: 0px 0px, 50% 50%;  
    background-size: 100% 100%;  
	border-size: 3px; 
	transform: scale(1.025);
	box-shadow: 4px 4px 2px  rgba(60, 60, 60, 0.3);
}

/* unused 
.active_img_box_inner {
	margin: 0 !important; 
	padding: 20px; 
	height: 100%; width: 100%; 
	overflow: hidden;
	display: inline-block;
	opacity: 0.0; 
	background-image:  linear-gradient(to left, red 0%, blue 100%) !important;
	background-clip: padding-box;
	background-repeat: no-repeat;
	position: inherit; 
	width: 96px; 
}
.active_img_box_inner:hover {
	background-blend-mode: screen, screen;
	opacity: 0.5; 
	background-image:  linear-gradient(to left, red 0%, blue 100%) !important;
	transform: scale(1.3);	
}
*/
.box_img_box { 
	margin: 0 2em 0 0; 
	padding: 0.5em; 
	float: left; 
	border: none; 
	position: relative; 
	width: 96px;
	text-align: center;
	vertical-align: middle;
}

.active_img_box_wrapper {
	box-sizing: border-box;
	overflow: hidden; 
}

.active_img_box {
/*	background-color: rgba(0,0,0,1.0); */
/*	background-image: linear-gradient(to bottom, red 0%, blue 100%), radial-gradient(yellow, green); */
	background-position: center; background-size: cover; height: 10em; background-repeat: no-repeat; 
/*	background-blend-mode: screen, screen; */
	background-size: cover;
 /*   background-size: 1px 200px;  */
	
	/*-webkit-transform: scale(1);*/
	transform: scale(1.00);
	/*-webkit-transition: .2s ease-in-out;*/
	transition: .2s ease-in-out;
	
}
.active_img_box:hover {
	/* background-image: linear-gradient(to bottom, red 0%, blue 100%), radial-gradient(yellow, green); */
	/* background-color: rgba(150,255,50,0.3); */
/*	-webkit-transform: scale(1.3); */
	transform: scale(1.05);
/*    background-position: 200px;  */
}



.active_img_box2 {
    background: -webkit-linear-gradient(#C7D3DC,#5B798E);  
    background: -moz-linear-gradient(red,blue);  
    background: -o-linear-gradient(#C7D3DC,#5B798E);  
    background: linear-gradient(red,blue);  
  
    -webkit-transition: background 0.2s ease-out;  
    -moz-transition: background 0.4s ease-out ;  
    -o-transition: background 0.2s ease-out;  
    transition: background 0.4s ease-out ;  
  
    background-size:1px 200px;  
    border-radius: 10px;  
    border: 1px solid #839DB0;  
    cursor:pointer;  
    width: 150px;  
    height: 100px;  
}  
.active_img_box2:hover {
    background-position: 200px;  
}

.inactive_img_box {
 	background-color: rgba(122,122,122,0.9);  
	background-position: center; background-size: cover; height: 10em; background-repeat: no-repeat; 
	background-blend-mode: luminosity, luminosity; 
	background-size: cover;
		
}

.seo { float: left; padding:0 20px 0 0; margin-top:-6px; }
.mx { float: left; padding:0 20px 0 0; }

.darkbggradient { background: linear-gradient(to bottom, rgba(0, 0, 0, 255) 0%, rgba(5, 5, 5, 255) 80%, rgba(30, 30, 30, 255) 100%) repeat scroll 0 0; }

.darkbox { 
	background: rgba(20, 20, 20, 128) linear-gradient(to bottom, rgba(25, 25, 40) 0%, rgba(70, 50, 30) 95%, rgba(120, 110, 150) 100%) repeat scroll 0 0; 
	box-shadow: 2px 3px 4px rgba(234, 225, 225, 0.6);
	/* border: 1px solid #112; */
	margin: 1em 0 0 0; padding: 1em 1em ; position: relative; 
	
}

/* Mini box thumnails */
.outer_box { 
	border: none; 
	margin: 0;
	padding: 0; 
	position: relative;
}
.small_box {
	margin: 12px 12px !important; 
	padding: 0 !important; 
}
.active_small_box {
	height: calc(8em + 6px);
	transition: 0.2s ease-in-out ;  
	background-position: center; 
	background-size: cover; 
	background-repeat: no-repeat; 
	background-size: cover;
}
.active_small_box:hover {
	transform: scale(1.025);
}


/* tmp layout table styles: */
table.t_layout {
	margin: 0; padding: 0; border: none; 
}
tr.t_layout {
	margin: 0; padding: 0; border: none;  
}
td.t_layout {
	margin: 0; padding: 8px 16px;  border: none; 
}
td.t_layout_l {
	margin: 0; padding: 8px 16px 8px 0px;   border: none; 
}
td.t_layout_r {
	margin: 0; padding: 8px 0px  8px 16px;  border: none; 
}

table.timetable {
	font-family: verdana, courier, monospace; 
	border: 1px solid #555;
	margin: 0; padding: 0; 
	border-collapse: separate;
	border-spacing: 0;
	width: 100%; height: 100%; 
}

table.timetable tr {
	font-family: consolas; 
	margin: 0; padding: 0;
}

table.timetable tr td,th {
	font-size: 80%; 
	text-align: right; 
	font-family: consolas; 
	border: 1px solid #AAA;
	margin: 0; 
	padding: 2px 3px; 
}
table.timetable tr th {
	background: #DEDEDE; 
}
td.nite2 { background: black; color: white; }
td.nite1 { background: #652; color: white; }
td.dusk { background: #D80; color: black; }
td.morn  { background: yellow; color: black; }
td.anoon { background: #DD2; color: black; }
td.even { background: #BA4; color: black; }


/*
  box-shadow: 0px 3px 10px rgba(34, 25, 25, 0.4);
  background-image: linear-gradient(top,#4d90fe,#357ae8);

  */
  
  
/*
==============================================
== Column Layout 
==============================================
*/


.w3-col {float:left;width:100%}


@media (max-width:450px) { 
.w3-col.m1  { width: 49.99999% }
.w3-col.m2  { width: 99.99999% }
.w3-col.m3  { width: 99.99999% }
.w3-col.m4  { width: 99.99999% }
.w3-col.m5  { width: 99.99999% }
.w3-col.m6  { width: 99.99999% }
.w3-col.m7  { width: 99.99999% }
.w3-col.m8  { width: 99.99999% }
.w3-col.m9  { width: 99.99999% }
.w3-col.m10 { width: 99.99999% }
.w3-col.m11 { width: 99.99999% }
.w3-col.m12 { width: 99.99999% }
}

@media (max-width:700px) and (min-width:451px) { 
.w3-col.m1  { width: 24.99999% }
.w3-col.m2  { width: 49.99999% }
.w3-col.m3  { width: 74.99999% }
.w3-col.m4  { width: 99.99999% }
.w3-col.m5  { width: 99.99999% }
.w3-col.m6  { width: 99.99999% }
.w3-col.m7  { width: 99.99999% }
.w3-col.m8  { width: 99.99999% }
.w3-col.m9  { width: 99.99999% }
.w3-col.m10 { width: 99.99999% }
.w3-col.m11 { width: 99.99999% }
.w3-col.m12 { width: 99.99999% }
}

@media (max-width:1200px) and (min-width:701px) { 
.w3-col.m1  { width: 16.66666% }
.w3-col.m2  { width: 33.33333% }
.w3-col.m3  { width: 49.99999% }
.w3-col.m4  { width: 66.66666% }
.w3-col.m5  { width: 83.33333% }
.w3-col.m6  { width: 49.99999% }
.w3-col.m7  { width: 99.99999% }
.w3-col.m8  { width: 99.99999% }
.w3-col.m9  { width: 99.99999% }
.w3-col.m10 { width: 99.99999% }
.w3-col.m11 { width: 99.99999% }
.w3-col.m12 { width: 99.99999% }
}

@media (min-width:1201px) { 
.w3-col.m1  { width: 8.33333%  }
.w3-col.m2  { width: 16.66666% }
.w3-col.m3  { width: 24.99999% }
.w3-col.m4  { width: 33.33333% }
.w3-col.m5  { width: 41.66666% }
.w3-col.m6  { width: 49.99999% }
.w3-col.m7  { width: 58.33333% }
.w3-col.m8  { width: 66.66666% }
.w3-col.m9  { width: 74.99999% }
.w3-col.m10 { width: 83.33333% }
.w3-col.m11 { width: 91.66666% }
.w3-col.m12 { width: 99.99999% }
}

/* ----------- Retina Screens ----------- */
@media screen 
  and (min-device-width: 1200px) 
  and (max-device-width: 1600px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (min-resolution: 192dpi) { 
}

/* 1.25 dpr */
@media 
(-webkit-min-device-pixel-ratio: 1.25), 
(min-resolution: 120dpi){ 
    /* Retina-specific stuff here */
	body {
		font-size: 14.5px; 
	}
}

/* 1.3 dpr */
@media 
(-webkit-min-device-pixel-ratio: 1.3), 
(min-resolution: 124.8dpi){ 
    /* Retina-specific stuff here */
	body {
		font-size: 15px; 
	}
}

/* 1.5 dpr */
@media 
(-webkit-min-device-pixel-ratio: 1.5), 
(min-resolution: 144dpi){ 
    /* Retina-specific stuff here */
	body {
		font-size: 16px; 
	}
}


/* iPad in landscape
------------------------------*/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
	/* STYLES GO HERE */
}

/*  iPad in portrait & landscape
------------------------------*/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px)   {
	/* STYLES GO HERE */
}

/*  Retina iPad in portrait
------------------------------*/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait)
and (-webkit-min-device-pixel-ratio: 2)  {
	/* STYLES GO HERE */
}


/*  iPhone 6 in portrait
------------------------------*/
@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 667px) 
and (orientation : portrait)  {
	/* STYLES GO HERE */
	.w3-col.*  { width: 99.99999% }

}

/*  iPhone 6 Plus in portrait
------------------------------*/
@media only screen 
and (min-device-width : 414px) 
and (max-device-width : 736px) 
and (orientation : portrait)  {
	/* STYLES GO HERE */
}


/*  iPhone 5 & 5S in portrait
------------------------------*/
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) 
and (orientation : portrait)  {
	/* STYLES GO HERE */
}



/*  iPhone 2G-4S in portrait
------------------------------*/
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) 
and (orientation : portrait)  {
	/* STYLES GO HERE */
}



/* ----------- Apple Watch ----------- */
@media
  (max-device-width: 42mm)
  and (min-device-width: 38mm) { 

}






/*
==============================================
== Dropdown Menu == 
==============================================
*/

/* Style The Dropdown Button */
.dropbtn {
    background-color: rgb(var(--dbrown1));
    color: white;
    padding: 0.5em 1em;
	border: none;
    cursor: pointer;
	/* background: #6C5D3A linear-gradient(to bottom, #6C5D3A 0%, #3B2E16 100%) repeat scroll 0 0; */
	background: #6C5D3A   linear-gradient(to bottom, #6C5D3A 0%, #3B2E16 100%) repeat scroll 0 0 ;
	border-radius: 0.5em;
    /*-webkit-transition: background 2s;  Safari 
    transition: background 2s;*/
}
/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {
 	 background: rgb(var(--white2)) linear-gradient(to bottom, #AB8852 0%, #7C5423 100%) repeat scroll 0 0 ;
  /* animation-name: example;     */
  /*  animation-duration: 4s;	  */
}

/* The animation code */
@keyframes example {
    0%    { background: #6C5D3A /* linear-gradient(to bottom, #6C5D3A 0%, #3B2E16 100%) repeat scroll 0 0 ; */ }
    100%  { background: #AB8852 /* linear-gradient(to bottom, #AB8852 0%, #7C5423 100%) repeat scroll 0 0 ; */ }
}


/* The container <div> - needed to position the dropdown content */
.dropdown {
    position: relative;
    display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
	border-radius: 0.5em;
}

/* Links inside the dropdown */
.dropdown-content a {
    color: black;
    padding: 0.5em 2em 0.5em 1em;
    text-decoration: none;
    display: block;
	background: rgb(var(--white2)) linear-gradient(to bottom, #ffffff 0%, rgb(var(--white2)) 100%) repeat scroll 0 0;
	border-radius: 0.5em;
	border: 1px solid white; 
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {
	background: rgba(0, 0, 0, 0) linear-gradient(to bottom, #B0FFB0 0%, #F1FFF1 100%) repeat scroll 0 0; 
	border: 1px solid #88FFAA; 
}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
    display: block;
}


.dropdown-content a .rmenu1 {
}

a.rmenu2 {
	padding: 0.5em 2em 0.5em 2em;
	font-size: 95%; 
}
a.rmenu3 {
	padding: 0.25em 2em 0.25em 3em;
	font-size: 90%; 
}
a.rmenu4 {
	padding: 0.25em 2em 0.25em 4em;
	font-size: 85%;
}
.fontimgsize {
	height: 1em; 
    width: 1em;
}