Simple CSS styling

Hi,
I´d like to do some styling to one of my pages:
1. Hide the title shown in here and close the gap between the slider and the list of events https://prnt.sc/mhb59p
2. Apply title theme styling to Event Calendar title styling.
Event Calendar https://prnt.sc/mhb5p2
Theme style https://prnt.sc/mhb5xb
3. Apply theme styling to Event Calendar month header:
Event Calendar https://prnt.sc/mhb67j
Theme style https://prnt.sc/mhb6gc
4. Make date info grey like the text above http://prntscr.com/mhbbig

  • Inderjeet Singh
    • Flash Drive

    Hey Pablo,

    I tested myself and created a CSS code for you.

    CSS code as per your points:

    1.

    .tribe-events-title-bar {
      display: none;
    }
    #tribe-events-content .tribe-events-list-separator-month{
           margin: 10px 0 0;
    }

    2.

    #tribe-events-content .tribe-events-list-event-title a.url {
      font-size: 26px;
      font-family: Lato;
      line-height: 30px;
      color: #373737;
    }
    #tribe-events-content span.tribe-events-event-cost {
      font-size: 22px;
    }
    #tribe-events-content h2.tribe-events-list-event-title.summary {
      border-color: #00aba5;
    }

    3.

    #tribe-events-content h2.tribe-events-list-separator-month {
       background: #00aba5;
    }
    #tribe-events #tribe-events-content h2.tribe-events-list-separator-month span {
       color: #fff;
    }

    4.

    #tribe-events-content .updated.published.time-details {
    
       color: #7c7c7c;
    }

    You can use the given below ways to add the custom CSS snippets into your theme.
    These are:
    -Customizer (Additional CSS): You can use this path to add it on: Appearance -> Customizer -> Additional CSS
    -child-theme and a custom CSS file: you need to create a custom CSS file into the child theme and add the above custom CSS snippets
    -theme options that parent theme may provide: If you have theme option available in your theme then you can also use for adding the custom CSS snippets.

    Look forward to hearing back!

    Regards,
    Inderjeet

  • Inderjeet Singh
    • Flash Drive

    Hello Pablo,

    Hope you're doing well and sorry for the late response.
    I tested and created a CSS code:

    .tribe-countdown-text a
    {
      font-size: 14px;
      text-transform: capitalize;
    }
    .tribe-countdown-text:after
    {
        display: none;
    }

    You can paste it as I explained you above message and then it will work.
    Please let me know if you need help with anything else.

    Regards,
    Inderjeet

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.