/* 
 * style file for almanac system
 *   Simon Kershaw   23 Nov 2004
 * copyright (c) Simon Kershaw 2004
 *
 */

body
{
	color: black;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}


div.almanacbody
{
	background-color: #FFFFFF;
	width: 700px;
	display: block;
}

div.almanac
{
	width: 700px;
}

div.readings h2
{
	color: #770000;
}

p
{
	width: 100%;
}
td.advent, td.lent, span.advent, span.lent
{
	background-color: #FFDDFF;  /* purple */
}

td.christmas, td.epiphany, td.easter, td.ascensiontide, span.christmas, span.epiphany, span.easter, span.ascensiontide
{
	background-color: #FFFFDD;  /* yellow */
}

td.passiontide, td.triduum, td.pentecost, span.passiontide, span.triduum, span.pentecost
{
	background-color: #FFDDDD;  /* red */
}

td.ot, span.ot
{
	background-color: #DDFFDD;  /* green */
}

/* title on a calendar month-view */
td div.title
{
	font-size: 0.8em;
}

span.monthview
{
	color: #B22;
	font-family: Verdana, sans-serif;
	font-size: 1.2em;
}

.minimonthview
{
    display: flex;
    justify-content: center;
}


span.pfeaststitle
{
	color: #B22;
	font-family: Verdana, sans-serif;
	font-size: 1.2em;
}

.cptr
{
    cursor: pointer;
}

.pfblink
{
    color: black;
}

div.tabs hr
{
	width: 100%;
}



div.rightpanel
{
	position: fixed;
	display: block;
	left: 720px;
	top: 160px;
	width: 170px;

	padding-left: 5px;
	padding-right: 5px;
	padding-top: 5px;
	padding-bottom: 5px;

	font-family: Verdana, sans-serif;
	font-size: 0.7em;
	line-height: 1em;

 	background-color: #F2F2F2;
}

div.rightpanel table tr td,
div.rightpanel table tr th
{
	font-family: Verdana, sans-serif;
	line-height: 1em;
}

#rpanelvislab, #rpanelvis
{
    display: none;
}
#almanac_today
{
    text-align: center;
    font-style: italic;
    font-size: 1.1rem;
    line-height: 2rem;
    font-weight: normal;
    cursor: pointer;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}

h1
{
	width: 700px;
	display: block;
}




#dailyprayercontainer div.bcpdp-copyright,
#dailyprayercontainer div.cwdp-copyright
{
	display: none ;
}



.almanacbody h3, .almanacbody h4
{
    margin-bottom: 0;
}
.almanacbody h3.ah3 + h3.ah3, .almanacbody h2.ah3 + h2.ah3
{
    margin-top: 0;
}
.almanacbody h2.ah3
{
    font-size: 1.125em;
    margin-bottom: 0;
}

.calicon
{
    width: 0.7em;
    vertical-align: middle;
}

ol.spaced li
{
    padding-bottom: 2rem;
}
.ared
{
    font-style: italic;
    color: #B22;
}


@media handheld, only screen and (max-device-width: 1200px)
{
    div.rightpanel
    {
	display: none;
        position: absolute;
        left: inherit;
	top: 55px;
	right: 0;
/*
	width: 0;
*/
 	background-color: #F2F2F2;
	transition: 0.5s;

    }
    div.rightpanel, div.rightpanel table tr td, div.rightpanel table tr th
    {
	font-size: 1rem;
	line-height: 1.2rem;
    }

    #rpanelvislab
    {
	display: block;
        position: absolute;
	top: 15px;
	right: 0;
	vertical-align: middle;
	font-size: 2em;
    }
    .rpanelimg
    {
	width: 0.7em;
	vertical-align: middle;
    }

    #rpanelvislab::before
    {
        color: #800;
        content: "\2630"; /* = decimal 9776 */
    }
    #rpanelvis:checked ~ #rpanelvislab::before
    {
        content: "\00d7"; /* multiplication sign used as X */
	vertical-align: -3px;
    }

    #rpanelvis:checked ~ #rpanelvislab ~ div.rightpanel
    {
	display: block;
	width: 15em;
	transition: 0.5s;
    }
}




@media only screen and (max-device-width: 480px)
{
    div.almanacbody
    {
	width: 95%;
    }
    div.almanac, 
    h1, 
    div#resmainblock
    {
        width: 100%;
    }

    div.rightpanel
    {
	top: 180px;
    }
    div.rightpanel, div.rightpanel table tr td, div.rightpanel table tr th
    {
	font-size: 3rem;
	line-height: 4rem;
    }

    #rpanelvis:checked ~ #rpanelvislab::before
    {
	vertical-align: -5px;
    }
    #rpanelvis:checked ~ #rpanelvislab ~ div.rightpanel
    {
	width: 15em;
    }
    #almanac_today
    {
	font-size: 4rem;
	line-height: 4rem;
    }

    body, span.monthview, span.pfeaststitle, div.rightpanel, div.rightpanel table tr td, div.rightpanel table tr th
    {
	font-family: Verdana, sans-serif;
    }
}