/*
   Filename: mir.css; linked stylesheet for Mir webpages.
   No longer bothers with really quirky browsers (e.g. Netscape 4).
   No longer uses separate stylesheets for index and commentary.
*/

@font-face {
    font-family: 'nicefont';
    src: url('../../../00ghalib/webfonts/nicefont.woff2') format('woff2'),
         url('../../../00ghalib/webfonts/nicefont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

body.vs-index {
    background: url(../../graphics/creammarble.jpg);
    background-color: #fff;
    border-color: #666;
    border-color: #060;
    color: #000;
    display: block; 
    font-family: nicefont,'Lucida Sans Unicode', sans-serif, helvetica;
}


div, h1, h2, h3, p {
    font-family: nicefont, 'Lucida Sans Unicode', sans-serif;
    }

/* links */
:link { color: #00e; }
:visited { color: #936; }
:active { color: #f00; } /* red */
/* :hover { color: #f00; }   red */

table.opening {
    display: table;
    border: 20px solid #060;
/*    background: url(../../graphics/creammarble.jpg); */
    background-color: #060;
    text-align: center;
}

tr.opener {
    display: table-row;
    border: 20px solid #990;
}

td.opening-info {
  display: table-cell;
  color: #fc9;
  background-color: #330;
  font-size: 24px;
  text-align: center;
  background: url(../../graphics/darkgreen.jpg);
}

p.vs-number {
  font-size: 36px; 
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
}

p.meter {
  margin-bottom: 10px;
}

/* for commentary webpages: */
body.vs-comments {
    background-color: #330;
    background-color: #fc9;
    background: url(../../graphics/creammarble.jpg); 
    color: #000;             /* black */
    font-family: nicefont,'Lucida Sans Unicode', sans-serif, helvetica;
    margin: 0px 18px;
    margin: 0px 0px;
    }

p.comm-opening {
  font-size: 36px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
}

td.opening-image {
    display: table-cell;
    background-color: #020;
}

div.ornament {
    border: 8px solid #ccc;
    display: block;
    height: 108px;
    margin: 0px;
    padding: 0px;
    width: auto;
	margin-top: 5px;
	margin-bottom: 5px;
}

#top-ornament {
    background-image: url(../../graphics/golddiamond.gif);
    height: 24px;
    border-color: #330;
    border-color: #060;
}

#bottom-ornament {
    background-image: url(../../graphics/mainzard5a.jpg);
    /* height: 76px; */
    height: 78px;
    border-color: #330;
    border-color: #060;
}

div.vs-info {
    background-color: #303;
    border: 8px solid #ccc;
    color: #fff;
    display: block;
    text-align: center;
}

div.vs-info h1 {
    display: block;
    font-size: 48px;
    font-weight: normal;
    margin: 8px 0px 0px 0px;
    text-transform: uppercase;
}

div.vs-info h2 {
    display: block;
    font-size: 24px;
    font-weight: normal;
    margin: -16px 0px 0px 0px;
}

div.navbar {
    background-color: transparent;
    border: 4px solid #ccc;
    display: block;
    font-size: 12pt;
    font-size: 14pt;
    font-weight: normal;
    padding: 2px 0px 4px 0px;
    text-align: center;
}

#top-navbar {
/*    background-color: #ccc; */
    border-color: #060;
    border-style: solid;
}



#top-navbar strong {
    font-weight: bold;
    }

#bottom-navbar {
/*    background-color: #fff;  */
    background-color: transparent;
    margin-left: auto;
    margin-right: auto;
    width: 600px;  
}

body.vs-comments #bottom-navbar {
    width: 660px;  
}



div.vs-entry {
    border: 8px solid #ccc;
    border-color: #060;
    display: block;
    padding: 16px;
    margin: 0px;
       margin-top: 4px;
       margin-bottom: 4px;
    background: url(../../graphics/creammarble.jpg);
}

div.vs-entry h3.vs-number {
    display: block;
    font-size: 24px;
    font-weight: normal;
    margin: 0px;
    margin-left: 5px;
    text-align: left;
}

div.vs-entry p.comment {
    display: block;
    font-weight: normal;
    font-size: 16px;
    margin: 3px 0px 6px 6px;
    }

div.vs-entry p.vs-text {
    display: block;
    font-size: 24px;
    margin: 0px;
    text-align: center;
}

/* for commentary webpages: */
/* bordered box with vs text and translation: */
div.vs {
    /* border: 16px solid #ccc;*/  /* silver */
    border: 16px solid #060; /* green */
    margin: 24px 0px;
    width: auto;
	margin-top: 0px;
	margin-bottom: 0px;
    }

div.vs div.boxer {
    /* border: 1px solid black; */
    display: block;
    margin: 16px;
    padding: 1px 1px 1px 4px;
    }

h2.vs-number {
    font-size: 32px;
    font-weight: normal;
    margin: 0px;
    }

p.text {
    font-size: 24px;
	text-align:center;
    }

p.text strong {
    font-weight: normal;
    }

p.translation {
    font-size: 16px;
    }

em.urdu {
    font-style: italic;
    font-family: nicefont, 'Lucida Sans Unicode', sans-serif;
    }

/*  notes section: */
div.notes {
    margin-left: 8px;
    margin-right: 8px;
    }

h3.notes-label {
    font-size: 24px;
    font-weight: normal;
    margin-bottom: 0px;
    margin-top: 32px;
    }

p.note {
    font-size: 16px;
    margin: 0px;
    text-indent: 1em;
    }

p.platts-link {
    font-size: 16px;
    margin-top: 18px;
    text-indent: 1em;
    text-transform: uppercase;
    }

/* commentary section: */
div.commentary {
    }

h3.commentator {
    font-size: 24px;
    font-variant: small-caps;
    font-weight: normal;
    margin-bottom: 0px;
    margin-top: 32px;
    }

div.commentary p.comment {
    font-size: 16px;
    margin-top: 0px;
    }

p.indent {
    font-size: 16px;
    margin-top: 0px;
    text-indent: 1em;
    }