Change Font Size and Color

Marketplace Forums Themes Materialize Materialize Free Change Font Size and Color

This topic contains 4 replies, has 2 voices, and was last updated by  mythemes 3 years, 4 months ago.

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #3730

    mythemes
    Keymaster

    For custom css exists a special option:
    Admin Dashboard › Appearance › Customize › Others - "Custom css"

    Change font Size, Weight and Color ( page content ):

    .hentry, .hentry p, article p{
        font-size: 13px;
        font-weight: normal;
        color: #000;
    }
    

    Change font Size, Weight and Color ( header menu ):

    nav.mythemes-topper ul li a{
        font-size: 13px;
        font-weight: normal;
        color: #000;
    }
    
    #3978

    Jam430
    Member

    How can I change the font sizes of gallery titles and captions?

    #3979

    mythemes
    Keymaster

    You can use the custom css solution but exists multiple rule to be overwrite.

    #3981

    Jam430
    Member

    Which rules must be overwritten? I tried mythemes-text, mythemes-caption, and mythemes-title.

    #3982

    mythemes
    Keymaster

    so,

    please see the code below:

    Also I can suggest you don’t use the custom css option with so much css code. One of the best way will be to create a child theme and include in this child theme a new css file and overwrite the rules.

    .mythemes-gallery.colls-1 figure.mythemes-item figcaption h2 {
        font-size: 26px;
        line-height: 30px;
    }
    .mythemes-gallery.colls-2 figure.mythemes-item figcaption h2 {
        font-size: 22px;
        line-height: 26px;
    }
    .mythemes-gallery.colls-3 figure.mythemes-item figcaption h2 {
        font-size: 18px;
        line-height: 22px;
    }
    .mythemes-gallery.colls-4 figure.mythemes-item figcaption h2 {
        font-size: 16px;
        line-height: 18px;
    }
    .mythemes-gallery.colls-5 figure.mythemes-item figcaption h2 {
        font-size: 14px;
        line-height: 16px;
    }
    
    /* PARAGRAPHS */
    .mythemes-gallery.colls-1 figure.mythemes-item figcaption p {
        font-size: 14px;
        line-height: 16px;
    }
    .mythemes-gallery.colls-2 figure.mythemes-item figcaption p {
        font-size: 13px;
        line-height: 15px;
    }
    .mythemes-gallery.colls-3 figure.mythemes-item figcaption p {
        font-size: 12px;
        line-height: 14px;
    }
    .mythemes-gallery.colls-4 figure.mythemes-item figcaption p {
        font-size: 11px;
        line-height: 13px;
    }
    .mythemes-gallery.colls-5 figure.mythemes-item figcaption p {
        font-size: 10px;
        line-height: 12px;
    }
    
    
    /* HEADLINE */
    section.col-lg-9 .mythemes-gallery.colls-1 figure.mythemes-item figcaption h2 {
        font-size: 30px;
        line-height: 36px;
    }
    section.col-lg-9 .mythemes-gallery.colls-2 figure.mythemes-item figcaption h2 {
        font-size: 24px;
        line-height: 30px;
    }
    section.col-lg-9 .mythemes-gallery.colls-3 figure.mythemes-item figcaption h2 {
        font-size: 20px;
        line-height: 24px;
    }
    section.col-lg-9 .mythemes-gallery.colls-4 figure.mythemes-item figcaption h2 {
        font-size: 16px;
        line-height: 20px;
    }
    section.col-lg-9 .mythemes-gallery.colls-5 figure.mythemes-item figcaption h2 {
        font-size: 14px;
        line-height: 18px;
    }
    
    /* PARAGRAPHS */
    section.col-lg-9 .mythemes-gallery.colls-1 figure.mythemes-item figcaption p {
        font-size: 16px;
        line-height: 18px;
    }
    section.col-lg-9 .mythemes-gallery.colls-2 figure.mythemes-item figcaption p {
        font-size: 14px;
        line-height: 16px;
    }
    section.col-lg-9 .mythemes-gallery.colls-3 figure.mythemes-item figcaption p {
        font-size: 13px;
        line-height: 15px;
    }
    section.col-lg-9 .mythemes-gallery.colls-4 figure.mythemes-item figcaption p {
        font-size: 11px;
        line-height: 13px;
    }
    section.col-lg-9 .mythemes-gallery.colls-5 figure.mythemes-item figcaption p {
        font-size: 10px;
        line-height: 12px;
    }
    
    @media ( min-width: 992px ) and (max-width: 1199px ){
        /* HEADLINE */
        .mythemes-gallery.colls-1 figure.mythemes-item figcaption h2 {
            font-size: 30px;
            line-height: 36px;
        }
        .mythemes-gallery.colls-2 figure.mythemes-item figcaption h2 {
            font-size: 22px;
            line-height: 24px;
        }
        .mythemes-gallery.colls-3 figure.mythemes-item figcaption h2,
        .mythemes-gallery.colls-4 figure.mythemes-item figcaption h2,
        .mythemes-gallery.colls-5 figure.mythemes-item figcaption h2,
        .mythemes-gallery.colls-6 figure.mythemes-item figcaption h2,
        .mythemes-gallery.colls-7 figure.mythemes-item figcaption h2,
        .mythemes-gallery.colls-8 figure.mythemes-item figcaption h2,
        .mythemes-gallery.colls-9 figure.mythemes-item figcaption h2 {
            font-size: 16px;
            line-height: 18px;
        }
    
        /* FULL WIDTH HEADLINE */
        section.col-lg-9 .mythemes-gallery.colls-1 figure.mythemes-item figcaption h2 {
            font-size: 30px;
            line-height: 36px;
        }
        section.col-lg-9 .mythemes-gallery.colls-2 figure.mythemes-item figcaption h2 {
            font-size: 22px;
            line-height: 24px;
        }
        section.col-lg-9 .mythemes-gallery.colls-3 figure.mythemes-item figcaption h2 {
            font-size: 18px;
            line-height: 22px;
        }
    
        section.col-lg-9 .mythemes-gallery.colls-4 figure.mythemes-item figcaption h2,
        section.col-lg-9 .mythemes-gallery.colls-5 figure.mythemes-item figcaption h2,
        section.col-lg-9 .mythemes-gallery.colls-6 figure.mythemes-item figcaption h2,
        section.col-lg-9 .mythemes-gallery.colls-7 figure.mythemes-item figcaption h2,
        section.col-lg-9 .mythemes-gallery.colls-8 figure.mythemes-item figcaption h2,
        section.col-lg-9 .mythemes-gallery.colls-9 figure.mythemes-item figcaption h2 {
            font-size: 16px;
            line-height: 18px;   
        }
    
        /* PARAGRAPHS */
        .mythemes-gallery.colls-1 figure.mythemes-item figcaption p {
            font-size: 16px;
            line-height: 18px;
        }
        .mythemes-gallery.colls-2 figure.mythemes-item figcaption p {
            font-size: 13px;
            line-height: 15px;
        }
        .mythemes-gallery.colls-3 figure.mythemes-item figcaption p,
        .mythemes-gallery.colls-4 figure.mythemes-item figcaption p,
        .mythemes-gallery.colls-5 figure.mythemes-item figcaption p,
        .mythemes-gallery.colls-6 figure.mythemes-item figcaption p,
        .mythemes-gallery.colls-7 figure.mythemes-item figcaption p,
        .mythemes-gallery.colls-8 figure.mythemes-item figcaption p,
        .mythemes-gallery.colls-9 figure.mythemes-item figcaption p {
            font-size: 10px;
            line-height: 12px;
        }
    
        /* FULL WIDTH PATAGRAPHS */
        section.col-lg-9 .mythemes-gallery.colls-2 figure.mythemes-item figcaption p {
            font-size: 14px;
            line-height: 16px;
        }
        section.col-lg-9 .mythemes-gallery.colls-3 figure.mythemes-item figcaption p {
            font-size: 13px;
            line-height: 15px;
        }
        section.col-lg-9 .mythemes-gallery.colls-4 figure.mythemes-item figcaption p,
        section.col-lg-9 .mythemes-gallery.colls-5 figure.mythemes-item figcaption p,
        section.col-lg-9 .mythemes-gallery.colls-6 figure.mythemes-item figcaption p,
        section.col-lg-9 .mythemes-gallery.colls-7 figure.mythemes-item figcaption p,
        section.col-lg-9 .mythemes-gallery.colls-8 figure.mythemes-item figcaption p,
        section.col-lg-9 .mythemes-gallery.colls-9 figure.mythemes-item figcaption p {
            font-size: 11px;
            line-height: 13px;
        }
    }
    @media ( min-width: 768px ) and ( max-width: 991px ){
    
        /* HEADLINE */
        .mythemes-gallery.colls-1 figure.mythemes-item figcaption h2 {
            font-size: 26px;
            line-height: 30px;
        }
        .mythemes-gallery.colls-2 figure.mythemes-item figcaption h2,
        .mythemes-gallery.colls-3 figure.mythemes-item figcaption h2,
        .mythemes-gallery.colls-4 figure.mythemes-item figcaption h2,
        .mythemes-gallery.colls-5 figure.mythemes-item figcaption h2,
        .mythemes-gallery.colls-6 figure.mythemes-item figcaption h2,
        .mythemes-gallery.colls-7 figure.mythemes-item figcaption h2,
        .mythemes-gallery.colls-8 figure.mythemes-item figcaption h2,
        .mythemes-gallery.colls-9 figure.mythemes-item figcaption h2 {
            font-size: 16px;
            line-height: 18px;
        }
    
        /* FULL WIDTH HEADLINE */
        section.col-lg-9 .mythemes-gallery.colls-1 figure.mythemes-item figcaption h2 {
            font-size: 30px;
            line-height: 36px;
        }
    
        section.col-lg-9 .mythemes-gallery.colls-2 figure.mythemes-item figcaption h2 {
            font-size: 24px;
            line-height: 30px;
        }
    
        section.col-lg-9 .mythemes-gallery.colls-3 figure.mythemes-item figcaption h2,
        section.col-lg-9 .mythemes-gallery.colls-4 figure.mythemes-item figcaption h2,
        section.col-lg-9 .mythemes-gallery.colls-5 figure.mythemes-item figcaption h2,
        section.col-lg-9 .mythemes-gallery.colls-6 figure.mythemes-item figcaption h2,
        section.col-lg-9 .mythemes-gallery.colls-7 figure.mythemes-item figcaption h2,
        section.col-lg-9 .mythemes-gallery.colls-8 figure.mythemes-item figcaption h2,
        section.col-lg-9 .mythemes-gallery.colls-9 figure.mythemes-item figcaption h2 {
            font-size: 16px;
            line-height: 18px;
        }
    
    
        /* PARAGRAPHS */
        .mythemes-gallery.colls-1 figure.mythemes-item figcaption p {
            font-size: 14px;
            line-height: 16px;
        }
        .mythemes-gallery.colls-2 figure.mythemes-item figcaption p,
        .mythemes-gallery.colls-3 figure.mythemes-item figcaption p,
        .mythemes-gallery.colls-4 figure.mythemes-item figcaption p,
        .mythemes-gallery.colls-5 figure.mythemes-item figcaption p,
        .mythemes-gallery.colls-6 figure.mythemes-item figcaption p,
        .mythemes-gallery.colls-7 figure.mythemes-item figcaption p,
        .mythemes-gallery.colls-8 figure.mythemes-item figcaption p,
        .mythemes-gallery.colls-9 figure.mythemes-item figcaption p {
            font-size: 11px;
            line-height: 13px;
        }
    
        /* FULL WIDTH PATAGRAPHS */
        section.col-lg-9 .mythemes-gallery.colls-1 figure.mythemes-item figcaption p {
            font-size: 16px;
            line-height: 18px;
        }
        section.col-lg-9 .mythemes-gallery.colls-2 figure.mythemes-item figcaption p {
            font-size: 13px;
            line-height: 15px;
        }
    
        section.col-lg-9 .mythemes-gallery.colls-3 figure.mythemes-item figcaption p,
        section.col-lg-9 .mythemes-gallery.colls-4 figure.mythemes-item figcaption p,
        section.col-lg-9 .mythemes-gallery.colls-5 figure.mythemes-item figcaption p,
        section.col-lg-9 .mythemes-gallery.colls-6 figure.mythemes-item figcaption p,
        section.col-lg-9 .mythemes-gallery.colls-7 figure.mythemes-item figcaption p,
        section.col-lg-9 .mythemes-gallery.colls-8 figure.mythemes-item figcaption p,
        section.col-lg-9 .mythemes-gallery.colls-9 figure.mythemes-item figcaption p {
            font-size: 11px;
            line-height: 15px;
        }
    }
    @media ( min-width: 481px ) and ( max-width: 767px ){
        /* HEADLINE */
        .mythemes-gallery.colls-1 figure.mythemes-item figcaption h2{
            font-size: 24px;
            line-height: 30px;
        }
        .mythemes-gallery.colls-2 figure.mythemes-item figcaption h2,
        .mythemes-gallery.colls-3 figure.mythemes-item figcaption h2,
        .mythemes-gallery.colls-4 figure.mythemes-item figcaption h2,
        .mythemes-gallery.colls-5 figure.mythemes-item figcaption h2,
        .mythemes-gallery.colls-6 figure.mythemes-item figcaption h2,
        .mythemes-gallery.colls-7 figure.mythemes-item figcaption h2,
        .mythemes-gallery.colls-8 figure.mythemes-item figcaption h2,
        .mythemes-gallery.colls-9 figure.mythemes-item figcaption h2 {
            font-size: 18px;
            line-height: 22px;
        }
    
        section.col-lg-9 .mythemes-gallery.colls-1 figure.mythemes-item figcaption h2{
            font-size: 24px;
            line-height: 30px;
        }
        section.col-lg-9 .mythemes-gallery.colls-2 figure.mythemes-item figcaption h2,
        section.col-lg-9 .mythemes-gallery.colls-3 figure.mythemes-item figcaption h2,
        section.col-lg-9 .mythemes-gallery.colls-4 figure.mythemes-item figcaption h2,
        section.col-lg-9 .mythemes-gallery.colls-5 figure.mythemes-item figcaption h2,
        section.col-lg-9 .mythemes-gallery.colls-6 figure.mythemes-item figcaption h2,
        section.col-lg-9 .mythemes-gallery.colls-7 figure.mythemes-item figcaption h2,
        section.col-lg-9 .mythemes-gallery.colls-8 figure.mythemes-item figcaption h2,
        section.col-lg-9 .mythemes-gallery.colls-9 figure.mythemes-item figcaption h2 {
            font-size: 18px;
            line-height: 22px;
        }
    
        /* PARAGRAPHS */
        .mythemes-gallery.colls-1 figure.mythemes-item figcaption p{
            font-size: 14px;
            line-height: 18px;
        }
        .mythemes-gallery.colls-2 figure.mythemes-item figcaption p,
        .mythemes-gallery.colls-3 figure.mythemes-item figcaption p,
        .mythemes-gallery.colls-4 figure.mythemes-item figcaption p,
        .mythemes-gallery.colls-5 figure.mythemes-item figcaption p,
        .mythemes-gallery.colls-6 figure.mythemes-item figcaption p,
        .mythemes-gallery.colls-7 figure.mythemes-item figcaption p,
        .mythemes-gallery.colls-8 figure.mythemes-item figcaption p,
        .mythemes-gallery.colls-9 figure.mythemes-item figcaption p {
            font-size: 11px;
            line-height: 15px;
        }
    }
    
Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.

reutzel-kamilah