@charset "UTF-8";
@import url(http://cafebrooch.com/css/lightbox.css);

/* Site Base Styles CSS (styles-site.css) */

*{
margin:0;
padding:0;
}

html, body {
  height:100%;
  }

body{
  width:100%;
  font:12px "ヒラギノ角ゴ","Osaka", "ＭＳ Ｐゴシック", "Arial", "sans-serif";
  color:#6C6C6C;
  text-align:center;
  background:url(http://cafebrooch.com/imgs/back-head.jpg) repeat-x top;
  }
  
img{border:0;}
.left{float:left;}
.right{float:right;}
.clear{clear:both;width:0px;height:0px;overflow:hidden;}
a{text-decoration:none;color:#6C6C6C;}
a:hover{text-decoration:underline;color:#FF8C0F;}

#wrapper{
  width:100%;
  min-height:100%;
  height:auto !important;
  height:100%;
  margin:0 auto -50px;
  clear:both;
  }

#container{
  width:900px;
  margin:0 auto;
  padding:80px 0 50px;
  clear:both;
  }


/** Main **/

#menu{
  float:left;
  width:250px;
  text-align:center;
  overflow:hidden;
  }

h1{
  text-indent:-10000px;
  background:url(http://cafebrooch.com/imgs/cafebrooch-title.jpg) no-repeat top;
  overflow:hidden;
  }

h1 a{
  display:block;
  }

h1, h1 a{
  width:250px;
  height:90px;
  }


#menu ul{
  width:200px;
  margin:0 auto;
  padding-top:45px;
  overflow:hidden;
  }

#menu li, #menu li a{
  width:200px;
  height:50px;
  }

#menu li{
  list-style:none;
  float:left;
  text-indent:-100000px;
  padding-bottom:15px;
  overflow:hidden;
  }
  
#menu li a{
  display:block;
  }

#menu .about{background:url(http://cafebrooch.com/imgs/menu-about.jpg) no-repeat top;}
#menu .about a:hover{background:url(http://cafebrooch.com/imgs/menu_h-about.jpg) no-repeat top;}
#menu .aboutH, #menu .aboutH a{background:url(http://cafebrooch.com/imgs/menu_a-about.jpg) no-repeat top;}

#menu .diary{background:url(http://cafebrooch.com/imgs/menu-diary.jpg) no-repeat top;}
#menu .diary a:hover{background:url(http://cafebrooch.com/imgs/menu_h-diary.jpg) no-repeat top;}
#menu .diaryH, #menu .diaryH a{background:url(http://cafebrooch.com/imgs/menu_a-diary.jpg) no-repeat top;}

#menu .event{background:url(http://cafebrooch.com/imgs/menu-event.jpg) no-repeat top;}
#menu .event a:hover{background:url(http://cafebrooch.com/imgs/menu_h-event.jpg) no-repeat top;}
#menu .eventH, #menu .eventH a{background:url(http://cafebrooch.com/imgs/menu_a-event.jpg) no-repeat top;}

#menu .contact{background:url(http://cafebrooch.com/imgs/menu-contact.jpg) no-repeat top;}
#menu .contact a:hover{background:url(http://cafebrooch.com/imgs/menu_h-contact.jpg) no-repeat top;}
#menu .contactH, #menu .contactH{background:url(http://cafebrooch.com/imgs/menu_a-contact.jpg) no-repeat top;}

#menu .toppage{background:url(http://cafebrooch.com/imgs/menu-top.jpg) no-repeat top;}
#menu .toppage a:hover{background:url(http://cafebrooch.com/imgs/menu_h-top.jpg) no-repeat top;}



/** Main **/

#main{
  float:right;
  width:550px;
  padding-top:25px;
  overflow:hidden;
  }

#main .entryTitle{
  font-size:14px;
  text-align:left;
  margin-bottom:10px;
  padding:10px 5px;
  border-bottom:1px dotted #999;
  clear:both;
  }

#main .entryTitle h2{
  color:#333;
  font-size:15px;
  font-weight:bold;
  padding:0 5px 5px;
  }

#main .entry{
  width:550px;
  text-align:left;
  line-height:180%;
  margin-bottom:10px;
  padding:10px 0;
  clear:both;
  }

#main .entry .entryTitle{
  padding-top:0;
  }

#main .entryTitle h2{
  color:#1f1f1f;
  font-size:18px;
  font-weight:bold;
  padding:0 5px 5px;
  }

#main .entry h3{
  color:#555;
  font-size:15px;
  padding:0 5px 5px;
  }

#main .entry .day{
  font-size:12px;
  text-align:right;
  padding:5px;
  border-top:1px dotted #999;
  }

#main .entryBody{
  font-size:12px;
  line-height:180%;
  padding:10px 0;
  }

#main .entryBody p{
  padding-bottom:15px;
  }

#main .details{
  width:540px;
  line-height:180%;
  padding:10px 5px 0;
  overflow:hidden;
  clear:both;
  }

#main .details h4{
  color:#555;
  padding-bottom:5px;
  }

#main .detail{
  float:right;
  width:380px;
  overflow:hidden;
  }

#main .dmImage{
  float:left;
  width:150px;
  overflow:hidden;
  }


#main ul{
  width:550px;
  padding-bottom:50px;
  clear:both;
  }

#main li{
  width:530px;
  text-align:left;
  padding:5px 10px 10px;
  }


#about{
  width:550px;
  text-align:left;
  line-height:180%;
  margin-bottom:10px;
  padding:10px 0;
  clear:both;
  }

#about h2{
  color:#333;
  font-size:18px;
  font-weight:bold;
  padding:0 0 15px;
  }

#about .entryBody{
  font-size:12px;
  line-height:200%;
  padding:10px 0;
  }

#about .entryBody p{
  padding-bottom:15px;
  }



/* Mailform */

#mailform{
  font-size:12px;
  }

#mailform h3{
  color:#333;
  font-size:15px;
  font-weight:bold;
  text-align:left;
  line-height:150%;
  margin-bottom:15px;
  padding:0 10px 7px;
  border-bottom:1px dotted #ccc;
  clear:both;
  }

#mailform .entryBody{
  text-align:left;
  line-height:150%;
  padding:0 5px 10px;
  clear:both;
  }

#mailform table{
  width:550px;
  margin:10px auto 20px;
  background:#ccc;
  }

#mailform th, #mailform td{
  text-align:left;
  line-height:150%;
  text-align:left;
  vertical-align:top;
  padding:10px;
  }

#mailform th{
  width:200px;
  font-weight:bold;
  background:#eee;
  }

#mailform td{
  background:#fff;
  }

#mailform td p{
  padding:5px 0 0;
  }

#commentError, #mailform .mailerror{
  color:#9B0728;
  }


#mailform .btn{
  text-align:center;
  line-height:150%;
  margin:0 auto;
  padding:0 10px 10px;
  clear:both;
  }


#mailform .powered{
  color:#999;
  font-size:9px;
  text-align:right;
  line-height:135%;
  padding:3px;
  }

#mailform .powered a{
  color:#999;
  text-decoration:none;
  }



#footer{
  width:100%;
  height:50px;
  background:url(http://cafebrooch.com/imgs/back-bottom.jpg) repeat-x bottom;
  overflow:hidden;
  clear:both;
  }

#footer .copyright{
  font-size:11px;
  text-align:center;
  line-height:15px;
  padding:5px 0 30px;
  }

.push{
  width:100%;
  height:50px;
  text-indent:-10000px;
  clear:both;
  overflow:hidden;
  }