Change colors...resize some text....

Hi,

  1. How can I change the hover color of the of the posts title on an archive page? I tried using the following css, but it’s not working?

#blog .blog-post .blog-post-title a:hover {
color:#dd6714 !important;
}

  1. How can I change the color of the lines below “Search”, “Like Us on Facebook”, “Follow Us on Twitter”, “Recent Posts”, etc on the archive and posts pages?

  2. How can I change the size of the default site tagline (Blog Jumbotron Titles)?

  3. How can I change the size of the entry text (Jumbotron Section) on the homepage (static front page)?

  4. How can I hide the entry text for the services widgets when the site is being viewed on a mobile phone? Right now, the text for each service overlaps.

TIA

GWA

Additional info:

I am using a child theme. The URL is:

1. How can I change the hover color of the of the posts title on an archive page? I tried using the following css, but it’s not working ```

#blog .blog-post .blog-post-title a:hover {
color:#dd6714 !important;
}


</blockquote>

<strong>Try to delete !important.</strong>


<blockquote>2. How can I change the color of the lines below “Search”, “Like Us on Facebook”, “Follow Us on Twitter”, “Recent Posts”, etc on the archive and posts pages?</blockquote>

<strong>Try this code:

.widget .widget-title:before {
background-color: #f1d204;
}



</strong>

<blockquote>
3. How can I change the size of the default site tagline (Blog Jumbotron Titles)?</blockquote>

<strong>With this:

#header .bottom-header h2{
font-size:30px;
}

</strong>

<blockquote>4. How can I change the size of the entry text (Jumbotron Section) on the homepage (static front page)?</blockquote>

<strong>Any change in the jumbotron section title will affect other sections as well. so if you use the code above, it will affect jumbotron section as well</strong>

5. How can I hide the entry text for the services widgets when the site is being viewed on a mobile phone? Right now, the text for each service overlaps.

<strong>With this CSS code:

@media only screen and (max-width: 1024px) {
#services .section-content .service .service-entry{
display:none;
}
}

</strong>

Thanks,

Cristian

Thanks Christian.

  1. It still doesn’t work. Strangely, when I wasn’t using a child theme, my code worked. Now that I am using a child theme, it doesn’t work.
  2. This works. Thanks!
  3. Thanks. Actually, I want to change the second line of text, not the first line. I was able to do it using:
    #header .bottom-header p { font-size:30px; }
  4. OK. thanks.
  5. This works! Thanks. What is the breakpoint for tablets? I want the text to show for desktops and tablet, not mobile phones. With this code, it only shows on desktops, not tablets.

Hi @mspierce,

1. It still doesn’t work. Strangely, when I wasn’t using a child theme, my code worked. Now that I am using a child theme, it doesn’t work

This is strange because as you said the other code works. Could you try install a css plugin and see if it gets better? Install the simple custom css from here: Simple Custom CSS – WordPress plugin | WordPress.org

Breakpoints:
phone (usually the iPhone at 320px and 480px),
the tablet (usually the iPad at 768px and 1024px)

I made a mistake first, try to put min width:

@media only screen and (min-width: 768px) {
#services .section-content .service .service-entry{
display:none;
}
}

thanks,

Cristian

Thanks for your help.

  1. I was able to use this code successfully:

#blog .blog-post a:hover {
color:#dd6714 !important;
}

  1. I am using the following code to stop the service entry text from showing on smal screens:

@media only screen and (max-width: 768px) { #services .section-content .service .service-entry{ display:none; } }

The problem is that this also hides the service <h3> and <p>. See the attached image.

This is such a beautiful theme! Thank you so much for it.

I am interested in the same issue:

3. How can I change the size of the default site tagline (Blog Jumbotron Titles)?
I would like the “First Word From Title” to remain as it is, but the “Entry” to be larger, like the H2 in a regular post.
I tried the code you provided in answer, but it changed the font on both the FWFT and Entry.
Thank you for any insight/help!