body  {  font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;  background: #ffffff;  margin: 0;  padding: 0;  color: #000;  }
	img { border: 0; }
	td.mytable_logo_cell    {  width: 110px;   }  
	td.mytable_text_cell    {  width: 310px;   }
	#logo-1 { display: none; }
	#logo-2 { display: block; text-align: center; }
hr.new1 {  border-top: 2px dotted gray;  margin-left: 100px; margin-right: 100px;}	
hr.new2 {  border-top: 2px dashed gray;  margin-left: 50px; margin-right: 50px;}	
hr.wide { border-width: 4px; }

*  KNOWN ACTIVE STYLES - small screen  */
/*	.myRRBody [ max-width: 900px; margin-left: auto; margin-right: auto; padding: 0; background: #420000; ] */
	#container2 {	max-width: 800px; padding: 0px 40px 0px 40px;    overflow: hidden;	background: #ffffff;	margin: 0 auto; }
.column {   float: left;   width: 33.33%;   padding: 5px; }
	img.BRH_logo  {   width: 103px;     }
.row::after {   content: "";   clear: both;   display: table; }
* {  box-sizing: border-box; }
	.myBRHheader {	background: #ffffff;}
	.myEntirePage {max-width: 800px; padding: 10px 10px 10px 10px;    overflow: hidden;	background: #ffffff;	margin: 0 auto;}
	.myRRpost { font: 8px arial, sans-serif; font-weight: normal; color: grey; text-align: left; font-style: italic; margin-left: 10px;}
	.myRRtitle { font-family: arial; font-size: 16px; color: black; font-weight: bold; text-align: left; margin-left: 5px;}
	.myRRtitle2 {width: 100%;  font-family: arial; font-size: 16px; color: black; font-weight: bold; text-align: left; margin-left: 5px;}
	.myRRMorphLowerDates {width: 100%;  font-family: arial; font-size: 40px; color: black; font-weight: bold; text-align: center; margin-left: 5px;}
	.myRRMorphTitle {width: 100%;  font-family: arial; font-size: 30px; color: black; font-weight: bold; text-align: center; margin-left: 5px;}
	.myRRMorphClickText {width: 100%;  font-family: arial; font-size: 20px; color: black; font-weight: light; font-style: italic; text-align: center; margin-left: 5px;}
	.myRRMorphTitleLeft {width: 100%;  font-family: arial; font-size: 30px; color: black; font-weight: bold; text-align: left; margin-left: 5px;}
	.myRRMorphClickTextLeft {width: 100%;  font-family: arial; font-size: 20px; color: black; font-weight: light; font-style: italic; text-align: left; margin-left: 5px;}
	img.RRMorphImg { 	display: block; 	margin-left: auto;	margin-right: auto; }

ul.myTimelineItems {	font: 16px arial, sans-serif; text-align: left; margin-left: 50px; list-style-type: square; margin-bottom: 10px; line-height: 130%;} 
.myTimelineRef {font-family: arial; font-size: 12px; }
	.myRRClickForPastIndex { font-family: arial; font-size: 16px; color: red; font-weight: bold; }
	.myRRClickForPastEmail { font-family: arial; font-size: 16px; color: red; font-weight: bold; }
   .myPastReunionUL { color: white; margin-left: 50px; text-align: left; }
   ul.myPastReunionUL { color: white; margin-left: 50px; text-align: left; }
   li.myPastReunionUL { color: white; margin-left: 50px; text-align: left; }
	table.Nav { width: 100%; margin-left:auto;  margin-right:auto; }
	.myRRbyline { font-family: times; font-size: 12px; color: black; font-weight: bold; text-align: left; margin-left: 15px;}
	.myColTitles{ font-family: arial; font-size: 8px; color: black; font-weight: bold; }
hr.new1 {  border-top: 2px dotted gray;  margin-left: 5px; margin-right: 100px;}	
hr.myRRImageDivider {  border-top: 1px dotted gray;  margin-left: 5px; margin-right: 5px;}	
	.myRRbody { font: 18px times, serif; font-weight: normal; text-align: left; text-indent: 10px; padding-top: 10px;}
.myRegUrls{ font-family: times; font-size: 14px; color: black; font-weight: bold;  padding-top: 5px;}
.mygallery_row2 { margin-left: auto;  align: bottom; margin-right: auto; width: 90%;  padding: 5px 5px 5px 5px; text-align: center; font-size: 16px; border: 0px solid black;}
	.myRRbody2 { overflow: auto; font: 18px arial; font-weight: normal; text-align: left; text-indent: 10px; padding-top: 20px;}
	img.myPhotosIcons { overflow: auto; padding-top: 20px;}
img { max-width: 100%;  height: auto;  border: 0px solid green;  }
img.RR_img { width: 150px;  height: auto;  float: left;  border: 0px solid blue;   padding: 0px 15px 0px 5px; }
.mygallery_img { width: 100%; height: auto; display:inline-block; padding: 1px 8px 1px 8px; text-align: center; font-size: 14px; border: 0px solid black; }
	.RandomRippling_content{ max-width: 100%; }
.myRRNav {width: 100%; font-family: arial; font-size: 10px; color: grey; font-weight: bold;}
.myRRIndexPageImg{ max-width: 100px;}
	.mytitle2left{	font: 14px arial, sans-serif; text-align: left;}          
	.myPhotosSectionTitle{	font: 18px arial, sans-serif; text-align: left; margin-left: 10px;}          
	ul.myBRHulPhotos{	font: 16px arial, sans-serif; text-align: left; margin-left: 50px; list-style-type: square; margin-bottom: 10px; line-height: 130%;}         
	.mytitle2indent{	font: 14px arial, sans-serif; text-align: left; margin-left: 40px;}          
	.mytitle1sansleft{	font: 20px arial, sans-serif; text-align: left;}          
.mySubscribeButton {margin-left: auto; margin-right: auto; padding: 3px;}
	table.myBRHlogotable { 	text-align: center;	margin-left: auto;	margin-right: auto; }
	.myBRHtitle1  {  font: 20px times, serif; text-align: center; color: black; font-weight: bold;}          
	.myBRHtitle2  {  font: 14px arial, sans-serif; text-align: center;  font-style: normal;  color: #333333;}          
	.myBRHtitle3  {  font: 12px arial, sans-serif;  font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif; text-align: center; font-style: italic; color: #CC6699;}          
.mypicturepagesheader { font-weight: bold; }
     .myPhotoCredit {font-family: arial; font-size: 8px; text-align: right; }
	 .myCD {font-family: arial; font-size: 18px; font-weight: bold; width: 100px;}
	 .myCN {font-family: arial; font-size: 18px; font-weight: bold;}
	 .myCA {font-size: 12px; padding-left: 20px;}
/* Popup container - can be anything you want */
main {
  display: flex;
  align-items: center;
  justify-content: center;
}

area {
  outline: 5px solid red;
}

.popup {
  padding: 20px;
  background-color: rgba(100, 100, 100, 0.9);
  color: white;
  font-weight: 100;
  font-size: 14px;
  position: absolute;
  left: 200px;
  top: 400px;
  opacity: 0;
  transform: scale(0);
  transition: opacity 300ms, transform 300ms;
}

.popup:target {
  opacity: 1;
  transform: scale(1);
}

.popup > .close {
  position: relative;
  right: -10px;
  top: -10px;
  background-color: black;
  padding: 4px 10px;
}  
  
  
  
  
}}/*  END of KNOWN ACTIVE STYLES   */







	.myButton_current{background:url(br_current_up.gif) no-repeat; cursor:pointer; border:none; width:100px; height:64px; }
.myButton_current:hover {    background:url(br_current_dn.gif) no-repeat; }	
.myButton_history{background:url(br_history_up.gif) no-repeat; cursor:pointer; border:none; width:100px; height:64px; }
.myButton_history:hover {    background:url(br_history_dn.gif) no-repeat; }	
.myButton_time{background:url(br_time_up.gif) no-repeat; cursor:pointer; border:none; width:100px; height:64px; }
.myButton_time:hover {    background:url(br_time_dn.gif) no-repeat; }	
.myButton_contact{background:url(br_contact_up.gif) no-repeat; cursor:pointer; border:none; width:100px; height:64px; }
.myButton_contact:hover {    background:url(br_contact_dn.gif) no-repeat; }	
.myButton_pictures{background:url(br_pictures_up.gif) no-repeat; cursor:pointer; border:none; width:100px; height:64px; }
.myButton_pictures:hover {    background:url(br_pictures_dn.gif) no-repeat; }	
.myButton_links{background:url(br_links_up.gif) no-repeat; cursor:pointer; border:none; width:100px; height:64px; }
.myButton_links:hover {    background:url(br_links_dn.gif) no-repeat; }	
	/* ~~ Element/tag selectors ~~ */
	ul, ol, dl , li { 	padding: 0;	margin: 0;	line-height: 150%; word-break: normal;   white-space: normal;}
	h1, h2, h3, h4, h5, h6, p {	margin-top: 0;		padding-right: 0px;	padding-left: 0px; }
	a img { 	border: none;}
	/* ~~ Styling for your site's links must remain in this order - including the group of selectors that create the hover effect. ~~ */
	a:link {	color: #5555FF;	text-decoration: underline; }
	a:visited {	color: #6E6C64;	text-decoration: underline;}
	a:hover, a:active, a:focus { 	text-decoration: none;}
	
	/* ~~this fixed width container surrounds the other divs~~ */
	#container {	width: 100%;     overflow: hidden;	background: #fff;	margin: 0 auto; }
	.sidebar1 {display: none;}
	.sidebar2 {display: block;	text-align: center;	margin-left: auto;	margin-right: auto;	width: 210px;	background: #FFFFFF; font-family: arial; font-size: 18px; margin-top: 5px; }
	.header1 {display: none;}
	.header2 {display: block;	text-align: left;	float: left;	width: 100%; max-width: 800px; 	background: #FFFFFF; font-family: arial; font-size: 18px; }
	.bottombar1 {display: none;}
	.bottombar2 {display: block;	text-align: center;	margin-left: auto;	margin-right: auto;	width: 210px;	background: #FFFFFF; font-family: arial; font-size: 18px; margin-top: 5px; }
	.mytwitter {	text-align: center;	margin-left: auto;	margin-right: auto;}
     .myIndexTitle1 {font-family: arial; font-size: 28px; text-align: left; }
     .myIndexTitle2 {font-family: arial; font-size: 20px; text-align: left; }
     .myIndexTitle3 {font-family: arial; font-size: 12px; text-align: left; }
     .myIndexListingTitle {font-family: arial; font-size: 18px; text-align: left; }	 
     .myIndexListing {font-family: arial; font-size: 14px; text-align: left; }	 
     .myIndent1 { margin-left: 10px; }	 
     .myIndent2 { margin-left: 20px; }	 
     .myIndent3 { margin-left: 30px; }	 
	/* ~~ This grouped selector gives the lists in the .content area space ~~ */
	.content ul, .content ol { 	padding: 0 0px 0px 15px; }
	.content {	padding: 0px 5px 0px 5px;	max-width: 350px; margin-left: auto;	margin-right: auto;	background: #fff;}
	.header {	padding: 0px 5px 0px 5px;	max-width: 350px; margin-left: auto;	margin-right: auto;	background: #fff;}

	/* ~~ The navigation list styles (can be removed if you choose to use a premade flyout menu like Spry) ~~ */
	ul.nav {	list-style: none; 	border-top: 1px solid #666;	margin-bottom: 15px; }
	ul.nav li {	border-bottom: 1px solid #666; }
	ul.nav a, ul.nav a:visited { 	padding: 5px 5px 5px 5px;	display: block;	width: 200px;  	text-decoration: none;	background: #C6D580;	color: #666; line-height: 100%;}
	ul.nav a:hover, ul.nav a:active, ul.nav a:focus { 	background: #ADB96E;	color: #FFF;}
	ul.nav2 {	padding: 0px 0px 0px 0px; list-style: none; 	border-top: 1px solid #666; 	margin-bottom: 15px; }
	ul.nav2 li {	border-bottom: 1px solid #666; }
	ul.nav2 a, ul.nav2 a:visited { 	padding: 5px 5px 5px 5px;	display: block; 	text-decoration: none;	background: #C6D580;	color: #666; line-height: 100%;}
	ul.nav2 a:hover, ul.nav2 a:active, ul.nav2 a:focus { 	background: #ADB96E;	color: #FFF;}
	.mytitle1sans{	font: 20px arial, sans-serif; text-align: center;}          
	.mytitle1sans{	font: 20px arial, sans-serif; text-align: center;}          
	.mytitle1sansleft{	font: 25px arial, sans-serif; text-align: left; }          
	.mytitlesans{	font: 28px arial, sans-serif; text-align: center;}          
	.mytitle2left{	font: 14px arial, sans-serif; text-align: left; margin-left: 10px;}          

	
	#footer {	padding: 10px 0;	background: #CCC49F;	position: relative;	clear: both; 	font: 15px arial, sans-serif;}
	#footer table{	margin-left: auto;	margin-right: auto; text-align: center;}
	img.myimg_classified_logo { 	display: block; 	margin-left: auto;	margin-right: auto; }
	img.myimg_classified_logo2 { 	display: block; padding: 5px 5px 5px 5px;}
	table, th, td {   border: 0px solid red;}  
/*.mypicturepages 	img { width: 100%; }*/
.mypicturepages 	img { max-width: 100%; }
.myPicturePagesSpanningDescriptions { font-family: arial; font-size: 14px; color: black; font-weight: bold;}
.myImageRowSpanningText { font-family: arial; font-size: 14px; color: black; font-weight: bold;}
.myImageText { font-family: arial; font-size: 16px; color: black; font-weight: bold;}
.myPicturePagesImageFullCaptions { font-family: arial; font-size: 10px; color: black; font-weight: bold;}
.myPicturePagesDescriptions { font-family: arial; font-size: 10px; color: black; font-weight: bold;}
.myPicturePagesDescriptions img{ border: 3px solid #000;  width:100%; max-width: 150px; height: auto;}
.myPicturePagesDescriptionsFull img{ border: 3px solid #000;  width:100%; max-width: 800px; height: auto;}
.myPicturePagesDescriptions td{ width: 30%; padding: 5px; vertical-align:bottom;}
	.mylarge{ font-family: arial; font-size: 36px; color: black; }
	.mytitle{ font-family: arial; font-size: 24px; color: black; font-weight: bold;}
	.mynormal{ font-family: arial; font-size: 16px; color: black; }
	.mysmaller{ font-family: arial; font-size: 12px; color: black; }
	.mysmaller_ital{ font-family: arial; font-size: 12px; color: black; font-style: italic;}
	.mygallery_title1 { width: 100%; display: block; float: left; padding: 5px 5px 5px 5px; text-align: center; font-size: 22px; font-weight: bold;}
.mygallery_title2 { width: 100%; display: block; float: left; padding: 5px 5px 5px 5px; text-align: center; font-size: 18px; font-weight: bold;}
.mygallery_img form {padding: 0px 0px 20px 0px;}
.mygallery_row_title { width: 100%; display: block; float: left; padding: 15px 5px 0px 5px; text-align: center; font-size: 20px;  font-weight: bold; }
.mygallery_row { margin-left: auto; margin-right: auto; width: 100%;  padding: 5px 5px 5px 5px; text-align: center; font-size: 16px; border: 0px solid black;}
.mygallery_img { width: 150px; display:inline-block; padding: 1px 8px 1px 8px; text-align: center; font-size: 14px; border: 0px solid black; }
.myLargerImageText { font-size: 10px; padding: 0px 0px 15px 0px;}
.imagenumber { font-size: 12px; }
.mygallery_img_text { width: 150px; padding: 1px 1px 1px 1px; text-align: center; font-size: 14px; font-weight: bold; border: 0px solid black;}
.mygallery_icon {  display:inline-block; padding: 1px 8px 1px 8px; text-align: center; font-size: 12px; border: 0px solid black; vertical-align:top;}
.post-content {     margin-left: 155px;  text-align: left;  }
.post-title {     font-size: 16px;   }
.post-titleLine2 {     font-size: 14px;  margin-left: 165px; font-style: italic; text-align: left;  }
.post-container {   margin: 5px 5px 5px 5px ;      border: 2px solid #333;    overflow: auto  }
.post-thumb {    float: left }
.post-thumb img {     display: block; }
	.mytitleyear  {  font: 30px arial, sans-serif; margin-left: 5px; font-weight:bold;	text-align: left; }          
	.mytitlemonth  {  font: 20px arial, sans-serif; margin-left: 10px; text-align: left; }          
	.mytitleprop  {  font: 15px arial, sans-serif; margin-left: 15px; text-align: left;}          
	.mytitlePicture800  {  font: 20px arial, sans-serif; margin-left: 10px; text-align: left; }          
	table.pictures { 	border: 0px solid black; width: 100%; text-align: center;	margin-left: auto;	margin-right: auto; font-family: arial; font-size: 18px; font-weight:normal;}
	.mytable_pictures_category { font-family: arial; font-size: 24px; font-weight:bold;	text-align: center;  }
	.mytable_pictures_category_details { font-family: arial; font-size: 18px; font-weight:nornal;	text-align: center; text-indent: 1em; margin-top: 0.83em }
	.mytable_pictures_category_details_left { font-family: Georgia, serif; font-size: 16px; font-weight:nornal;	text-align: left; text-indent: 1em; margin-top: 0.83em; word-wrap: normal; }
	.mytable_pictures_category_details_note { font-family: Georgia, serif; font-size: 14px; font-weight:nornal;	text-align: left; text-indent: 1em; margin-top: 0.83em; font-style: italic; margin-left: 60px; margin-right: 60px; }
	table.logotable { 	width: 100%; text-align: left;	margin-left: auto;	margin-right: auto; }
	.mytable_pictures_click { font-family: arial; font-size: 10px; font-weight:normal;	text-align: center; font-style: italic; }
.mymain_img { max-width: 350px; }

	
@media screen and (min-width: 700px)
	{
	body  {  font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;  background: #ffffff;  margin: 0;  padding: 0;  color: #000;  }
	img.BRH_logo  {  width: 150px;    }
	table.logotable { 	width: 100%; max-width: 800px; text-align: left;	margin-left: auto;	margin-right: auto; }
	table.maintable { 	width: 100%; max-width: 1000px;  text-align: left;	margin-left: auto;	margin-right: auto; }
	table.pictures { 	border: 0px solid black; width: 100%; max-width: 800px; text-align: center;	margin-left: auto;	margin-right: auto; font-family: arial; font-size: 18px; font-weight:normal; table-layout: fixed;}
	table.footertable { 	width: 100%; max-width: 800px;  text-align: left;	margin-left: auto;	margin-right: auto; }
	table.PropertyInfo { 	width: 700px; text-align: left;	margin-left: 10px;	margin-right: auto; }
	td.mytable_PropertyCategory { width: 15%;   background: #ffffff; margin-left: auto; font-style: italic; font-size: 12px; text-align: right; }
	td.mytable_PropertyData { width: 85%;   background: #ffffff; margin-left: auto;  font-weight: bold; }
	td.mytable_sidebar_cell    {  width: 14%;   background: #ffffff; margin-left: auto;}  
	td.mytable_main_cell    {  width: 86%;    background: #ffffff;   }
	td.mytable_footer_cell    {  width: 50%;    background: #ffffff; text-align: center;  }
	#logo-1  {  display: block;  text-align: center;  }
	#logo-2  {  display: none;  }
.mymain_img { max-width: 800px; }
	
	/* ~~ Element/tag selectors ~~ */
	ul, ol, dl { 	padding: 0;	margin: 0;	line-height: 150%;}
	td.mytable_logo_cell    {  width: 20%;    }  
	td.mytable_text_cell    {  width: 80%;    }
	
	/* ~~this fixed width container surrounds the other divs~~ */
	#container {	max-width: 930px;	text-align:center;    }
	.header {	width: 100%; max-width: 800px;	background: #fff;}
	.sidebar2 {display: none;}
	.sidebar1 {display: block;	text-align: left;	float: left;	width: 210px;	background: #FFFFFF; font-family: arial; font-size: 18px; }
	.header2 {display: none;}
	.header1 {display: block;	text-align: left;	float: left;	width: 100%; max-width: 800px; 	background: #FFFFFF; font-family: arial; font-size: 18px; }
	.bottombar2 {display: none;}
	.bottombar1 {display: block;	text-align: center;	margin-left: auto;	margin-right: auto;	width: 800px;	background: #FFFFFF; font-family: arial; font-size: 18px; margin-top: 5px; }
	.content {	width: 100%; max-width: 800px;	background: #fff;}
hr.new1 {
  border-top: 2px dotted gray;  margin-left: 300px; margin-right: 300px;
}	
hr.new2 {
  border-top: 2px dashed gray;  margin-left: 100px; margin-right: 100px;
}	
	.mytitle1sansleft{	font: 25px arial, sans-serif; text-align: left; }          
	
	/* ~~ The navigation list styles (can be removed if you choose to use a premade flyout menu like Spry) ~~ */
	ul.nav { font: 18px arial, sans-serif;}
	ul.nav a, ul.nav a:visited { 	padding: 5px 5px 5px 15px;		width: 190px;  }
	
	#footer  {  padding: 10px 0;  background: #CCC49F;  position: relative;  clear: both;  font: 15px arial, sans-serif;  }
	.mytitle1  {  font: 50px times, serif; text-align: left;  }          
	.mytitle2  {  font: 18px arial, sans-serif; text-align: left;  }          
	.mytitle3  {  font-size: 16px; text-align: left;  }          
	.myBRHtitle1  {  font: 45px times, serif; text-align: center; color: black; font-weight: bold;}          
	.myBRHtitle2  {  font: 18px arial, sans-serif; text-align: center;  font-style: normal;  color: #333333;}          
	.myBRHtitle3  {  font: 14px arial, sans-serif;  font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif; text-align: center; font-style: italic; color: #777777;}          
.post-container {   margin: 0px 20px 20px 25px ;      border: 2px solid #333;    overflow: auto  }
.post-thumb {    float: left }
.post-thumb img {     display: block; }
.post-content {     margin-left: 160px;  text-align: left;  }
.post-title {     font-size: 16px;   }
.post-titleLine2 {     font-size: 14px;  margin-left: 175px; font-style: italic; text-align: left;  }
		 }