#branding {
padding-top: 20px;
padding-bottom: 12px;
}

/*to make home page banner (the slider with images) responsive on tablet and phone*/
div.flexslider .slides > li img{
height: auto !important;
}
/*to remove the listing owner information and send inquiry button in mobile version*/
.widget.tmpl_listing_owner {
display: none !important;
}
/*to hide the view larger map button on individual listings map page (usually found beside the Get Directions button). It may link to other random business names if many are at the same address, and it doesn't work in the mobile version*/
a.large_map.b_getdirection.button {
  display: none !important;
}
/*to remove the "Reviews are disabled, but trackbacks and pingbacks are open." line that appears by default when the reviews are switched off*/
 #comments p.comments-closed {
   display: none;
}
/*to remove the triggermap function on a google map that takes the page to "all in one" map view.*/
#triggermap {
display: none;
}
/*to hide the website URLs in the popup windows on the maps until they can fix the bug in it not recognizing www.example.com (ie when http:// is not included in the submission form). See Yodiz BG-28 for more info. Update: June 12, 2018, this bug seems to be fixed now, so have commented out the change so that the web URLs display now.
.google-map-info .map-item-info .website {
    display: none;
}*/
/* to hide the Map/Satellite toggle button on all of the maps on the website. May not always work, but works for now. Not using for now because it is a useful function for ensuring your map pin is correct in the submission form. Update: June 12 2018, have enabled toggle button.
.gm-style-mtc {
  display: none;
}*/
/*to change the color of the bottom footer that contains the copyright information*/
#footer .footer_bottom {
background-color: #d0d0d0 !important;
}
/*to hide the Contact us header on the contact page template. Replaced it with a nice image.*/
h1.loop-title {
display: none;
}
/*to hide the headers on all other pages. Replaced them with nice images.*/
h1.page-title {
display: none;
}
/*To hide the number of views and the date in the Popular Posts plug in, which was showing the date it was published, so it looked like it had been last viewed 3 weeks ago or whatever. */
span.date {
    display: none;
}

.popular_posts.widget ul li .post_data p .views
{
border-right: medium none;
} 
.post_data > p {
    display: none !important;
}
.widget-title {
font-size: 18px;
line-height: 24px;
}
h3.widget-title {
font-size: 22px;
line-height: 26px;
font-weight: 300;
}
body h2 {
font-size: 22px;
line-height: 26px;
}
body h1 {
font-size: 32px;
line-height: 40px;
}
hover {
font-size: 18px;
line-height: 24px;
}
div#menu-secondary .menu li li a {
line-height: 16px;
padding:8px 18px;
}
p {
font-size: 16px;
line-height: 20px;
}
center {
font-size: 16px;
line-height: 20px;
}
div#menu-secondary .menu li a {
font-size: 16px;
}

/* PBM 20160619. The following is an explanation of how I worked out how to change the footer hover 
   colours and font weights
- rt click webpage and open "inspect window"
- top left of new window click the icon of a mouse pointer on a square
- highlight footer words "Grandma Technology" and click
- in "style" tab click on text ":hov" and click box ":hover"
- click "Computed" tab and open the filter "color"
- click first row. This takes you to admin_style.css:335
- change the color here to ensure the webpage shows the right color. Do this check before changing the custom CSS
- copy the full style block into this file and edit to change the color
- save this file and refresh the website to ensure its correct
- now we need to change the hover colour for footer menu items like "home", "privacy policy" etc
- repeat the steps above but select the footer word "home". You get the style in admin_style.css:325
- copy that block into this file. Edit out the style rules not related to the footer. Then change the colour.
- save this file and refresh the website to ensure its correct
- now we need to change the font-weight for hover over the footer items we have just changed
- repeat above steps, clicking on "home". You get to (index):187 which has:

      a:hover { font-family: 'Roboto'!important; font-style: normal!important; font-weight: 100!important; }

- we could copy this into this file, replacing "font-weight: 100" with "font-weight: bold". That will
  make all hover throughout the website use bold. This is what we want to we do the replace! It we
  wanted it only to replace font-weight in the footer we could instead add this:

      #footer .footer_bottom a:hover {
          color: #0143e1!important;
      }
*/
/* Hover colour of the Footer with the words "Grandma Technology" within (replaces admin_style.css line 335) */
#footer .footer_bottom a:hover {
    color: #0143e1!important;
}
/* Hover colour for the footer menu items (i.e. home, Privacy Policy etc (overrides part of admin_style.css:325) */
#footer .footer_bottom .menu ul#menu-footer-items li a:hover {
    color: #0143e1!important;
}
/* Make all hovers over links bold. This replaces (index):187 */
a:hover { 
    font-weight: bold!important;
    color: #0143e1!important;
}

ul li a:hover { 
    font-weight: bold!important;
    color: #0143e1!important;
}
/* Hover and focus colours for menu items. Replace admin_style.css:199 */
/*
a:hover, ul li a:hover {
    color: #0143e1!important;
    font-weight: bolder!important;
}
#footer .footer_top ul li a:hover { 
    font-weight: bold!important;
    color: #0143e1!important;
}
*/

div#menu-secondary .menu li a:hover, div#menu-secondary .menu li a.with-ul {
    color: #e0e0e0!important;
}

h2 { font-weight: 300; }

.entry-content  h2 { 
    font-weight: bold;
}

.directory-single-page .hentry .entry-header-title .entry-title { 
    font-weight: bold;
}
/* Overrides (index):177, which had font-weight:100 */
/*
h1 { color: #444444; font-family: 'Roboto'; font-style: normal; font-weight: 110; }
*/
/* To hide share and share count buttons on posts pages */
.social-media-share {
display: none;
}
/* To hide number of visits counter on individual listings pages */
.view_counter {
display: none;
}