/*===================================
Machida church, style sheets
===================================*/
body{margin-top:20px;}
h1{color:#000099;margin:0px 0px 0px 100px;}
h2{color:#000099;font-size:1.2em;}
h3{color:#0000aa;margin:0px 0px 0px 100px;}
h4{color:#aa0000;font-size:13pt;margin-bottom:0px;text-decoration:underline;}

.clear{clear:both;}
img{max-width:100%;}

@media screen and (max-width:680px) {
   h1{font-size:1.3em;margin:5px 0px 0px 0px;}
   h3{margin:5px 0px 0px 0px;}
}

.noJavaScript{
   margin-left:auto; 
   margin-right:auto; 
   margin-bottom:5px; 
   font-weight:bold; 
   color:#550000;
   font-weight: bold;
   border-style:solid;
   border-width:thick;
   border-color:#ff0000;
   padding:20px;
}
.center{margin-left: auto;margin-right: auto;margin-bottom:0;}
@media screen and (min-width: 630px) {
   .center{max-width:600px;}
}
/*===================================
Start: Header
===================================*/
.hdrwhi{border-bottom:1px #efe4b0 solid;margin-bottom:0;}
.hdrgrn{border-bottom:1px #009900 solid;margin-bottom:0;}
.hdrred{border-bottom:1px #cc0000 solid;margin-bottom:0;}
.hdrvio{border-bottom:1px #9933aa solid;margin-bottom:0;}

.top-banner{
   margin-left:auto;
   margin-right:auto;
   margin-top:5px;
   margin-bottom:10px;
   text-align:center;
}
.dayinfo{text-align:left;margin-bottom:3px;}
.dayinfo_whi{border:2px solid #efe4b0;display:inline-block;padding:5px;}
.dayinfo_grn{border:2px solid #009900;display:inline-block;padding:5px;}
.dayinfo_red{border:2px solid #cc0000;display:inline-block;padding:5px;}
.dayinfo_vio{border:2px solid #9933aa;display:inline-block;padding:5px;}

@media screen and (max-width:680px) {
   /*.hdrwhi{border-bottom:none;}*/
   /*.hdrgrn{border-bottom:none;}*/
   /*.hdrred{border-bottom:none;}*/
   /*.hdrvio{border-bottom:none;}*/
   .dayinfo{text-align:right;margin-left:0px;}
   .dayinfo_grn{border:none;padding:0px;}
   .dayinfo_whi{border:none;padding:0px;}
   .dayinfo_red{border:none;padding:0px;}
   .dayinfo_vio{border:none;padding:0px;}
}

/* ntional holiday */
.nathol{color:#ff0000;font-style:italic;}

.tdyread a{font-size:0.9em;text-decoration:none;color:#999999;}
.tdyread a:hover{text-decoration:underline;color:#000066;}
.dayread{float:right;}
.dayclr{float:right;}
/*

/*
/*===================================
End: Header
===================================*/
/*===================================
Start: Footer
===================================*/
.footer{
   font-family: Arial, Verdana, Helvetica, sans-serif;
   color:#666666;
   display:block;
   font-size:0.8em;
   text-align:center;
}
.footer hr{
   background-color:#666666;
   height:1px;
   border:none;
}
/*===================================
End: Footer
===================================*/

/*===================================
Start: Top menu
===================================*/
.tpmnu{float: right;
  /* text-align:right;*/
}

.daywhi{background-color: #efe4b0;color: #333;}
.daygrn{background-color: #009900;color: #ccc;}
.dayred{background-color: #cc0000;color: #ccc;}
.dayvio{background-color: #9933aa;color: #ccc;}
/*
.selwhi{background-color: #aca190;color: #000;}
.selgrn{background-color: #33cc33;color: #fff;}
.selred{background-color: #990000;color: #fff;}
.selvio{background-color: #660099;color: #fff;}
*/
.daywhi a{color: #000;text-decoration:none;}
.daygrn a{color: #fff;text-decoration:none;}
.dayred a{color: #fff;text-decoration:none;}
.dayvio a{color: #fff;text-decoration:none;}
.daywhi a:hover{background-color: #fff7e3;;}
.daygrn a:hover{background-color: #00cc00;}
.dayred a:hover{background-color: #ff3333;}
.dayvio a:hover{background-color: #cc66dd;}

.tpmnumbl{padding:0px;display: none;}
.tpmnuitm{
   display: inline;
   float: left;
   min-width:90px;
   text-align:center;
   padding:0px;
}

.mnubtn{width:100%;display:inline-block;margin-top:0;}

.tpmnusub{
   position:absolute;
   overflow: visible;
   float: right;
   display:none;
   text-align:left;
   padding:0px 6px 0px 6px;
   z-index:7;
}
.tpmnusub.show{display:block;}
/*
.tpmnuitm a{color: #fff;text-decoration:none;}
.tpmnuitm a:hover {background-color: #555;}
*/
/* When the screen is less than 680 pixels wide, hide all list items, except for the first one ("Home"). Show the list item that contains the link to open and close the topnav (li.icon)*/ 
@media screen and (max-width:680px) {
   .tpmnu {float:left;}
   .tpmnumbl{display:inline-block;min-width:150px;}

   .tpmnuitm{display:none;text-align:left;float:none;min-width:150px;}
   .tpmnuitm.show{display:block;}
   .tpmnusub{display:none;float:none;position:relative;}
   .tpmnusub.show{display:block;}

}

/*===================================
Start: Map
===================================*/
.map-info{color:#aa0000;font-size:1.1em;width:800px;margin:auto;}
.map-canvas { 
   width:800px;
   height:600px;
   margin:auto; 
   border: solid 1px #999999;
   text-align:center;
   z-index:1;
}
@media screen and (max-width:830px) {
   .map-info{width:100%;}
   .map-canvas{width:100%;height:400px;}
}
@media screen and (max-width:630px) {
   .map-canvas{width:100%;height:300px;}
}

/*===================================
End: Map
===================================*/

/*===================================
Start: Body
===================================*/
.mainspc{text-align:center;margin:auto;}
.leftspc{float:center;text-align:center;}
.rightspc{text-align:left;margin-top:10px;}
@media screen and (min-width: 630px) {
   .mainspc{max-width:600px;}
   .leftspc{float:left;text-align:left;margin-right:30px;}
   .rightspc{min-width:250px;min-height:120px;margin-top:30px;}
}
/*==================================================*/
/* Calendar table */
.caltable{background-color:#ffffff;font-weight: bold;border-left:1px solid #999999;border-top:1px solid #999999;margin-top: 10px;}
.caltable th{width:300px;text-align:left;border-right:1px solid #999999;border-bottom:1px solid #999999;}
.caltable td{width:400px;border-right:1px solid #999999;border-bottom:1px solid #999999;}
.caltable a{font-size:0.8em;text-decoration:none;color:#666666;}
.caltable a:hover{text-decoration:underline;color:#000066;}
.caltable_wkly{margin-left: 50px;}

.caltable_yrl{background-color:#ffffff;font-weight: bold;border:1px solid #999999;margin-top: 10px;max-width:800px;}
.caltable_yrl th{width:300px;text-align:left;border-bottom:1px solid #999999;}
.caltable_yrl td{padding-left:5px;padding-right:5px;vertical-align:top;}
.caltable_yrl a{font-size:0.8em;text-decoration:none;color:#666666;}
.caltable_yrl a:hover{text-decoration:underline;color:#000066;}
.caltable_yrl td.brd{border-bottom:1px solid #999999;}

/* green */
.caltable .sungrn{/*color:#009900;*/background-color:#55ff55;}
/* yellow(white) */
.caltable .sunwhi{background-color:#ffff99;}
/* red */
.caltable .sunred{background-color:#ff9999;}
/* violet */
.caltable .sunvio{background-color:#ee82ee;}
/*==================================================*/

/* area groups */

.table_areagroup{border:1px solid #009999;}
.table_areagroup th{background-color:#009999; font-weight: bold; color:#ffffff; border-color:#000000;}
.table_areagroup td{background-color:#ffffff;}
.table_areagroup td.white{background-color:#ffffff;}
.table_areagroup td.blue{background-color:#ccffff;}
.table_areagroup td.white_brd{background-color:#ffffff; border-bottom:1px solid #009999;}
.table_areagroup td.blue_brd{background-color:#ccffff; border-bottom:1px solid #009999;}
.table_areagroup #inp{color: #000099; font-weight: bold;}

.table_areablock{border-top:1px solid #000000;border-left:1px solid #000000;border-right:1px solid #000000;}
.table_areablock th{font-weight: bold; border-bottom:1px solid #000000;border-right:1px dashed #000000;}
.table_areablock th.norightbrd{border-right:1px none #000000;}
.table_areablock td{border-bottom:1px solid #000000;border-right:1px dashed #000000;}
.table_areablock td.norightbrd{border-right:1px none #000000;}

.table_areaschedule{border-top:1px solid #000000;border-left:1px solid #000000;border-right:1px solid #000000;margin-left: auto;margin-right: auto;}
.table_areaschedule th{font-weight: bold; border-bottom:1px solid #000000;border-right:1px dashed #000000;}
.table_areaschedule th.norightbrd{border-right:1px none #000000;}
.table_areaschedule td{border-bottom:1px solid #000000;border-right:1px dashed #000000;}
.table_areaschedule td.norightbrd{border-right:1px none #000000;}
.table_areaschedule td.dashbottom{border-bottom:1px dashed #000000;}

@media screen and (min-width: 630px) {
   .table_areaschedule{max-width:600px;}
}

.tbschedule{width:100%;border-top:solid #999999 1px;border-left:solid #999999 1px;}
.tbschedule th{border-bottom:solid #999999 1px;border-right:solid #999999 1px;}
.tbschedule td{border-bottom:solid #999999 1px;border-right:solid #999999 1px;}
.schd{width:100%;margin-top:40px;color:#550055;font-size:18;font-weight:bold;}
.schdcmt{width:100%;color:#990000;font-style:italic;}

@media screen and (min-width:680px) {
.tbschedule{margin-left:50px;max-width:600px;text-align:left;}
.schd{margin-left:50px;text-align:left;}
.schdcmt{margin-left:50px;text-align:left;}
}
@media screen and (min-width:900px) {
.tbschedule{margin-left:250px;max-width:600px;text-align:left;}
.schd{margin-left:250px;text-align:left;}
.schdcmt{margin-left:250px;text-align:left;}
}

/*==================================================*/
/* Cleaning and reading */
.cleaning { margin-left:50px;}
.cleaning a{text-decoration:none;}
/*==================================================*/
/*==================================================*/
/* recollections */
.tbl_recollection {border:1px solid #999999; margin: 0px 0px 5px 0px;}
.tbl_recollection th{text-align:right;vertical-align:top;}
/*==================================================*/

dl.annlist { margin:5px 0px 0px 25px;padding:0}
.annlist dt{font-size:1.0em;font-weight:bold;}
.annlist dd{margin-left:25px;padding:0px;}
.annlist ul{margin-top:0px;margin-left:-10px;}
.annlist ol{margin-top:0px;margin-left:-10px;}

.meeting_table{border-top: 2px solid #999999;border-left: 2px solid #999999;border-bottom: 2px solid #999999;}
.meeting_table th{border-bottom: 2px solid #999999;border-right: 2px solid #999999;color:#000055;}
.meeting_table td{border-right: 2px solid #999999;padding:0px 8px 3px 8px;}
.meeting_table .tdblue{background-color:#99ffff;}


.prytbl{text-align:center;vertical-align:top;}
.pryitm{float:left;width:98%;}
.prycpt{border: 1px solid #ffffff;background-color: #000099;color: #ffffff;display:block;text-align:center;padding:2px 5px 2px 5px;margin-right:-1px;}
.prytxt{border: 1px solid #000099;background-color: #ffffff;display:block;text-align:left;padding:0px 5px 0px 5px;margin-right:-1px;}

.txt_italic{font-size:0.9em;color:#555555;font-style:italic;}
.txt_romaji{font-size:0.9em;color:#555555;}

.langtable{vertical-align:bottom;display:inline-block;}
.langtable ul{list-style-type:none; margin:0;padding:0;}
.langtable li{margin-top:-1.1em;margin-bottom:-0.2em;}
.langtable a{text-decoration:none;color:#999999;}
.langtable a:hover{text-decoration:underline;color:#000000;}
.ltleft{float:left;text-align:left;}
.ltright{float:right;text-align:right;}

@media screen and (min-width: 630px) {
   .pryitm{float:left;width:49%;}
   .prytxtshrt{min-height:280px;}
   .prytxtlong{min-height:900px;}
   .prytxtshrtl{min-height:650px;}
   .prytxtlongl{min-height:1800px;}
   .langtable li{display:inline;}
   .ltright{margin-right:2%;}
   .tbl_recollection { border:2px solid #999999;}

}
@media screen and (min-width: 930px) {
   .pryitm{float:left;width:24.5%;}
}

@media screen and (max-width:630px) {
   .caltable{width:100%;margin-top: 5px;}
   .caltable th{min-width:40%;}
   .caltable td{min-width:60%;}
   .caltable_wkly{margin-left: 0px;}
   .cleaning { margin-left:10px;}

   dl.annlist { margin:0px 0px 0px 0px;padding:0}
   .annlist dd{margin-left:5px;padding:0px;}
   .meeting_table{width:100%;border-top:1px solid #999999;border-left:1px solid #999999;border-bottom:1px solid #999999;}
   .meeting_table th{border-bottom:1px solid #999999; border-right:1px solid #999999;}
   .meeting_table td{border-right:1px solid #999999;padding:0px 1px 3px 1px;}
   
   .prycpt{width:100%;display:inline-block;}
   .prytxt{width:100%;display:inline-block;}
}

/* Liturgical calendar of the century */
.ltgtblhead{min-width:500px;}

/* National Holidays table */
.yrlcal{margin-top:20px; border-top: solid 1px #999999;border-right: solid 1px #999999;}
.yrlcal th{font-weight:bold;font-size:1.2em;color:#0000aa;border-left: solid 1px #999999;border-bottom: solid 1px #999999;}
.yrlcal th a{font-weight:bold;font-size:0.8em;color:#9999cc;text-decoration:none;}
.yrlcal th a:hover{color:#0000ff;text-decoration:underline;}
.yrlcal td{border-left: solid 1px #999999;border-bottom: solid 1px #999999;}

.yrlcalcpt{width:100%; border:none}
.yrlcalcpt td{border:none}

/* Liturgical calendar */
.litcal{border-top:1px solid #999999;border-left:1px solid #999999;margin-top:5px;}
.litcal th{border-bottom:1px solid #999999;border-right:1px solid #999999;padding-left:5px;padding-right:5px;}
.litcal td{border-bottom:1px solid #999999;border-right:1px solid #999999;padding-left:5px;padding-right:5px;}
.litcal td.thisyear{background-color:#99ffff;}

@media screen and (max-width:630px) {
   .yrlcal{margin-top:5px;}
   .ltgtblhead{min-width:100%;}
   .litcal{width:100%;}
   .litcal th{padding-left:1px;padding-right:1px;vertical-align:middle;width: 1.5em;height:7.1em;white-space: nowrap;}
   .litcal td{padding-left:1px;padding-right:1px;}
   .litcal .cpt{
      display:block;
      width: 1.5em;
      -webkit-transform: rotate(90deg);
      -o-transform: rotate(90.0deg);
      -moz-transform: rotate(90deg);
      filter:  progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083);
      -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083)";
      margin-top: -3.2em;
      margin-left: 0.8em;
   }
}

.special_anouncement{border: 2px solid #990000;color:#990000;text-align:center;padding:2px 5px 2px 5px;font-size:1.2em;font-weight:bold;}
@media screen and (min-width:630px) {.special_anouncement{width:600px;margin-left:auto;margin-right:auto;margin-bottom:15px;}}

.special_anouncement2{border: 2px solid #990000;color:#990000;text-align:left;padding:2px 5px 2px 5px;font-size:1.2em;font-weight:bold;}
@media screen and (min-width:830px) {.special_anouncement2{width:800px;margin-left:auto;margin-right:auto;margin-bottom:15px;}}

.holyweek{border: 1px solid #000000;padding:2px 5px 2px 5px;margin-bottom:15px;}
/*===================================
Responsive design
===================================*/

/* for mobile phones 
[class*="cpr_col_"]{width: 100%;}

@media only screen and (min-width:600px){
   .col-m-1{width: 8.33%;}
   .col-m-2{width: 16.66%;}
   .col-m-3{width: 25%;}
   .col-m-4{width: 33.33%;}
   .col-m-5{width: 41.66%;}
   .col-m-6{width: 50%;}
   .col-m-7{width: 58.33%;}
   .col-m-8{width: 66.66%;}
   .col-m-9{width: 75%;}
   .col-m-10{width: 83.33%;}
   .col-m-11{width: 81.66%;}
   .col-m-12{width: 100%;}
}*/
/* for desktop phones 
@media only screen and (min-width:600px){
   .col-1{width: 8.33%;}
   .col-2{width: 16.66%;}
   .col-3{width: 25%;}
   .col-4{width: 33.33%;}
   .col-5{width: 41.66%;}
   .col-6{width: 50%;}
   .col-7{width: 58.33%;}
   .col-8{width: 66.66%;}
   .col-9{width: 75%;}
   .col-10{width: 83.33%;}
   .col-11{width: 81.66%;}
   .col-12{width: 100%;}
}
*/