MariaJackson1

::selection {
  color: #fff;
  background: #c30dbd;
}

MariaJackson1

<style>
/*************Advent Calendar 2017 - 6*************/
/******Three Easy to Edit Image Hover Effects******/
/******************By Divi Soup********************/
/******************Divi Theme********************/

/* http://advent2017.divisoupdemos.com/advent-6-three-easy-to-edit-image-hover-effects/ */

/***Effect 1 - Show text on hover***/

MariaJackson1

<?php
add_action( 'customize_register', 'prefix_remove_css_section', 15 );
/**
 * Remove the additional CSS section, introduced in 4.7, from the Customizer.
 * @param $wp_customize WP_Customize_Manager
 */
function prefix_remove_css_section( $wp_customize ) {
	$wp_customize->remove_section( 'custom_css' );
}

MariaJackson1

We can make our embedded videos responsive by wrapping them in an HTML element, like this:

<div class="videoWrapper">
    Your video embed code
</div>


Then, we need to add this CSS:

.videoWrapper {

MariaJackson1

https://docs.generatepress.com/article/adding-buttons-navigation/

MariaJackson1

Add this to where you want to create an anchor:
 <a name="learn-more"></a>

Make a button/link pointing to the anchor:
<a href="#learn-more">Learn More</a>

MariaJackson1

html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  }

MariaJackson1

/* --------------- Fluid Typography ------------------
-----per css tricks article:   https://css-tricks.com/snippets/css/fluid-typography/ --------------------------------- */


/* ========== Per H1 font, this scales the font-size from a minimum of 29px (at a 320 viewport) to a maximum of 67px (at a 1920px viewport). 
==================================================================== */

/* Calculation --------------------------------------------------
font-size: calc(min font size in px + (max font size DO NOT INCLUDE PX - min font size NO PX) * ((100vw - min viewport width px) / (max minus min viewport width no px)));

MariaJackson1

@media (max-width: 768px) {
  .generate-content-header {
    background-size: 100% auto;
  }
}

MariaJackson1

/* ------------------------------------------
    Basic one-column layout for all browsers
--------------------------------------------*/

.grid-container {
  max-width: 50em;
}
.grid-container > * {
  text-align: center;
  display: flex;