/* bp-en2.css - Baha'i Prayers English stylesheet */

/* defuse */
body, div, p, h1, h2, h3, h4, span, img, ul, ol, li, a {
border: 0;
margin: 0;
padding: 0;
list-style: none;
text-decoration: none;
color: #111100;
font-size: 100%;
line-height: 1.125em;}

/* show y scroll bar to prevent horizontal shifting in firefox */
html {overflow-y: scroll;}

/* gradient background with centered content */
body {background:#b0aca6 url(images/gradiantb0aca6.gif) repeat-x;
text-align: center; 
padding: 3%;}

/* note swooshies are #c8c4c0 */

/* centered prayer content */
#content {background-color: #fff;
width: auto;
max-width: 700px;
margin: 2% auto;
padding: 1.5%;
text-align: left;
position: relative;
border: 1px #b0aca6 solid;} 

/* default links */
a {font: normal .825em Arial, Helvetica, sans-serif; color: #111166;}
a.hover {border-bottom: 1px dotted #bbbbdd;}

/* * * * nav bar properties * * * */
#nav {
width: 25%;
max-width: 160px; 
min-width: 120px; 
margin: 0px 2% 0px 0px;
float: left;
background:#fcf5ed url(images/navgradiantfcf5ed.gif) repeat-x;
border: 1px #C8C4C0 solid;} 

/* skip nav link */
#skipnav {position: absolute; left: -1000em; width: 20em;}

/* bahai prayers masthead */
#nav h1 {margin: 7px 10px 7px 7px;
padding-bottom: 9px;
letter-spacing: .06em;
border-bottom: 1px solid #d6d2ce;}
#nav h1 a {font: bold 1em Arial, Helvetica, sans-serif; color: #333322;}
#nav h1 a.thispagelink {color: #880000;}
#nav h1 a:hover, #nav h1 a.thispagelink:hover {color: #000066; border-bottom: 1px dotted #bbbbdd;} 

/* photo */
div#nav div#photo img {width: 100%; 
height: auto; 
max-width: 160px; 
min-width: 120px; 
border-bottom: 1px #C8C4C0 solid}

/* prayer category subtitle - might be more than one subtitle, can be id or class */
#nav h3#subtitle, #nav h3.subtitle {font: bold .8em Arial, Helvetica, sans-serif;
letter-spacing: 0.03em;
margin: .875em 7px 3px 7px;
color: #333322;}

/* links to other prayers in this category - might be more than one sibnav section, can be id or class */
#nav ul.sibnavlonger {margin-bottom: 150px;}
#nav ul#sibnav li, 
#nav ul.sibnav li, 
#nav ul.sibnavlonger li {margin: 0 2px 3px 7px; line-height: .725em;}
#nav ul#sibnav li a, 
#nav ul.sibnav li a, 
#nav ul.sibnavlonger li a {font: normal .675em Arial, Helvetica, sans-serif; color: #333322;}
#nav ul#sibnav li a:hover, 
#nav ul.sibnav li a:hover, 
#nav ul.sibnavlonger li a:hover {color: #000066; border-bottom: 1px dotted #bbbbdd;}

/* the current prayer - sibnav section may be id or class */
a.thispagelink, 
#nav ul#sibnav li a.thispagelink, 
#nav ul.sibnav li a.thispagelink, 
#nav ul#globalnav li a.thispagelink, 
#nav ul.sibnavlonger li a.thispagelink {color: #880000;}

/* global navigation links */
#globalnav {margin: 14px 0 24px 0;}
#globalnav li {margin: 4px 12px 0 7px;}
#globalnav li a {font: bold .8em Arial, Helvetica, sans-serif;
letter-spacing: 0.03em; 
height: 18px;
color: #333322;}
#globalnav li a:hover {color: #000066; border-bottom: 1px dotted #bbbbdd;}
#globalnav li#gnlang a {display: block; background: url("images/blackglobe.gif") top right no-repeat;}
#globalnav li#gnlang a:hover {margin-bottom: -1px; background-image: url("images/blueglobe.gif");} /* negative margin to prevent bouncing */
#globalnav li#gnlang a.thispagelink {background-image: url("images/redglobe.gif");}
#globalnav li#gnlist {margin-bottom: 200px;}
#globalnav.longer {margin-bottom: 125px;}
#globalnav.littlelonger {margin-bottom: 75px;}
#globalnav.nobottommargin, #nav ul.nobottommargin {margin: 14px 0 3px 0;} /* ie was picky */


div#getacrobat {margin: 0 0 7px 7px;}

/* * * * prayer properties * * * */
#prayer {width: 60%; 
max-width: 510px; 
margin: 5px 1% 5px 0; 
padding: 0% 1%; 
float: left;} 

/* first line at top of page */
#prayer h2 {font: normal 1.185em Georgia, "Times New Roman", Times, serif;
color: #95928D; /* #95928D #615F5B*/
letter-spacing: 0.05em;
margin: 10px 0 1.25em 1.5%;}
/* for special prayers and indexes */
#prayer h2.darker {color: #333322;}

/* standard paragraphs in prayer body with greater line-height */
#prayer p {margin: 0 0 .75em 1.5%;
color: #330000;
font: normal .950em/1.375em Georgia, "Times New Roman", Times, serif;
clear: both;
text-indent: 4.5%;} 
#prayer p.opening {text-indent: 0;}
/* no indent and short margin for mariner page */
#prayer p.noin {text-indent: 0; margin-bottom: .25em;}

/* links in the prayer area */
#prayer p a {font: normal .950em/1.375em Georgia, "Times New Roman", Times, serif;}
#prayer a:hover{border-bottom: 1px dotted #bbbbdd;}
#prayer a:visited {color: #660066;}

/* comments */
#prayer p.comment {font: normal 0.8em Arial, Helvetica, sans-serif; 
color: #444433;
margin: 0 0 .825em 6%;
text-indent: 0;} /*615F5B */
#prayer p.commentmarginbottom {font: normal 0.8em Arial, Helvetica, sans-serif; 
color: #444433;
margin: 0 0 1.5em 6%;
text-indent: 0;} /*615F5B */
#prayer p.commentnomarginbottom {font: normal 0.8em Arial, Helvetica, sans-serif; 
color: #444433;
margin: 0 0 0 6%;
text-indent: 0;} /*615F5B */
#prayer p.commentleft {font: normal 0.8em Arial, Helvetica, sans-serif; 
color: #444433;
margin: 0 0 15px 1.5%;
text-indent: 0;} /*615F5B */
#prayer p.commentcaps {font: normal 0.8em Arial, Helvetica, sans-serif; 
color: #444433; 
text-transform: uppercase;
margin: 0 0 20px 1.5%;
text-indent: 0;} /* 615F5B */
#prayer p.comment .cauthor, 
#prayer p.commentleft .cauthor, 
#prayer p.commentmarginbottom .cauthor {color: #444433; font-style: italic;} /* 615F5B */
#prayer p.comment a, 
#prayer p.commentleft a {font-size: 1em;}

/* text-based versals */
span.versal {float: left; 
display: inline;
position: relative;
color: #992222; 
font: normal 3.5em/.75em "Times New Roman", Times, serif; /* was 5em/.75em */
margin: 0;
padding: 0;}
.versal#A {width: .735em; background: url("images/plantbkgd17.gif") top right no-repeat; padding: 0.03em 0 0 0.05em; top: 0em; }
.versal#B {width: .650em; background: url("images/plantbkgd3.gif") top right no-repeat; padding: 0 0.02em; top: 0.04em; }
.versal#C {width: .655em; background: url("images/plantbkgd19.gif") top right no-repeat; padding: 0.03em 0 0 0.05em; top: 0em; }
.versal#D {width: .705em; background: url("images/plantbkgd20.gif") center right no-repeat; padding: 0 0.02em; top: 0.03em; }
.versal#E {width: .655em; background: url("images/plantbkgd3.gif") top right no-repeat; padding: 0.03em 0 0 0.05em; left: 0.05em; top: 0em; }
.versal#F {width: .605em; background: url("images/plantbkgd20.gif") top right no-repeat; padding: 0.03em 0 0 0.05em; left: 0.05em; top: 0em; }
.versal#G {width: .695em; background: url("images/plantbkgd2.gif") center right no-repeat; padding: 0 0.02em; top: 0.03em; }
.versal#H {width: .695em; background: url("images/plantbkgd14.gif") center right no-repeat; padding: 0 0.02em; top: 0.03em; }
.versal#I {width: .615em; background: url("images/plantbkgd7.gif") top left no-repeat; padding: 0.03em 0.02em 0 0.02em; text-align: center; }
.versal#L {width: .625em; background: url("images/plantbkgd5.gif") top right no-repeat; padding: 0.03em 0.02em 0 0.02em; text-align: right; }
.versal#M {width: .885em; background: url("images/plantbkgd1.gif") center left no-repeat; padding: 0.01em 0 0 0; top: 0.03em; }
.versal#O {width: .775em; background: url("images/plantbkgd9.gif") center left no-repeat; padding: 0 0 0 0; top: 0.01em; }
.versal#O2 {width: .775em; background: url("images/plantbkgd13.gif") center left no-repeat; padding: 0 0.02em; top: 0.01em; }
.versal#O3 {width: .775em; background: url("images/plantbkgd11.gif") center center no-repeat; padding: 0 0.01em; top: 0.01em; }
.versal#O4 {width: .775em; background: url("images/plantbkgd13.gif") center left no-repeat; top: -0.05em; } /* up a bit higher is all */
.versal#P {width: .665em; background: url("images/plantbkgd15.gif") top right no-repeat; padding: 0.03em 0 0 0.05em; top: -0.02em; }
.versal#R {width: .690em; background: url("images/plantbkgd8.gif") top right no-repeat; padding: 0.03em 0 0 0; top: 0.02em; }
.versal#S {width: .615em; background: url("images/plantbkgd4.gif") top left no-repeat; text-align: right; padding: 0.03em 0.02em 0 0.02em; top: 0.02em; left: 0.01em; }
.versal#T {width: .690em; background: url("images/plantbkgd12.gif") top left no-repeat; text-align: right; padding: 0.03em 0.02em 0 0.02em; }
.versal#U {width: .725em; background: url("images/plantbkgd18.gif") bottom center no-repeat; padding: 0.03em 0 0 0.05em; top: 0.02em; }
.versal#V {width: .675em; background: url("images/plantbkgd16.gif") top right no-repeat; padding: 0.03em 0 0 0.05em; top: -0.02em; }

/* author signatures */
#prayer h4#author {margin: 0 0 25px 55%;
font: italic 1.03em/1.825em Georgia, "Times New Roman", Times, serif;
color: #992222;
text-indent: 0.325em;
background: url("images/swash1.gif") bottom left no-repeat;}

em {font-style: italic;}

/* * * * home page and indexes * * * */

/* home page version of title */
#prayer h2.homepagetitle {color: #880000;}

#prayer h3 {clear: both;
color: #880000; /* #880000 */
margin: 0 40px 0 1.5%;
letter-spacing: 0.05em;
font: normal 0.725em Arial, Helvetica, sans-serif;
text-transform: uppercase;}
#prayer h3 span {color: #880000; font-size: 1.25em;}

#homelinks {margin: 25px 0;}
.prayerlinks {margin: 0 1% 15px 6%; padding: 0;}
#homefirstleft, #homegeneralleft, #homeoccasionalleft, #homeindexleft {float: left; width: 50%; display: inline;} /* IE float margin hack */
#homegeneralright, #homeoccasionalright, #homeindexright {}
#homelinks .subhead {font: normal 0.8em Arial, sans-serif; color: #615F5B; margin-top: 0.2em;}

/* First Lines page styles */
p#alphalinks {font-size: 1.05em; border-bottom: 1px solid #b0aca6;
  margin: 0 0 .75em 0; padding: 0;}

.prayerlinks table {margin: 0 1% 0 0;}
.prayerlinks table tr {vertical-align: top;}
.prayerlinks table tr.headingrow {display: none;}
.prayerlinks table tr td {padding: 1px 15px 1px 0;}
.prayerlinks table tr td.cauthor {font: italic 0.8em Arial, sans-serif; color: #615F5B; width: 20%;}
.prayerlinks span.comment, .prayerlinks table tr td span.comment {font: normal 0.8em Arial, sans-serif; color: #615F5B;}

/* arabic content on the languages page */
#homelinks h3 span.arhead {font-size: 2em; direction: rtl;}
#homelinks h3 span.foreignhead {font-size: 1.75em;}
.prayerlinks ul li a.arlink {font-size: 1.15em; direction: rtl;}
#homelinks h3 span.foreignheadlg {font-size: 1.75em;}
#homelinks h3 span.foreignheadmed {font-size: 1.25em;}
.prayerlinks ul li a.foreignlink {font-size: 1em;}

/* * * * photo credits page * * * */
#prayer p.photocredits {text-indent: 0;}
#prayer p.photocredits a img {margin: 1px;}

/* * * * footer * * * */
#footer {clear: both; text-align: center; padding-top: 20px;}

/* footer navigation links */
#footernav {margin: 7px 0;}
#footernav li {margin: 0 2%; display: inline;}
#footernav li a:hover {border-bottom: 1px dotted #bbbbdd;}

/* * * * contact page * * * */
#contactForm {margin: 1em 0 0 6%; padding: 0;}
form div {margin: 0 0 .825em 0;}
label {display: block; font: normal .825em Arial, Helvetica, sans-serif;}
input#realname, input#email, input#subject { width: 95%; }
textarea#comments { width: 95%; resize: none; }
input#Engage, input#clear {padding: 2px 10px;}

/* * * * search page and results * * * */
#searchform {margin: 3em 0 0 6%; padding: 0;}
input#search {padding: 2px 10px;}
#picosearch {font-size: .650em;}
li a span.picolistregfontsize {color: #111166; font-size: 1.15em;}

/* Media Queries for Responsive Design, ems-based to permit text zoom. */

/* A little more room for navigation first ~650px */
@media only screen and (max-width: 41em) {
  #nav ul#sibnav li, 
  #nav ul.sibnav li, 
  #nav ul.sibnavlonger li { margin: 0 3px 6px 7px; }
  .prayerlinks ul li { margin-bottom: 3px; }
  #prayer h4#author { margin: 0 0 25px 50%; }
}

/* Above, plus remove background, extend content to the edge ~600px */
@media only screen and (max-width: 37em) {
  body { padding: 0; background: #fff; }
  #content { margin: 0; border: 0; padding: 2%; }
  #prayer { width: 65%; padding: 0 0 0 1%; }
  #nav ul#sibnav li, 
  #nav ul.sibnav li, 
  #nav ul.sibnavlonger li {margin: 0 3px 9px 7px;}
  .prayerlinks ul li { margin-bottom: 3px; }
  #prayer h4#author { margin: 0 0 25px 45%; }
}

/* Above, plus stack home screen navigation in one column, close column gaps ~500px */
@media only screen and (max-width: 31em) {
  body { padding: 0; background: #fff; }
  #content { margin: 0; border: 0; padding: 2%; }
  #prayer { width: 65%; padding: 0 0 0 1%; }
  #homefirstleft, #homegeneralleft, #homeoccasionalleft, #homeindexleft {width: 65%;}
  #homegeneralright, #homeoccasionalright, #homeindexright {clear: left; width: 65%}
  #nav ul#sibnav li, 
  #nav ul.sibnav li, 
  #nav ul.sibnavlonger li {margin: 0 3px 9px 7px;}
  .prayerlinks ul li { margin-bottom: 6px; }
  #homegeneralleft.prayerlinks, 
  #homeoccasionalleft.prayerlinks,
  #homeindexleft.prayerlinks { margin: 0 1% 0 6%; }
  #originalnav,
  #getacrobat { visibility: hidden; }
  input#query { width: 60%; }
  #prayer h4#author { margin: 0 0 25px 40%; }
}

/* Narrowest, above plus reduced widths and tweaked nav ~500px */
@media only screen and (max-width: 27em) {
  body { padding: 0; background: #fff; }
  #content { margin: 0; border: 0; padding: 2%; }
  #prayer { width: 63%; padding: 0 0 0 1%; }
  #nav { min-width: 96px; }
  div#nav div#photo img { min-width: 96px; }
  #homefirstleft, #homegeneralleft, #homeoccasionalleft, #homeindexleft {width: 63%;}
  #homegeneralright, #homeoccasionalright, #homeindexright {clear: left; width: 63%}
  #nav ul#sibnav li, 
  #nav ul.sibnav li, 
  #nav ul.sibnavlonger li {margin: 0 3px 9px 7px;}
  .prayerlinks ul li { margin-bottom: 6px; }
  #homegeneralleft.prayerlinks, 
  #homeoccasionalleft.prayerlinks,
  #homeindexleft.prayerlinks { margin: 0 1% 0 6%; }
  #originalnav,
  #getacrobat { visibility: hidden; }
  #globalnav li#gnlang a { background: none;}
  #globalnav li#gnlang a:hover { background: none; }
  #globalnav li#gnlang a.thispagelink { background: none; }
  input#query { width: 50%; }
  #prayer h4#author { margin: 0 0 25px 35%; }
}