/*Copyright "Jewish Life in Jericho!" No unauthorised copying of this stylesheet!!*/
body {
border:  none;
  margin: 0px;
  padding: 0px;
  color: black;
text-align: left;
  direction: ltr;
  font-size: 14px;
  font-weight: normal;
  line-height: 18px; 
/* background-color: white; */
  font-family: Arial,Helvetica,sans-serif;
  font-style: normal;
  list-style-type: square;
  list-style-position: outside;
}
h1, h2, h3, h4, h5, h6 {
  font-family: Arial,Helvetica,sans-serif;
  font-weight: bold;
  margin: 8px;
}
p{
  margin: 10px;
}
ul {
list-style-type: square;
list-style-position: outside;
}
li{
  margin: 8px;
}
h1 {
  text-align: center;
  font-size: 1.6em;
  letter-spacing: 2px;
  color: #c58d2a; /* brown-red */
}
h2 {
  text-align: left;
  font-weight: bold;
  font-size: 1.4em; 
  color: #c58d2a; /* brown-red */
}
h3 {
  text-align: left;
  font-weight: bold;
  font-size: 1.2em;
  color: #1f499b; /* blue */
}
h4 {
  text-align: left;
  font-weight: bold;
  font-size: 1em;
  font-style: italic;
  color: #5673ac; /* dull blue */
  margin-left: 20px;
}
h5 {
  text-align: left;
  font-weight: bold;
  font-size: 1em;
  color: black;
}
.subheading {
text-align: left;
font-weight: bold;
font-size: 1em;
font-style: italic;
margin-left: 20px;
color: #666666;
}
/* Various content styles */

.fineprint {
  font-size: 0.9em;
  line-height: 15px;
}
.fineprint p {
margin: 6px;
}
/* Draw attention */
b {
font-weight: bold;
}
em {
font-style: normal;
font-weight: normal;
background-color: yellow;
}
strong {
font-weight: bold;
}
.action {
color: red;
background-color: yellow;
}
.action time {
color: red;
font-size: 1.1em;
font-family: David, "Times New Roman", Georgia, Serif;
}
.attention { /* action in-line */
color: white;
font-size: 1.1em;
background-color: #d2691e; /* orange */
}
.do { /* action paragraph */
color: white;
font-size: 1.4em;
font-weight: bold;
background-color: #d2691e; /* orange */
border: 2px solid red;
border-radius: 8px;
box-shadow: 5px 5px 6px #282828;
padding: 2px;
}
.do p {
line-height: 25px;
}
.do a:link {
color: white;
}
.do a:visited {
color: white;
}

.intro { /* introductory remarks */
font-style: italic;
/* font-size: 0.9em; */
color: black;
background-color: #dedede;
}

i {
font-style: italic;
}

.author {
color: #d2691e; /* orange */
font-family: David, "Times New Roman", Georgia, Serif;
}

.date {
color: #6d640e; /* green-brown */
font-family: David, "Times New Roman", Georgia, Serif;
}
.date time {
color: #6d640e; /* green-brown */
font-family: David, "Times New Roman", Georgia, Serif;
}

q:lang(en) {
color: green;
font-size: 1.15em;
font-family: David, "Times New Roman", Georgia, Serif;
quotes: none;
}
cite { /* source of quote */
font-size: 0.9em;
font-style: italic;
color: #8b4513; /* brown */
}

/* pictures and their captions */
.picture {
text-align: center;
font-size: 0.9em;
font-style: italic;
 line-height: 15px;
 margin: 5px;
}
.picture a{
text-decoration: none;
font-weight: normal;
}
.picture img {
border: none;
}

/* Multipage horizontal navigation bar */
.multipage_bar {
font-size: 0.9em;
font-weight: bold;
color: black;
vertical-align: middle;
text-align: center;
width: 90%;
height:25px;
margin: 5px auto; 
padding: 1px;
border: none;

background-color: gray;
}
.multipage_bar:hover {
background-color: #afafaf; /* light grey */
}
.multipage_bar a {
font-weight: bold;
}
.multipage_bar a:hover {
text-decoration: none;
}
.multipage_bar img {
border: 0px solid ; 
width: 25px; 
height: 25px; 
vertical-align: middle;
}

/* table */
.innertable {
width: 99%;
border: 1px solid #5b7306; /* green border */
border-collapse: collapse;
padding: 5px;
margin:2px auto;
}
.innertable thead {
font-weight: bold;
background-color: gray;
}
.innertable td {
font-size: 0.9em;
vertical-align: top;
text-align: left;
border: 1px solid #5b7306; /* green border */
padding: 5px;
}
.innerdivider {
width: 100%;
border: none;
padding: 0px;
margin: 0px auto;
}
.innerdivider td {
padding-left: 5px;
padding-left: 5px;
padding-top: 0px;
padding-bottom:0px;
margin:0px auto;
border: none;
width: 50%; 
vertical-align: top;
text-align: left;
}
td .rightdivider {
border-left: 1px solid #5b7306; /* green border */
}
td .leftdivider {
border-right: 1px solid #5b7306; /* green border */
}

/* LINKS*/
a {
text-decoration: underline;
font-weight: normal;
}
a:link {
  color: blue;
  font-weight: normal;
  text-decoration: underline;
}
a:visited {
  color: purple;
  font-weight: normal;
  text-decoration: underline;
}
a:hover {
  color: fuchsia;
  font-style: italic;
  text-decoration: underline;
}
a:active {
  background-color: yellow;
  color: red;
  text-decoration: none;
}
/* Audiolink is deprecated */
/*Use see_more instead of audiolink */
.see_more{
font-size: 0.9em;
font-weight: normal;
}
.see_more a {
font-weight: normal;
text-decoration: none;
}
.see_more a:hover {
text-decoration: underline;
}
.see_more img {
border: 0px solid ; 
width: 25px; 
height: 25px; 
vertical-align: middle;
}

/*AUDIO CONTROL */
 .audiobutton {
font-family: Arial,Helvetica,sans-serif;
padding: 1px;
color: blue;
background: transparent;
border: none;
cursor:pointer;
width: 27px;
}
.audiobutton image {
border: 0px;
margin:0px;
width: 25px;
height: 25px;
/* z-index: 100; */
}

.progressBar { 
padding: 0px;
vertical-align: middle;
border:1px solid #aaaaaa; 
color:#ffffff; 
width:120px; 
height:8px;
display:inline-block; 
} 
.progressing { 
margin: 0px;
padding: 1px;
vertical-align: top;
background-color:#ff0000; /* red  */
height:6px; 
display:inline-block; 
}
.progressTimer {
font-size: 0.8em;
border: 1px solid black;
border-radius: 8px;
padding: 1px;
margin:1px;
display: inline-block;
}
/* OUTER WRAPPERS */
.pagebkgd { /*not used unless page background colour required */
width: 100%; 
text-align: center;
/*background-color: #cae1f1;  theme colour with luminosity 220 */
background-color: white;
}
.outerwrapper { /* use instead of outertable for table-less page configuration */
width: 976px; 
border-left: none; /*2px solid; */
border-right: none; /*2px solid; */
border-top: none;
border-bottom: none;
margin: auto;
padding-left: 5px;
padding-right: 5px;
padding-top: 2px;
padding-bottom: 2px;
color: black;
/* border-color:  #5b7306;  green= theme foreground colour */
/* background-color: white; #c58d2a;  brown-red = theme background colour */ 
text-align: center; 
}
.pagetop { /* outer wrapper sub-class for top-most page element*/
padding-top: 4px;

width: 99%;
}
.pagebottom { /* outer wrapper sub-class for bottom-most page element*/
padding-bottom: 5px;
}

.outertable { /* deprecated */
width: 990px; /*960px; for iPhone compatibility */
border: 2px solid;
margin: auto;
padding: 5px;
color: black;
border-color: #5b7306; /* green= theme foreground colour */
background-color: #c58d2a; /* brown-red = theme background colour */ 
text-align: center; 
/*height: 698px; */
z-index: 1;
}
/*TOP-MOST BANNER */
.top_banner {
font-style: italic;
font-size: 0.9em;
text-align: left;
vertical-align: middle;
border: none;

color: white;
background-color: #5b7306; /* green */
margin: 2px auto;
margin-bottom: 5px;
line-height: 15px; 
}
.top_banner p {
margin-top: 0px;
margin-bottom: 0px;
margin-right: 5px;
margin-left: 5px;
}
/* HEADER AND LOGO LINE */
.header_and_logo {
width: 100%;
height: 103px;
vertical-align: middle;
}
.header_and_logo img {
/* position: relative; right: 4px; top: 4px; */
opacity: 1;
transition: opacity 6s ease-out;
-moz-transition: opacity 6s ease-out; /* Firefox 4 */
-webkit-transition: opacity 6s ease-out; /* Safari and Chrome */
-o-transition: opacity 6s ease-out; /* Opera */
}
.header_and_logo img:hover {
opacity: 0.5;
/*filter:alpha(opacity=50); */
}

/* TOP NAVIGATION MENU */
.topnav {
color: white;
background-color: #5b7306; /* green */
text-align: center;
 line-height: 15px; 
margin: 2px auto; 
z-index: 10; 
}

.topnav ul {
list-style-type:none;
margin:0px;
/*padding:5px;*/
z-index: 12; 
}
.topnav a{
color: white;
}
/* Buttons */
a.button  {
  border: 0px; 
  padding: 1px;
  color: white;
  background-color: #5b7306; /* green */
  text-align: center;
  font-size: 0.85em;
  /* font-style: italic; */
  font-weight: normal;
  /* text-decoration: underline; */
}
a.button:hover {
color: yellow;
background-color: #c58d2a; /*brown-red */
text-decoration: underline;
}
.buttons img {			/* note buttons not button */
vertical-align: middle;
border: none;
width: 25px;
height: 25px;
}

/*Floating Menus */
.makeMenu a {
text-decoration: none;
} 
 ul.makeMenu {
 padding-left: 2px;
 }
 ul.makeMenu ul {
  width: 150px;                 /* sets the size of the menu blocks */
  border: 0px;      
  background-color: #c58d2a;      /* makes the menu blocks brown-red */
  
  padding: 5px;          
  cursor: default;             /* gives an arrow cursor */
  margin-left: 0px;
  z-index: 14;
 }
ul.makeMenu li {
  list-style-type: none;       /* removes the bullet points */
  margin: 0px;                 /* Opera 7 puts large spacings between li elements */
  position: relative;          /* makes the menu blocks be positioned relative to their parent menu item
                                  the lack of offset makes these appear normal, but it will make a difference
                                  to the absolutely positioned child blocks */
  color: white;                 /* sets the default font colour to white */
  z-index: 14; 
}
ul.makeMenu li > ul {          /* using the > selector prnews many lesser browsers (and IE - see below) hiding child ULs */
  display: none;               /* hides child menu blocks - one of the most important declarations */
  position: absolute;          /* make child blocks hover without leaving space for them */
  top: 15px;                    /* position slightly lower than the parent menu item */
  left: 0px;                  /* this must not be more than the width of the parent block, or the mouse will
                                  have to move off the element to move between blocks, and the menu will close */
z-index: 16; 
}
ul.makeMenu li:hover {
  background-color: #c58d2a;     /* gives the active menu items a brown-red background */
  color: yellow;                 /* makes the active menu item text yellow */ 
z-index: 18; 
}

ul.makeMenu li:hover > ul {    /* one of the most important declarations - the browser must detect hovering over arbitrary elements
                                  the > targets only the child ul, not any child uls of that child ul */
  display: block;              /* makes the child block visible - one of the most important declarations */
z-index: 18; 
}
ul.makeMenu li.makemenu_intro, ul.makeMenu li.makemenu_intro1 {
  background-color: #c58d2a;     /* gives the active menu items a brown-red background */
  color: black;                 /* makes the active menu item text black */ 
z-index: 18; 
 }
 
/* and some link styles */
ul.makeMenu li hr {
 color: #c58d2a;
 border-color: #c58d2a;
 z-index: 18; 
}
ul.makeMenu li a { 
 color: white; 
 display: block; 
 width: 100%;
 font-size: 0.85em;
  font-weight: normal;
  text-align: left;
 /* text-decoration: underline; */
 }

ul.makeMenu li:hover > a {
 color: yellow;
 background-color: #c58d2a; /* light brown for top drop-down menu link */
 text-decoration: underline;
 z-index: 18; 
 }
 /* supports links in branch headings - should not be display: block; */
 /* new class for separately defining drop-down menu link format when hovering */
ul.makeMenu li ul li:hover > a {
 color: yellow;
 background-color: #8a5700; /* dark brown for drop-down menu links */
 text-decoration: none;
 z-index: 18; 
 }
 /* Permanent texts */
.makemenu_intro {
 color: black; 
 display: block; 
 width: 100%;
 font-size: 0.85em;
 font-weight: normal;
 font-style: italic;
 text-align: left;
}
.makemenu_intro1 {
 color: black; 
 display: block; 
 width: 100%;
 font-size: 0.85em;
 font-weight: bold;
 text-align: left;
}


/* CONTENT WRAPPERS */
.content_outer {
text-align: left;
border: none; 
margin: 2px auto; 
padding: 5px; 
width: 99%; 
height: 1730px;
list-style-type: square; 
background-color: transparent; /* #e4c183; light brown inner page background */
position: relative; left: 0px; top: 0px;
z-index: 3;
}
/* ARTICLES */
.article {
color: black;
vertical-align: top;
text-align: left;
margin: 5px auto; 
padding: 5px;
background-color: white;
border-radius: 8px;
z-index: 5;
}
.nav { /* like article, but for navigational content */
color: black;
vertical-align: top;
text-align: left;
margin: 5px auto; 
padding: 5px;
background-color: white;
border-radius: 8px;
z-index: 5;
}
.aside {
color: black;
font-size: 0.9em;
font-style: italic;
vertical-align: top;
text-align: left;
margin: 5px auto; 
padding: 5px;
background-color: white;
border-radius: 8px;
z-index: 5;
}
.headline {
vertical-align: middle;
border: none;
border-radius: 8px;
box-shadow: 5px 5px 6px #282828;
line-height: 1.6em;
width: 95%;
margin: 2px auto;
}
.headline h1, .headline h2, .headline h3, .headline h4, .headline p {
text-align: center;
color: white;
}

.pageheadline {
background-color: #5b7306; /* green */
border: none;
}
/* Article colour schemes */

.main {
border: 1px solid #5b7306; /* green */

}
.main .headline  {
background-color: #5b7306; /* green */
}

/*Slideshow - inherits from article */
.slideshow {
width: 400px;
height: 360px;
vertical-align: middle;
text-align: center;
border: 1px solid #5b7306; /* green */
border-radius: 8px;
/*color: white; */
/*background-color: black; */
font-size: 0.9em;
font-style: italic;
line-height: 10px;
padding: 10px;
 margin: 5px;
}
.slideshow .headline  {
color: #5b7306; /* green */
}
.slideshow h2 {
font-size: 1.1em;
font-style: normal;
color: black;
text-align:center;
}
.slideshow h3 {
font-size: 1.1em;
font-style: normal;
color: black;
text-align:center;
}
.slideshow img {
border: none;
vertical-align: middle;

}
.slideshow a{
color: white;
text-decoration: none;
}
.slidshow_controlbar {
font-size: 0.9em;
font-weight: bold;
color: black;
vertical-align: middle;
text-align: center;
width: 95%;
height:25px;
margin: 5px auto; 
padding: 2px;
border: none;
border-radius:14px;
background-color: #dddddd; /* light grey */
}
/* .slidshow_controlbar:hover {
background-color: gray; dark grey 
}*/
.slidshow_controlbar a {
font-weight: normal;
text-decoration: none;
}
.slidshow_controlbar a:hover {
text-decoration: underline;
}
.slidshow_controlbar img {
border: 0px solid ; 
width: 25px; 
height: 25px; 
vertical-align: middle;
}

/* SIDEBAR */
.sidebar {
font-size: 0.9em;
line-height: 15px;
border: none;
background-color: white;
}
.first_headrow  {
border: none;
vertical-align: middle;
background-color: #5b7306; /* green */
padding: 5px;
margin-top: 1px;
margin-bottom: 1px;
margin-left:1px;
margin-right: 1px;
}
.headrow  {
border: none;
vertical-align: middle;
background-color: #5b7306; /* green */
padding: 5px;
margin-top: 8px;
margin-bottom: 1px;
margin-left:1px;
margin-right: 1px;
}
.row {
border: none;
vertical-align: top;
background-color: #5b7306; /* green */
padding: 5px;
margin-top: 1px;
margin-bottom: 1px;
margin-left:1px;
margin-right: 1px;
}
.row:hover {
background-color: #98bf0a; /* light green */
}

.row a {
font-weight: normal;
color: white;
text-decoration:underline;
}
.row a:hover {
color: yellow;
}
.sidebar_h2 {  /* Heading for sidebar only */
font-weight: bold;
  font-size: 1.4em; 
color: white;
text-align: center;
}
.sidebar_h3 { /* Heading for sidebar only */
font-weight: bold;
  font-size: 1.2em; 
color: white;
text-align: center;
}

/*FOOTER */
.footer_outer {
text-align: left;
border: none; 
margin: 2px auto; 
padding: 5px; 
width: 99%; 
/*height: 1730px; */
list-style-type: square; 
background-color: white;
}

/* News flash in frame */
.news_item {
border: none; 
margin:0px; 
width: 472px; 
height: 326px;
overflow: hidden;
}
.news_item:hover , .news_item:hover  h3,.news_item:hover  time {
color: white;
background-color: #1b4b6b; /* mid blue like news */
}
.news_item:hover  a{
color: yellow;
}
 
/* Hogla */
.hogla   {
border: 1px solid #1473cc; /* mid blue */

}
.hogla .headline  {
background-color: #1473cc; /* mid blue */
}

/* News */
.news {
border: 1px solid #1b4b6b; /*mid-blue */
}
.news .headline {
background-color: #1b4b6b; /* mid-blue */
}
/* newsreel -background for news events */
.newsreel-1 {
border: none;

vertical-align: top;
background-color: #c7dff0; /* light blue */
padding: 5px;
margin-top: 5px;
margin-bottom: 5px;
margin-left:1px;
margin-right: 1px;
}
.newsreel-2 { /* use white characters for dark background images */
border: none;

vertical-align: top;
color: white;
background-color: blue; /* blue */
padding: 5px;
margin-top: 5px;
margin-bottom: 5px;
margin-left:1px;
margin-right: 1px;
}

/* Events */
.events  {
border: 1px solid #058895; /* teal */
}
.events .headline {
background-color: #058895; /* teal */
}

/* Torah */
.torah  {
border: 1px solid #6b0c0c; /* wine red */
}
.torah .headline {
background-color: #6b0c0c; /* crimson */
}

/*Thoughts */
.thoughts  {
border: 1px solid #704535; /* brown */
}
.thoughts .headline {
background-color: #704535; /* brown */
}

/* History */
.history {
border: 1px solid #8a3a94; /* purple */
}
.history .headline {
background-color: #8a3a94; /* purple */
}

/*Tourism */
.tourism  {
border: 1px solid #e27e36; /* orange */
}
.tourism .headline {
background-color: #e27e36; /* orange */
}

/* BACKGROUND IMAGE */
html { 
  /* background: url('../images/tel_jericho/TelJerichoFadedCompressed.png') no-repeat center center fixed; */
 background: url('../images/graphics/backgrounds/JerichoBckgd.jpg') no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}