/* site_mobile.css - Overrides Site.css upon screen going narrow */ 
BODY{
overflow-x: hidden;
}
.bodyThird{
width:100%;
float:none; 
}
.bodyThirdLast{
width:100%;
float:none; 
}
.bodyTwoThirds{
width:100%;
float:none; 
}
.bodyHalf{
width:100%;
float:none; 
}
.bodyFourth{
width:100%;
float:none; 
}
.bodyFifth{
width:100%;
float:none; 
}
.bodyThreeFourths{
width:100%;
float:none; 
}
.bodyFifth{
width:100%;
float:none; 
}
.bodyQuarter{
width:100%;
float:none; 
}
.bodyPad{
padding:10px; 
}
.bodyPadSmall{
padding:5px;
}
.bodyPadTiny{
padding:3px;
}
.textJustify{
text-align:initial;
}
/* displays only on mobile version */
.mobileOnly{
display:block; 
}
/* displays only on full site version */
.noMobile{
display:none;
}
/* on mobile version: causes image to display across mobile phone width, rather than floating left or right*/
img.bodyImg{
float:none !important;
width:100% !important;
height:auto !important;
overflow:hidden;
margin-top:20px !important;
margin-bottom:8px !important;
margin-left:0 !important;
margin-right:0 !important;
border:0;
}
iframe.iframeSize{
height:250px; 
}
iframe.videoSize{/* for admin25.cfm YouTubeVideos */ 
width:100% !important;
height:250px !important; 
}
table#calendarListTable{
margin-top:-20px !important;
}
table#calendarListTable tr td{
padding:20px 0 20px 0 !important;  
}
table#calendarListTable tr:first-child td{
padding:0 0 20px 0 !important;  
}
#SiteBackgroundDiv{/*  BODY tag */
margin:0;
overflow-x:hidden;
-webkit-overflow-scrolling: touch; /* prevents sticky scrolling on mobile */
}
#SiteVeryTopDiv{/* above site body div main template */
width:100%;
overflow-x:hidden;
padding: 0 10px 10px 10px; 
margin-top:0;
margin-bottom:0;
margin-left:0;
margin-right:0;  
}
#SiteBodyDiv{/* main template */
width:100%;
padding:0;
margin:0;
overflow-x:hidden;
}
#HeaderTopDiv{
overflow-x:hidden;
}
#HeaderDesignDiv{
overflow-x:hidden;
}
/* #TopMenuDiv  stays, but changes to hamburger style (#topMenuMobile), and Vertical Menu elements are added to it  */
#TopMenuDiv{
display:table-cell;
vertical-align:middle;
height:auto;
padding:0;
overflow-x:hidden; 
overflow-y:visible;
}
#TopMenuDiv a, #TopMenuDiv a:link, #TopMenuDiv a:visited, #TopMenuDiv a:active{
white-space:normal; /* let them menu wrap on mobile */
}
#TopMenuDiv #topMenuTable{
display:none; /* inside of TopMenuDiv */
}
.kristiTopSubDiv{
display:none; /* inside of TopMenuDiv, kristi top menu layout */
}
#topMenuMobile{
display:block; /* display mobile version of the menu */
}
#TopMenuDiv div#TopMenuMobileCallContact{/*  bar on cell phone: [ Call Us   |   Contact Us ] */
display:block;   
}
#VerticalMenuDiv{
display:none; /* these will have been added to the TopMenuDiv #topMenuMobile */
}

#SiteBodyDiv table#sbdMain{
width:100% !important;
}
#SiteBodyDiv table#sbdMain tr td{
padding:0;
vertical-align:top;
}
table#tableMainContent{
width:100% !important;
}
TABLE.tableLayoutFixed{
width:100% !important; 
} 
#PageBodyDiv{
width:100% !important; 
overflow-x:hidden; 
}   
#PageFooterDiv{
overflow-x:hidden;
}
#FooterMenuDiv{
overflow-x:hidden;
}
#FooterMenuDiv{
padding-bottom:20px;
}
#FooterMenuDiv span{/* give some space between links */
margin-left:15px;
margin-right:15px;
margin-top:10px;
margin-bottom:10px; 
float:left;
}
#FooterMenuDiv span.sep{
display:none; /* get rid of | separators, if any */
}
#FooterMenuDiv .wid3{
display:none; /* get rid of 3px spacers, if any */
}
#footerCredits{
padding:0;
margin:30px 0 30px 0;
width:100%;
overflow-x:hidden;
text-align:center;
}
.err{
margin: 7px 0 7px 0;
width:95%; /* overrides 75% */
overflow-x:hidden;
}
.msg{
margin: 7px 0 7px 0;
width:95%; /* overrides 75% */
overflow-x:hidden;
}
.minorMsg{
margin: 5px 0 5px 0;
width:95%; /* overrides 75% */
overflow-x:hidden;
font-size: 15px; /* was 12 */
}
/* sitemap columns changed to the following from sitemaptable for mobile responsiveness: 4/16/2015 */ 
table#sitemapTable tr td{
width:100%;
vertical-align:top;
}
td.sitemapColumn1{/* used if there is only one column on the site map */
width:100%;
overflow-x:hidden;
}
td.sitemapColumn2{/* used for both columns,  if there are exactly two columns on the site map */
width:100%;
padding-top:20px;
padding-bottom:20px;
width:100%;
overflow-x:hidden;
}
td.sitemapColumn3{/* used for all 3 columns,  if there are exactly three columns on the site map */
width:100%;
padding-top:20px;
padding-bottom:20px;
width:100%;
overflow-x:hidden;
}
.sitemapColumnPadding{/* inside of each column div to add padding */
padding:10px 10px 10px 10px;
}
/* font size overrides  */
#cartSpace{font-size:17px;}
.VLgHeadiTxt{font-size:26px;}
.LgrHeadiTxt{font-size:23px;}
.LgHeadiTxt{font-size:20px;}
.MdHeadiTxt{font-size:19px;}
.SmHeadiTxt{font-size:18px;}
.NormTxt{font-size:17px;}
.SmTxt{
font-size:16px;
line-height: 19px;   
}
.TinyTxt{
font-size:15px;
line-height: 18px;   
}
H1{font-size:23px;}/* Used for Page Title - font size is Page Body Font Size + 6 pixels */
H2{font-size:20px;}/* Font size is Page Body Font Size + 3 pixels */
H3{font-size:19px;}/* Font size is Page Body Font Size + 2 pixels */
#SiteBackgroundDiv{font-size:15px;}/* BODY Background Area */  
#footerCredits div a{font-size:15px;}/* was 13 hardcoded */
#HeaderTopDiv{font-size:15px;}
#HeaderDesignDiv{font-size:15px;}
#HeaderDesignDiv TABLE TD, #HeaderDesignDiv P,  #HeaderDesignDiv DIV{font-size:15px;}
#PageBodyDiv{font-size:17px;}
#TopMenuDiv{font-size:20px;}
#TopMenuDiv SPAN{font-size:20px;}
#TopMenuDiv a, #TopMenuDiv a:link, #TopMenuDiv a:visited, #TopMenuDiv a:active{font-size:20px;}
#TopMenuDiv a:hover{font-size:20px;}
#TopMenuDiv .TopMenuOver a, #TopMenuDiv .TopMenuOver a:link, #TopMenuDiv .TopMenuOver a:visited, #TopMenuDiv .TopMenuOver a:active{font-size:20px;} 
#photoAlbumMenu span{font-size:19px;}
#photoAlbumMenu span a, #photoAlbumMenu span a:link, #photoAlbumMenu span a:visited, #photoAlbumMenu span a:active{font-size:19px;}
#photoAlbumMenu span a:hover{font-size:19px;}
/* no Vertical Menu on mobile */
#PageFooterDiv{font-size:17px;}
#PageFooterDiv TABLE TD, #PageFooterDiv P,  #PageFooterDiv DIV{font-size:17px;}
#FooterMenuDiv{font-size:17px;}
#FooterMenuDiv SPAN{
float:left;
margin-left:15px;
margin-right:15px;  
font-size:17px; 
}
#FooterMenuDiv a, #FooterMenuDiv a:link, #FooterMenuDiv a:visited, #FooterMenuDiv a:active{font-size:17px;}
#FooterMenuDiv a:hover{font-size:17px;}
.EventName{font-size:19px;}/* same as .W3ShoppingCart_ProductName in other template for sign-up-and-pay events */
table#calendar .bigCalendar{font-size:22px;}/* was 20 hard-coded */
.title_h2{font-size:16px;}/* was 13 hardcoded */
FIELDSET LEGEND{font-size:18px;}/* same as h3 */
#printerFriendlyPrintButton{DISPLAY:NONE;}
#membershipLogoutButton SPAN{font-size:16px;}/* was 12 */
#upcomingEventsButton a SPAN{font-size:16px;}/* was 12 */ 
/* EVENT INFO PAGE */
table.event_signup_pageBodyTable{width:100%;}
table.event_info_pageBodyTable{width:100%;}
div.eventGoogleMap{/* div for iframe events map */
width:100%;
height:300px;
float:none;
display:block;
margin-top:15px;
margin-bottom:15px;
}
iframe.eventGoogleMap{
width:100%;
height:300px;
}
/* END EVENT INFO PAGE */ 
/* MEMBERSHIP LOGIN PAGE */ 
#pagetype_membership #divLogin{
width:90%;
}
#loginTableDiv{
border-radius:8px !important;
-moz-border-raduis:8px !important;
background:#eeeeee !important;  
}
table#loginFormTable tr td{
padding:10px 0 10px 5px !important;
}
table#loginFormTable tr td input.formfield{
padding:3px;  
}
/* END MEMBERSHIP LOGIN PAGE */ 
/* BLOG PAGE */
#BlogRightDiv{/* on td */ 
width:100%;  
overflow:hidden; 
border-top:1px solid #dddddd; 
padding:20px 0 0 0;
font-size:16px;
}
.blogBodyImageDiv{/* keep the same in admin.css */  
margin:0 auto 15px auto !important;
width:99% !important;
height:auto !important;
overflow:hidden;
border:1px solid #dddddd;  
border-radius:8px;
-moz-border-radius:8px; 
-moz-box-shadow: 0px 0px 0px #bbb;
-webkit-box-shadow: 0px 0px 0px #bbb;
box-shadow: 0px 0px 0px #bbb;
}
H2.commentTitle{
font-size:22px; 
margin-bottom:12px;
}
#blog-page div.divCommentForm{
width:95%;
}
table.commentTable{
width:90%;
}
#blog-page .fieldTitle{/* for comment forms */
margin:15px 0px 5px 0px;
white-space:nowrap;
}
#blog-page span.fieldErr{/* for comment forms */
display:block; /* make it go under the field, not beside it */
margin-left:1%;
width:99%; 
font-size:17px; /* like TinyTxt */
}
#blog-page div.formSaying{
font-size:17px; /* like TinyTxt */
}
#blog-page .divComments{
margin:10px 10px 0px 10px;
display:none;
}
#blog-page H2.blogArticleTitle{
margin-bottom:10px;
}
#blog-page .post-info{
font-size:17px;   
margin-bottom:20px;	 
}
#blog-page .post-info .post-info-date{
white-space:normal;
}
#blog-page div.blogBodyImageDiv img{
width:100% !important;
height:auto !important;
}
#blog-page .post-info span{
display:inline-block;/* so we can add margins to bottom of  them */
margin-right:18px; 
}
#blog-page .post-info div{
margin:18px 0 0 0;
}
#blog-page  table.exerptTable{
margin:0 auto 20px auto; 
width:100%;
}
#blog-page  table.exerptTable tr td p#exerpt{
font-size:18px;   
margin-left:0; 
line-height: 23px;  /* kristi see if this is too much */
}
#blog-page #facebook{
display:none; /* we will display it on article, not on page with lots of exerpts */
}
#blog-page .tagsDiv{
display:none; /* we will display it on article, not on page with lots of exerpts */
}
#blog-page div.comments{
display:none; /* we will display it on article, not on page with lots of exerpts */
}
#blog-page .pageBottomNav{
padding:18px;
}
/* blog article page (overrides on blog-page stuff above) */ 
#blog-article #facebook{
display:block; /* we are display it on article */
}
#blog-article .tagsDiv{
display:block; /* we will display it on article, not on page with lots of exerpts */
}
#blog-article H2.blogArticleTitle{
font-size:26px; 
margin-bottom:18px;
}
#blog-article div.blogBodyImageDiv{
float:none;	 
margin-right:0;
margin-bottom:0;
}
#blog-article div.blogBodyImageDiv img{
width:100% !important;
height:auto !important;
}
#blog-article #post-info div{
margin-top:15px;
font-size:18px;
}
#blog-article #facebook{
margin-left:25px;
}
#blog-article div#articleComments{
margin-left:0px;
text-align:center;
}
#blog-article #articleComments span{
display:inline-block;
margin-left:12px;
margin-right:12px; 
margin-bottom:18px; 
font-size:18px;
}
#blogMoreButton{
margin:15px auto 4px auto;
width:135px;
border-radius:8px;
-moz-border-radius:8px;  
}
#blogMoreButton p{
font-size:17px;		
}
#blogMoreButtonOver{
margin:15px auto 4px auto;
width:135px;
border-radius:8px;
-moz-border-radius:8px; 
}
#blogMoreButtonOver p{
font-size:17px;
}
/* END BLOG PAGE */
/*   COMMERCIAL REAL ESTATE PAGE */  
table.crListingTable{
width:100%;
}
table.crListingTable tr td.crListingDash{
border-top:2px dashed #dddddd !important; 
}
img.crPropertyImage{
margin-top:3px !important; /* overrides bodyImg margins */
margin-bottom:3px !important; /* overrides bodyImg margins */
}
div.crAllListings{
text-align:center !important;
}
.crListingPhotos{/* display:table already: align block center */ 
margin-left:auto;
margin:0 auto 0 auto; /* move table-like block to the center */
}
h2.crMainPropertyTitle{
margin-top:10px;
text-align:center !important;
}
h2.crListingPropertyName.mobile{
text-align:center !important; 
margin:0 0 0 0 !important;
padding:5px;
background:#eeeeee;    /* colors vary by theme on mobile only */
border:1px solid #dddddd; /* colors vary by theme on mobile only */
}
.crPropertyAddress{
display:table;
margin:2px auto 0 auto;
padding-bottom:0; 
}
table.crRightAlignTable{
margin-left:auto;  
margin-right:auto; 
/* aligns middle */
margin:0 auto 0 auto;
}
.crPropertyPriceEtc table{
margin-left:auto;
margin:0 auto 0 auto; /* move table to the center */
}
table.crExpense{
margin-right:auto;
margin:15px auto 0 auto;  /* move table to the center (was aligned right) */
}

table.crBreakdown{
margin-left:auto;
margin:15px auto 0 auto !important; /* move table to the center */
}
table.crBreakdown tr td:nth-child(1){
text-align:left;
}
table.crBreakdown tr td:nth-child(2){
text-align:right;
}
table.crBreakdown tr th{
text-align:left; 
border-top:2px solid #dddddd;  /* varies by theme */ 
}
table.crBreakdown tr:nth-child(1) th{
text-align:center; 
border-top:0;
}
a.crButton{
/* colors change per theme */  
overflow-x:hidden;
margin:8px auto 15px auto;
}
table.crInquiryTable{
margin-right:auto;
margin:0 auto 0 auto;
}
table.crInquiryTable tr td{
padding:5px;
}
/* END COMMERCIAL REAL ESTATE PAGE */
/* For product display on site */ 
#pagetype_event #PageBodyDiv #PageBodyTable{
width:100%;
}
#pagetype_cart #PageBodyDiv #PageBodyTable{
width:100%;
}
.W3ShoppingCart_Selection_Block{
width:100%;
}
.W3ShoppingCart_Selection_Block  table{
width:99%;
}
.W3ShoppingCart_Option_Block{
margin:20px 0 20px 0;
}
.W3ShoppingCart_prodFormMainTable{/* WE ONLY NEED TO DEFINE THIS FOR MOBILE, NOT FOR NON-MOBILE */
width:100%;
}
.W3ShoppingCart_prodFormMainTable tr td{
padding:3px;
}
#eventInfoBox{/* for event fill-in forms [More Info] button */
margin:10px auto 5px auto;
}
.W3ShoppingCart_CatPage_Title{font-size:20px;}
.W3ShoppingCart_CatPage_Text{font-size:17px;}
.W3ShoppingCart_ProductName{font-size:19px;}
.cartPrice{font-size:19px;}
.W3ShoppingCart_ItemNumber_Text{font-size:16px;}
.W3ShoppingCart_Description_Text{font-size:17px;}
.W3ShoppingCart_Price_Text{font-size:18px;}
.W3ShoppingCart_Option_Text{font-size:17px;}
.W3ShoppingCart_Option_Block LABEL{font-size:17px;}
.W3ShoppingCart_Option_NoteText{font-size:15px;}
.W3ShoppingCart_Option_NoteText span{font-size:15px;}
.W3ShoppingCart_Product_Form INPUT{font-size:17px;}
.W3ShoppingCart_Product_Form TEXTAREA{font-size:17px;}
.W3ShoppingCart_Product_Form SELECT{font-size:17px;}
.W3ShoppingCart_ClickPhotoToEnlarge_Text{font-size:14px;}
.W3ShoppingCart_Add_to_Cart_Button_Text{font-size: 16px;}
.W3ShoppingCart_Next_Back_Links{
width:auto;
font-size: 16px;
}
.W3ShoppingCart_Next_Back_Links span{font-size: 21px;}/* span for » increased size */
.W3ShoppingCart_selPhoto{font-size:15px; line-height:21px;}
.W3ShoppingCart_SectionTitle{font-size:18px;}
.W3ShoppingCart_ProdDetailsLink{
margin:10px 0px 15px 0px;
}
.W3ShoppingCart_catListTable{width:100%;}
.W3ShoppingCart_catListTable tr td{
padding:8px 0px 20px 0;	  	 
}
.W3ShoppingCart_catListTable tr td.photo{/* override for the photo cell td */
padding:15px 0px 12px 0;	
border-bottom:0;
text-align:center; /* centers the photo on top of the text */
}
.W3ShoppingCart_catListTable tr td.photo img{
margin-top:20px;
}
.W3ShoppingCart_catListTable tr td div.catListTableDiv{
display:table;
width:250px; /* same width as pic  on mobile */
margin-left:auto;
margin-right:auto;
/* changes to display:table;margin-left:auto; margin-right:auto for mobile devices */
}
/*   MOBILE OVERRIDE STYLES For   productDisplayTemplate_photoList.cfm  (photos across format)  */
#W3ShoppingCart_cpContainer .cpProductBox{
float:none; 
display:block;
margin:0 auto 25px auto; /* center the product */ 
border-bottom:3px solid #cccccc;
}
#W3ShoppingCart_cpContainer .cpProductBox .quickinfo-body .closebox{
font-size:17px;
}
#W3ShoppingCart_cpContainer .cpProductBox .quickinfo-body ul li{
font-size:16px;
}
#W3ShoppingCart_cpContainer .cpProductBox .cpProductItemBox .quickinfolink{
font-size:14px; 
}
#W3ShoppingCart_cpContainer .cpProductBox .quickinfo-body ul{
padding-left: 1.2em;
}
.W3ShoppingCart_ProductName{
white-space:wrap;
}
/* product page bar for site manager only */ 
.W3ShoppingCart_pageBar span{
font-size:17px; 
}
.W3ShoppingCart_pageBarStatsBlock{
display:block;
float:none;
margin-left:0;
margin-right:0;
margin-bottom:18px;
text-align:center;
}
.W3ShoppingCart_pageBarLinksBlock span{
margin-left:5px;
margin-right:5px; 
}
.W3ShoppingCart_pageBarLinksBlock span a{
text-decoration:underline !important;
}
.W3ShoppingCart_pageBarLinksBlock span.currpage{
font-weight:bold;
}
.W3ShoppingCart_pageBarLinksBlock span:first-child{
text-align:left;
} 
.W3ShoppingCart_pageBarLimitBlock form select{
font-size:17px; 
}
/* CART / Checkout1 / Checkout5  -  .css in /cart */  
#SiteBodyDiv table#sbdMain{
width:100% !important;
}
#SiteBodyDiv table#sbdMain tr td{
padding:0;
vertical-align:top;
}   
.header_for_cart table#PageBodyTable{
width:100%;
margin:0; 
border:0;
}
.header_for_cart table#PageBodyTable tr td{
vertical-align:top;  
padding:0;
border:0;
}
table#headerCartTable{/* master table in inc_HeaderCart.cfm / closed in footer */
width:100% !important; 
}  
table#headerCartTable tr td div#cartDiv{/* main overall div inside headerCartTable in header */ 
font-size:17px;   
}
table#headerCartTable tr td div#cartDiv p,
table#headerCartTable tr td div#cartDiv td,
table#headerCartTable tr td div#cartDiv div, 
table#headerCartTable tr td div#cartDiv li,
table#headerCartTable tr td div#cartDiv span{
font-size:17px;  
}
h1.cartTitle{
font-size:20px;   
}
.CartSubHead{
font-size:19px; 
}
h2.CartSubHead{
font-size:20px;   
color: #000000 !important; 
text-align:center;
}
h3.CartSubHead{
font-size:19px;   
color: #000000 !important; 
text-align:center;
}
#CartBackgroundBlackFontStyles{
width:100%;
border:0;
}
#CartBackgroundBlackFontStyles TEXTAREA, 
#CartBackgroundBlackFontStyles SELECT,
#CartBackgroundBlackFontStyles INPUT[type="text"],
#CartBackgroundBlackFontStyles INPUT[type="email"],
#CartBackgroundBlackFontStyles INPUT[type="password"],
#CartBackgroundBlackFontStyles INPUT[type="tel"]{
font-size:18px; 
}
#nameAddrFormFields div{
margin:0 0 8px 0; 
}
.cartItemTitle{font-size:21px;}
.cartItemTitleInsideBundle{font-size:20px;} 
.CartBigText{/* 4 sizes up */
font-size:21px; 
} 
.CartSmall{font-size:17px;}
.CartSmallbold{font-size:17px;}
.CartSmallGray{font-size:17px;}
.CartTinyText{font-size:16px;}
INPUT#CartTinyText{font-size:16px;}
.CartTinyTextGray{font-size:16px;}
.tinynote{font-size:16px;  font-family:arial,helvetica,sans-serif !important;}
.CartRequiredStar{font-size:19px;}
.CartBigGreenLink{font-size:21px;}/* can be either an <input button or a link */
a.CartBigGreenLink:link, 
a.CartBigGreenLink:active,
a.CartBigGreenLink:visited,
a.CartBigGreenLink:hover	{
font-size:21px;
}
.CartRateDiv .tableCellDiv{/* acts like a table cell inside div shrink to fit table */ 
padding:5px 1px 5px 1px; 
}
/*  normal submit buttons for cart */ 
INPUT#CartButton{
font-size:20px;
}
.CartShipTypeSelButton{/* for selecting shipping type on checkout0,inc_cartShipTypeUserSelection.cfm */ 
margin:8px 10px 8px 0; 
padding:5px 4px 5px 4px; 
}
/* checkout 5 receipt */ 
#checkout5_receipt .margin{
margin:12px 1px 12px 1px;
}
.cartItemHolder{
width:auto;
}
.cartItemHolder .bodyPad{
padding:0 !important;
}
/* SERVICE MENU THINGS */ 
#pagetype_servicemenu #tableMainContent{
min-height:30px;
}
#smCompleteMenu{
margin-bottom:0;
}
.smCategoryButtonContainer{
padding:4px; /* override 9 (but there is also a border making it 5 on either side) */
text-align:center;
}
a.smCategoryButton{
/* colors change per theme */ 
display:block; /* changes to 1 button per line */
/* min-width:270px !important; */
min-width:85% !important;
width:85% !important;
max-width:275px; 
overflow-x:hidden;  
margin:8px auto 8px auto !important;
}
.sm-item-box{
padding:5px; /* this with bodyPadSmall 5px on each side, makes 10 px on each side of photo on mobile */
border-radius:7px;
-moz-border-radius:7px;
}
/* END SERVICE MENU */
/* FOR PhotoSelectList products / payforms / events */
.photoSelectListFieldContainer{
width:100%;
max-width:530px;
}
.photoSelectListSelection span{
font-size:17px;    
}
/* END PhotoSelectList products / payforms / events */
/* vertical spaces are doubled for mobile */
.space5{margin-top:10px;}
.space10{margin-top:20px;}
.space15{margin-top:30px;}
.space20{margin-top:40px;}
.space25{margin-top:50px;}
.space30{margin-top:60px;}
.space35{margin-top:70px;}
.space40{margin-top:80px;}
.space45{margin-top:90px;}
.space50{margin-top:100px;}